:root{--color-primary:#4f46e5;--color-primary-dark:#3730a3;--color-primary-light:#e2dfff;--color-secondary:#006a61;--color-secondary-light:#86f2e4;--color-background:#f7f9fb;--color-surface:#fff;--color-surface-dim:#d8dadc;--color-surface-container:#eceef0;--color-text:#191c1e;--color-text-muted:#464555;--color-border:#c7c4d8;--color-error:#ba1a1a;--color-success:#006a61;--font-display:"Plus Jakarta Sans",sans-serif;--shadow-base:0 4px 10px rgba(0,0,0,.02);--shadow-card:0 10px 30px rgba(0,0,0,.04),0 1px 8px rgba(79,70,229,.02);--shadow-hover:0 20px 40px rgba(79,70,229,.08),0 4px 12px rgba(0,0,0,.03);--shadow-overlay:0 25px 50px rgba(0,0,0,.12);--radius-sm:4px;--radius-md:12px;--radius-lg:24px;--transition:all 0.3s cubic-bezier(0.4,0,0.2,1)}.dark{--color-primary:#6366f1;--color-primary-dark:#818cf8;--color-primary-light:#3730a3;--color-secondary:#2dd4bf;--color-secondary-light:#115e59;--color-background:#000;--color-surface:#111;--color-surface-dim:#1a1a1a;--color-surface-container:#1a1a1a;--color-text:#fff;--color-text-muted:#a3a3a3;--color-border:#333;--color-error:#f87171;--color-success:#34d399;--shadow-base:0 4px 10px rgba(0,0,0,.5);--shadow-card:0 10px 30px rgba(0,0,0,.7),0 1px 8px rgba(79,70,229,.1);--shadow-hover:0 20px 40px rgba(79,70,229,.15),0 4px 12px rgba(0,0,0,.5);--shadow-overlay:0 25px 50px rgba(0,0,0,.9)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-display);background-color:var(--color-background);color:var(--color-text);line-height:1.6;-webkit-font-smoothing:antialiased;padding-bottom:70px}.material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.sticky-header{position:-webkit-sticky;position:sticky;top:0;z-index:100;background:rgba(247,249,251,.8);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(199,196,216,.3);transition:var(--transition)}.dark .sticky-header{background:rgba(0,0,0,.8);border-bottom:1px solid hsla(0,0%,100%,.1)}.header-container{max-width:1200px;margin:0 auto;padding:1rem 2rem;justify-content:space-between}.header-container,.logo{display:flex;align-items:center}.logo{font-size:1.5rem;font-weight:800;color:var(--color-primary);text-decoration:none;gap:.5rem}.main-wrapper{max-width:1200px;margin:0 auto;padding:2.5rem 2rem;min-height:calc(100vh - 120px)}.hero-banner{background:linear-gradient(135deg,var(--color-primary-light) 0,#e0f2fe 100%);border-radius:var(--radius-lg);padding:4rem 3rem;margin-bottom:3.5rem;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;box-shadow:var(--shadow-card)}.hero-tag{color:var(--color-primary);font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;margin-bottom:.75rem}.hero-title{font-size:3rem;font-weight:800;line-height:1.1;color:var(--color-text);max-width:600px;margin-bottom:1rem}.hero-subtitle{font-size:1.125rem;color:var(--color-text-muted);max-width:500px;margin-bottom:2rem}.filter-bar{display:flex;gap:.75rem;margin-bottom:2.5rem;overflow-x:auto;padding-bottom:.5rem}.filter-chip{background-color:var(--color-surface);color:var(--color-text-muted);border:1px solid var(--color-border);padding:.5rem 1.25rem;border-radius:9999px;font-weight:700;font-size:.85rem;cursor:pointer;white-space:nowrap;transition:var(--transition)}.filter-chip.active,.filter-chip:hover{background-color:var(--color-primary);color:#fff;border-color:var(--color-primary)}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-gap:2rem;gap:2rem;margin-bottom:4rem}.product-card{background:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card);border:1px solid rgba(199,196,216,.2);display:flex;flex-direction:column;transition:var(--transition)}.product-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover)}.image-container{width:100%;height:240px;position:relative;overflow:hidden;background-color:var(--color-surface-container)}.product-image{width:100%;height:100%;object-fit:cover;transition:var(--transition)}.product-card:hover .product-image{transform:scale(1.05)}.product-details{padding:1.5rem;display:flex;flex-direction:column;flex-grow:1}.product-category{font-size:.75rem;font-weight:800;color:var(--color-secondary);text-transform:uppercase;margin-bottom:.5rem}.product-name{font-size:1.15rem;font-weight:700;color:var(--color-text);margin-bottom:.5rem;text-decoration:none}.product-name:hover{color:var(--color-primary)}.stock-tag{font-size:.75rem;font-weight:700;color:var(--color-success);margin-bottom:1rem}.stock-tag.out{color:var(--color-error)}.price-row{display:flex;justify-content:space-between;align-items:center;margin-top:auto}.product-price{font-size:1.25rem;font-weight:800;color:var(--color-text)}.btn{background-color:var(--color-primary);color:#fff;border:none;padding:.65rem 1.25rem;border-radius:var(--radius-md);font-weight:700;font-size:.9rem;cursor:pointer;transition:var(--transition)}.btn:hover{background-color:var(--color-primary-dark)}.btn-secondary{background-color:transparent;color:var(--color-primary);border:1px solid var(--color-primary)}.btn-secondary:hover{background-color:var(--color-primary-light)}.btn:disabled{background-color:var(--color-surface-dim);color:var(--color-text-muted);cursor:not-allowed}.footer{border-top:1px solid var(--color-border);background-color:var(--color-surface);padding:3rem 0;margin-top:auto}.footer-container{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;justify-content:space-between;align-items:center}.details-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:3.5rem;gap:3.5rem;margin-top:1.5rem}.details-image{width:100%;height:480px;border-radius:var(--radius-lg);object-fit:cover;box-shadow:var(--shadow-card)}.details-info{display:flex;flex-direction:column;gap:1.5rem}.cart-layout{display:grid;grid-template-columns:2fr 1fr;grid-gap:2.5rem;gap:2.5rem}.auth-box{max-width:420px;margin:4rem auto;background:var(--color-surface);padding:2.5rem;border-radius:var(--radius-lg);box-shadow:var(--shadow-card);border:1px solid rgba(199,196,216,.2)}.form-group{margin-bottom:1.25rem;display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:700;font-size:.85rem;color:var(--color-text-muted)}.form-input{width:100%;padding:.85rem;border-radius:var(--radius-md);border:1px solid var(--color-border);font-family:var(--font-display);font-size:.95rem;outline:none;background-color:var(--color-surface-container);color:var(--color-text);transition:var(--transition)}.form-input:focus{border-color:var(--color-primary);background-color:var(--color-surface);box-shadow:0 0 0 3px rgba(79,70,229,.1)}.alert-banner{background-color:var(--color-surface-container);color:var(--color-text);border:1px solid var(--color-border);padding:.75rem 1.5rem;margin-bottom:2rem;font-weight:600;align-items:center;gap:.75rem}.alert-banner,.cart-item-card{border-radius:var(--radius-md);display:flex}.cart-item-card{background:var(--color-surface);box-shadow:var(--shadow-base);border:1px solid rgba(199,196,216,.2);margin-bottom:1rem;padding:1.25rem;flex-direction:column;gap:1rem}.cart-item-main{display:flex;gap:1rem;align-items:center;position:relative}.cart-item-image{width:80px;height:80px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0}.cart-item-info{flex-grow:1;min-width:0}.cart-item-name{font-size:1.05rem;font-weight:700;text-decoration:none;color:var(--color-text);display:block;margin-bottom:.25rem}.cart-item-name:hover{color:var(--color-primary)}.cart-item-meta{font-size:.85rem;flex-direction:column;gap:.25rem}.cart-item-meta,.cart-item-remove{color:var(--color-text-muted);display:flex}.cart-item-remove{background:transparent;border:1px solid var(--color-border);width:32px;height:32px;border-radius:50%;cursor:pointer;align-items:center;justify-content:center;transition:var(--transition);align-self:flex-start}.cart-item-remove:hover{color:var(--color-error);border-color:var(--color-error);background-color:#fee2e2}.cart-item-actions{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(199,196,216,.15);padding-top:.75rem}.qty-adjuster{display:flex;align-items:center;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}.qty-btn{background:transparent;border:none;width:32px;height:32px;cursor:pointer;font-weight:700;color:var(--color-text);transition:var(--transition)}.qty-btn:hover{background-color:var(--color-primary-light);color:var(--color-primary)}.qty-value{padding:0 .75rem;font-weight:700;font-size:.95rem}.cart-item-price-group{text-align:right}.cart-item-total-price{font-weight:800;font-size:1.15rem;color:var(--color-text)}.cart-item-unit-price{font-size:.8rem;color:var(--color-text-muted)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--color-surface);border-radius:var(--radius-lg);padding:2.5rem;width:calc(100% - 2rem);max-width:480px;box-shadow:var(--shadow-overlay);border:1px solid var(--color-border)}.product-purchase-row{display:flex;gap:1.5rem;align-items:center;margin-top:1rem}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:999;background:var(--color-surface);border-top:1px solid var(--color-border);display:flex;justify-content:space-around;align-items:center;padding:.5rem 0;box-shadow:0 -4px 20px rgba(0,0,0,.05)}.dark .bottom-nav{box-shadow:0 -4px 20px rgba(0,0,0,.4)}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;gap:.15rem;text-decoration:none;color:var(--color-text-muted);font-size:.7rem;font-weight:600;padding:.25rem .75rem;border-radius:8px;transition:var(--transition);position:relative}.bottom-nav-item.active{color:var(--color-primary)}.bottom-nav-item .material-symbols-rounded{font-size:1.5rem}.bottom-nav-item .nav-badge{position:absolute;top:-2px;right:4px;background-color:var(--color-primary);color:#fff;font-size:.6rem;font-weight:800;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center}.order-card{background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-card);border:1px solid rgba(199,196,216,.2);padding:1.5rem;margin-bottom:1.25rem}.order-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.order-status-badge{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:700}.order-status-badge.pending{background-color:#fef3c7;color:#92400e}.order-status-badge.delivered,.order-status-badge.paid{background-color:#d1fae5;color:#065f46}.order-status-badge.cancelled{background-color:#fee2e2;color:#991b1b}.order-item-row{display:flex;align-items:center;gap:1rem;padding:.75rem 0;border-bottom:1px solid rgba(199,196,216,.15)}.order-item-row:last-child{border-bottom:none}.profile-header{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:2rem 0}.profile-avatar{width:80px;height:80px;border-radius:50%;background:var(--color-primary-light);display:flex;align-items:center;justify-content:center;font-size:2rem;color:var(--color-primary);font-weight:800}.address-card{background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-base);border:1px solid rgba(199,196,216,.2);padding:1.25rem;margin-bottom:1rem}.address-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.address-label-badge{display:flex;align-items:center;gap:.35rem;padding:.2rem .6rem;border-radius:6px;font-size:.75rem;font-weight:700;background-color:var(--color-primary-light);color:var(--color-primary)}.address-actions{display:flex;gap:.5rem}.address-action-btn{background:none;border:none;cursor:pointer;color:var(--color-text-muted);padding:.25rem;border-radius:4px;transition:var(--transition)}.address-action-btn:hover{color:var(--color-primary);background-color:var(--color-primary-light)}.search-container{position:relative;margin-bottom:1.5rem}.search-container .material-symbols-rounded{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--color-text-muted);font-size:1.25rem}.search-container input{padding-left:3rem}.card{box-shadow:var(--shadow-card)}.card,.panel{background:var(--color-surface);border-radius:var(--radius-md);border:1px solid rgba(199,196,216,.2);padding:1.5rem}.panel{box-shadow:var(--shadow-base);margin-bottom:1rem}.badge{display:inline-block;padding:.2rem .6rem;border-radius:6px;font-size:.75rem;font-weight:700}.badge-info{background-color:var(--color-primary-light);color:var(--color-primary)}.badge-success{background-color:#d1fae5;color:#065f46}.badge-warning{background-color:#fef3c7;color:#92400e}.badge-danger{background-color:#fee2e2;color:#991b1b}@media (max-width:1024px){.main-wrapper{padding:1.5rem 1rem}}@media (max-width:768px){.header-container{padding:.75rem 1rem}.hero-banner{padding:2.5rem 1.5rem;margin-bottom:2rem}.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem;margin-bottom:1.5rem}.details-grid{grid-template-columns:1fr;gap:2rem}.details-image{height:320px}.cart-layout{grid-template-columns:1fr;gap:1.5rem}.profile-layout{grid-template-columns:1fr!important;gap:1.5rem!important}}@media (max-width:480px){.products-grid{grid-template-columns:1fr;gap:1.25rem}.price-row{flex-direction:column;align-items:flex-start;gap:.75rem;width:100%}.price-row>div{width:100%;justify-content:space-between}}@media (min-width:769px){.cart-item-card{flex-direction:row;align-items:center;justify-content:space-between}.cart-item-main{flex-grow:1;margin-right:2rem}.cart-item-actions{border-top:none;padding-top:0;gap:2rem;flex-shrink:0}.cart-item-remove{order:3;align-self:center}}@media (max-width:480px){.product-purchase-row{flex-direction:column;align-items:stretch;gap:1rem}.product-purchase-row>div{display:flex;justify-content:space-between}.product-purchase-row>button{width:100%;text-align:center}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-shimmer{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 50%,#e2e8f0 75%);background-size:200% 100%;animation:shimmer 1.5s linear infinite}.dark .skeleton-shimmer{background:linear-gradient(90deg,#1c1c1c 25%,#2a2a2a 50%,#1c1c1c 75%);background-size:200% 100%;animation:shimmer 1.5s linear infinite}.skeleton-card{background:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card);border:1px solid rgba(199,196,216,.2);display:flex;flex-direction:column;height:420px}.skeleton-image{width:100%;height:240px}.skeleton-details{padding:1.5rem;display:flex;flex-direction:column;flex-grow:1}.skeleton-category{height:.75rem;width:30%}.skeleton-category,.skeleton-title{border-radius:var(--radius-sm);margin-bottom:.75rem}.skeleton-title{height:1.25rem;width:75%}.skeleton-stock{height:.75rem;width:50%;border-radius:var(--radius-sm);margin-bottom:1.5rem}.skeleton-price-row{display:flex;justify-content:space-between;align-items:center;margin-top:auto}.skeleton-price{height:1.5rem;width:30%;border-radius:var(--radius-sm)}.skeleton-buttons{display:flex;gap:.5rem;width:55%}.skeleton-btn{height:2.25rem;flex-grow:1;border-radius:var(--radius-md)}@keyframes fadeInUp{0%{transform:translate(-50%,50px);opacity:0}to{transform:translate(-50%);opacity:1}}@keyframes slideIn{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}.profile-trigger-btn:hover{transform:scale(1.05);box-shadow:0 0 10px rgba(79,70,229,.15)}#loader{position:fixed;inset:0;z-index:99999;background:#000;display:flex;align-items:center;justify-content:center;transition:opacity .5s ease,visibility .5s ease}#loader.hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:0}.loader-logo-text{font-family:Plus Jakarta Sans,sans-serif;font-size:2.25rem;font-weight:800;color:#fff;letter-spacing:-.02em;margin-bottom:2rem;display:flex;align-items:center;gap:.6rem;animation:loaderPulse 1.5s ease-in-out infinite;white-space:nowrap}.loader-logo-text .loader-emoji{font-size:2.5rem}.loader-logo-text .loader-brand{color:#6366f1}.loader-bar{width:200px;height:3px;background:#1a1a2e;border-radius:3px;overflow:hidden}.loader-progress{height:100%;width:0;background:linear-gradient(90deg,#6366f1,#818cf8);border-radius:3px;animation:loaderFill 1.5s ease-out forwards}@keyframes loaderFill{0%{width:0}30%{width:30%}60%{width:60%}80%{width:80%}to{width:100%}}@keyframes loaderPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.96)}}@media (max-width:768px){.modal-content{max-width:100%!important;margin:.5rem;padding:1.5rem!important;max-height:95vh!important;border-radius:12px!important}}.order-success-container{max-width:600px;margin:0 auto;padding:2rem 1rem}.order-success-header{text-align:center;margin-bottom:2rem}.order-success-icon{font-size:4rem;color:#4caf50;display:block;margin-bottom:.5rem}.order-success-card{padding:1.5rem;margin-bottom:1.5rem}.order-success-actions{display:flex;gap:1rem;justify-content:center}@media (max-width:768px){.order-success-actions{flex-direction:column;align-items:stretch}.order-success-actions .btn{min-height:44px;justify-content:center}}