@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Pacifico&family=Quicksand:wght@300..700&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap";.loading-spinner{border-radius:var(--radius-full);border-style:solid;border-color:var(--color-gray-200);border-top-color:var(--color-primary);animation:spin .8s linear infinite}.loading-spinner--small{width:24px;height:24px;border-width:2px}.loading-spinner--medium{width:32px;height:32px;border-width:3px}.loading-spinner--large{width:40px;height:40px;border-width:4px}.app{min-height:100vh;display:flex;flex-direction:column}.loading-container{min-height:85vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.admin-sidebar{position:fixed;top:0;left:0;height:100vh;width:var(--sidebar-width-collapsed);background-color:var(--color-gray-800);display:flex;flex-direction:column;transition:width var(--transition-fast);z-index:var(--z-fixed);overflow:hidden}.sidebar-open .admin-sidebar{width:var(--sidebar-width-open)}.sidebar-header{display:flex;align-items:center;justify-content:flex-end;padding:var(--spacing-base);min-height:var(--topbar-height);border-bottom:1px solid rgba(255,255,255,.08);gap:var(--spacing-sm)}.sidebar-open .sidebar-header{justify-content:space-between}.sidebar-logo{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-xl);color:var(--color-primary);white-space:nowrap;overflow:hidden}.sidebar-toggle{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);color:var(--color-gray-400);font-size:var(--font-size-xl);transition:background-color var(--transition-base),color var(--transition-base)}.sidebar-toggle:hover{background-color:var(--color-gray-600);color:var(--color-white)}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:var(--spacing-xs);padding:var(--spacing-base) var(--spacing-sm);overflow-y:auto;overflow-x:hidden}.sidebar-nav-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);border-radius:var(--radius-base);color:var(--color-gray-400);text-decoration:none;white-space:nowrap;transition:background-color var(--transition-fast),color var(--transition-fast);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.sidebar-nav-item:hover{background-color:var(--color-gray-600);color:var(--color-white)}.sidebar-nav-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;text-decoration:none}.sidebar-nav-item.active{background-color:var(--color-primary);color:var(--color-white)}.sidebar-nav-item.active:hover{background-color:var(--color-primary)}.sidebar-nav-icon{font-size:1.25rem;flex-shrink:0;display:flex;align-items:center}.sidebar-nav-label{overflow:hidden}.sidebar-footer{padding:var(--spacing-base) var(--spacing-sm);border-top:1px solid var(--color-gray-600)}.sidebar-logout{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);border-radius:var(--radius-base);width:100%;color:var(--color-gray-400);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:background-color var(--transition-fast),color var(--transition-fast);white-space:nowrap}.sidebar-logout:hover{background-color:var(--color-gray-600);color:var(--color-error)}:root{--sidebar-width-open: 240px;--sidebar-width-collapsed: 64px}.admin-layout{display:flex;min-height:100vh}.admin-main{flex:1;display:flex;flex-direction:column;min-height:100vh;margin-left:var(--sidebar-width-collapsed);transition:margin-left var(--transition-base)}.sidebar-open .admin-main{margin-left:var(--sidebar-width-open)}.admin-content{flex:1;padding:var(--spacing-xl);overflow-y:auto}.nav{display:flex;gap:0;align-items:center;padding:0;position:relative;font-family:var(--font-body)}@media(max-width:991px){.nav{display:none}}.nav-loading{padding:var(--spacing-base) 0;color:var(--text-primary);font-size:var(--font-size-sm);font-family:var(--font-body);text-transform:uppercase;letter-spacing:.1em}.nav-error{padding:var(--spacing-base) 0;color:var(--color-error);font-size:var(--font-size-sm);font-family:var(--font-body)}.nav-link{display:flex;align-items:center;gap:.25rem;padding:var(--spacing-base) var(--spacing-lg);color:var(--text-primary);font-weight:var(--font-weight-medium);font-size:var(--font-size-base);letter-spacing:.02em;text-decoration:none;background:none;border:none;cursor:pointer;transition:all var(--transition-base);position:relative;white-space:nowrap;font-family:inherit}.nav-link:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%) scaleX(0);width:80%;height:3px;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 100%);transition:transform var(--transition-base);border-radius:var(--radius-xs)}.nav-link:hover,.nav-link--active{color:var(--color-primary)}.nav-link:hover:before,.nav-link--active:before{transform:translate(-50%) scaleX(1)}.nav-link svg{transition:transform var(--transition-base)}.nav-link--active svg{transform:rotate(180deg)}.nav-chevron{font-size:var(--font-size-sm);opacity:.6}.menu{position:absolute;top:100%;left:0;width:100%;min-width:600px;max-width:1280px;background:var(--color-white);border-top:3px solid var(--color-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-xl);z-index:var(--z-dropdown);margin-top:-12px;animation:menuSlideIn .3s cubic-bezier(.4,0,.2,1)}.menu-container{padding:var(--spacing-3xl) var(--spacing-4xl);max-height:70vh;overflow-y:auto}.menu-container::-webkit-scrollbar{width:6px}.menu-container::-webkit-scrollbar-track{background:var(--color-gray-100)}.menu-container::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:var(--radius-sm)}.menu-container::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.menu-container{scrollbar-width:thin;scrollbar-color:var(--color-primary) var(--color-gray-100)}.menu-header{margin-bottom:var(--spacing-base);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--color-gray-200)}.menu-header h3{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);font-family:var(--font-heading);color:var(--text-primary);margin:0 0 var(--spacing-sm) 0;letter-spacing:-.02em;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.menu-description{font-size:var(--font-size-base);color:var(--color-gray-600);margin:0;line-height:var(--line-height-relaxed)}.menu-grid{display:flex;flex-wrap:wrap;gap:var(--spacing-lg) var(--spacing-sm);margin-bottom:var(--spacing-xl)}.menu-section{flex:0 0 auto;min-width:200px;max-width:280px;padding:var(--spacing-md);background:linear-gradient(to bottom,#ff6b6b05,#ff6b6b0d);transition:all var(--transition-base);border-radius:var(--radius-sm)}.menu-section:hover{background:linear-gradient(to bottom,#ff6b6b0d,#ff6b6b14);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b6b1a}.menu-section-title{display:block;font-size:var(--font-size-base);font-weight:var(--font-weight-bold);font-family:var(--font-heading);color:var(--text-primary);text-decoration:none;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);transition:color var(--transition-base)}.menu-section-title:hover{color:var(--color-primary)}.menu-list{list-style:none;padding:0;margin:0}.menu-list li{margin-bottom:var(--spacing-xs)}.menu-list li:last-child{margin-bottom:0}.menu-list a{display:block;padding:var(--spacing-xs) 0;color:var(--color-gray-600);font-size:var(--font-size-sm);text-decoration:none;transition:all var(--transition-base);position:relative;padding-left:var(--spacing-base)}.menu-list a:before{content:"•";position:absolute;left:0;color:var(--color-primary);opacity:.5;transition:all var(--transition-base)}.menu-list a:hover{color:var(--color-primary);padding-left:calc(var(--spacing-base) + 4px)}.menu-list a:hover:before{opacity:1}.menu-footer{display:flex;padding-top:var(--spacing-lg);border-top:2px solid var(--color-gray-200)}.menu-view-all{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary) 100%);color:var(--color-white);font-weight:var(--font-weight-semibold);font-size:var(--font-size-base);text-decoration:none;border-radius:var(--radius-md);transition:all var(--transition-base);box-shadow:0 2px 8px #ff6b6b40}.menu-view-all:hover{transform:translateY(-2px);box-shadow:0 4px 16px #ff6b6b59;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary) 100%)}.menu-view-all:active{transform:translateY(0)}.mobile-nav{display:flex;flex-direction:column;gap:0;font-family:var(--font-body)}@media(min-width:992px){.mobile-nav{display:none}}.mobile-nav-item{border-bottom:var(--border-width) solid var(--color-gray-200)}.mobile-nav-item:last-child{border-bottom:none}.mobile-nav-button,.mobile-nav-link{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-md) 0;min-height:44px;background:none;border:none;color:var(--text-primary);font-family:var(--font-body);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);text-align:left;text-decoration:none;transition:color var(--transition-base);-webkit-tap-highlight-color:rgba(255,107,107,.1)}.mobile-nav-button--active,.mobile-nav-link--active{color:var(--color-primary)}.mobile-nav-button:active,.mobile-nav-link:active{opacity:.7}.mobile-nav-chevron{font-size:var(--font-size-xl);transition:transform var(--transition-base);color:var(--color-primary)}.mobile-nav-chevron--active{transform:rotate(180deg)}.mobile-submenu{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1);background:var(--color-gray-50);margin:0 calc(var(--spacing-base) * -1)}.mobile-submenu--active{grid-template-rows:1fr}.mobile-submenu>div{overflow:hidden}.mobile-submenu-group{padding:var(--spacing-md);margin-bottom:var(--spacing-xs)}.mobile-submenu-group:last-child{margin-bottom:var(--spacing-base)}.mobile-submenu-title{display:block;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);font-family:var(--font-heading);color:var(--text-primary);text-decoration:none;margin-bottom:var(--spacing-md);padding:var(--spacing-md);min-height:44px;display:flex;align-items:center;background:var(--color-white);border-left:3px solid var(--color-primary);transition:opacity var(--transition-base);-webkit-tap-highlight-color:rgba(255,107,107,.1)}.mobile-submenu-title:active{opacity:.7;background:#ff6b6b0d}.mobile-submenu-list{list-style:none;padding:0 0 0 var(--spacing-md);margin:0}.mobile-submenu-list li{margin-bottom:var(--spacing-xs)}.mobile-submenu-list li:last-child{margin-bottom:0}.mobile-submenu-list a{display:flex;align-items:center;min-height:40px;padding:var(--spacing-sm) var(--spacing-md);color:var(--color-gray-600);font-size:var(--font-size-sm);text-decoration:none;border-radius:var(--radius-sm);transition:opacity var(--transition-base);-webkit-tap-highlight-color:rgba(255,107,107,.1)}.mobile-submenu-list a:active{opacity:.7;background:var(--color-white);color:var(--color-primary)}.nav-link:focus-visible,.mobile-nav-button:focus-visible,.mobile-nav-link:focus-visible,.menu-section-title:focus-visible,.menu-list a:focus-visible,.menu-view-all:focus-visible,.mobile-submenu-title:focus-visible,.mobile-submenu-list a:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(prefers-contrast:high){.nav-link:focus-visible,.mobile-nav-button:focus-visible,.mobile-nav-link:focus-visible{outline-width:3px}.menu{border-top-width:4px}}.search-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--color-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);overflow:hidden;z-index:var(--z-dropdown);max-height:500px;display:flex;flex-direction:column}.dropdown-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) var(--spacing-lg);border-bottom:var(--border-width) solid var(--color-gray-200);background:var(--color-gray-50)}.results-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-gray-500);text-transform:uppercase;letter-spacing:.5px}.results-count{font-size:var(--font-size-xs);color:var(--color-gray-400)}.search-results{overflow-y:auto;max-height:400px}.search-result-item{display:flex;align-items:center;gap:var(--spacing-lg);width:100%;padding:var(--spacing-lg) var(--spacing-lg);border:none;background:var(--color-white);cursor:pointer;text-align:left;transition:background-color var(--transition-fast);border-bottom:var(--border-width) solid var(--color-gray-100)}.search-result-item:last-child{border-bottom:none}.search-result-item:hover{background-color:var(--color-gray-50)}.result-image{width:56px;height:56px;flex-shrink:0;border-radius:var(--radius-md);overflow:hidden;background:var(--color-gray-100);display:flex;align-items:center;justify-content:center}.result-image img{width:100%;height:100%;object-fit:cover}.result-placeholder{color:var(--color-gray-300);font-size:24px}.result-content{flex:1;min-width:0}.result-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-primary);margin:0 0 var(--spacing-xs) 0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:var(--line-height-tight)}.result-meta{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.result-brand{font-size:var(--font-size-xs);color:var(--text-secondary)}.result-price{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-primary)}.search-empty,.search-error,.search-hint{padding:var(--spacing-3xl) var(--spacing-2xl);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md)}.empty-icon,.hint-icon{font-size:32px;color:var(--color-gray-300);margin-bottom:var(--spacing-xs)}.search-empty p,.search-hint p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0;font-weight:var(--font-weight-medium)}.empty-hint{font-size:var(--font-size-xs);color:var(--color-gray-400)}.search-error p{color:var(--color-error);font-size:var(--font-size-sm);margin:0}.search-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-3xl) var(--spacing-2xl);text-align:center;min-height:300px}.search-wrap p{font-size:var(--font-size-base);color:var(--text-secondary);margin-bottom:var(--spacing-xl);max-width:500px}@keyframes spin{to{transform:rotate(360deg)}}.view-all-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);width:100%;padding:14px;border:none;background:var(--color-gray-50);color:var(--color-info);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);border-top:var(--border-width) solid var(--color-gray-200)}.view-all-button:hover{background:var(--color-gray-100);color:#2563eb}.view-all-button svg{font-size:16px}@media(max-width:768px){.search-dropdown{position:fixed;top:160px;left:0;right:0;border-radius:0;max-height:calc(100vh - 200px)}.search-results{max-height:calc(100vh - 160px)}}.search-bar{position:relative}.search-input-wrapper{position:relative;display:flex;align-items:center;background:var(--bg-input);border-radius:var(--radius-full);transition:all var(--transition-fast)}.search-input-wrapper.focused{background:var(--color-white);box-shadow:var(--shadow-md)}.search-input{width:100%;padding:10px 40px;border:none;background:transparent;border-radius:var(--radius-full);font-size:var(--font-size-sm);color:var(--text-primary)}.search-input::placeholder{color:var(--color-gray-400)}.search-input:focus{outline:none}.search-input::-webkit-search-decoration,.search-input::-webkit-search-cancel-button,.search-input::-webkit-search-results-button,.search-input::-webkit-search-results-decoration{display:none}.search-icon{position:absolute;left:14px;color:var(--color-gray-500);font-size:18px;pointer-events:none}.clear-button{position:absolute;right:10px;background:none;border:none;color:var(--color-gray-500);cursor:pointer;padding:var(--spacing-sm);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:all var(--transition-fast)}.clear-button:hover{background:var(--color-gray-100);color:var(--text-primary)}@media(max-width:768px){.search-bar{max-width:100%}.search-input-wrapper{height:48px}.search-input{font-size:16px;padding:var(--spacing-lg) 40px}}.user-avatar{width:36px;height:36px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:var(--color-white);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-base);flex-shrink:0;-webkit-user-select:none;user-select:none}.user-avatar.avatar-lg{width:48px;height:48px;font-size:var(--font-size-xl)}.user-menu-backdrop{position:fixed;inset:0;z-index:var(--z-dropdown)}.user-menu{position:absolute;top:calc(100% + var(--spacing-sm));right:0;background-color:var(--bg-card, var(--color-white));border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);min-width:240px;padding:var(--spacing-md);z-index:calc(var(--z-dropdown) + 1);animation:user-menu-in .15s ease-out}.user-menu-header{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm)}.user-menu-header-text{overflow:hidden}.user-menu-name{font-weight:var(--font-weight-semibold);color:var(--text-primary, var(--color-gray-900));margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-email{font-size:var(--font-size-sm);color:var(--text-secondary, var(--color-gray-500));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-divider{height:1px;background-color:var(--color-gray-200);margin:var(--spacing-sm) 0}.user-menu-item{display:flex;align-items:center;gap:var(--spacing-md);width:100%;padding:var(--spacing-md);border:none;background-color:transparent;color:var(--text-secondary, var(--color-gray-600));font-size:var(--font-size-base);font-family:inherit;text-decoration:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast);text-align:left}.user-menu-item:hover{background-color:var(--color-gray-100);color:var(--text-primary, var(--color-gray-900))}.user-menu-item--logout{color:var(--color-error)}.user-menu-item--logout:hover{background-color:#ef444414;color:var(--color-error)}@keyframes user-menu-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.scroll-sentinel{position:absolute;top:0;left:0;height:1px;width:1px;pointer-events:none;visibility:hidden}.header{background-color:var(--bg-header);position:sticky;top:0;z-index:var(--z-sticky);width:100%;transition:box-shadow var(--transition-fast)}.header .header-container{max-width:1280px;margin:0 auto;padding:0 var(--spacing-xl)}.header .banner-wrap{background-color:var(--bg-banner);padding:var(--spacing-xs) 0;text-align:center;max-height:60px;overflow:hidden;opacity:1;transition:max-height .3s ease,opacity .2s ease}.header .banner-wrap .banner-inner p{margin:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.header .wrapper{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-base) 0;gap:var(--spacing-xl);transition:padding var(--transition-fast)}.header .logo{font-family:var(--font-logo);font-size:var(--font-size-xl);color:var(--color-black);outline:none;display:inline-block;transform-origin:left center;transition:transform var(--transition-fast)}.header .search-container{width:100%;max-width:420px}.header .mobile-top-bar,.header .mobile-left,.header .mobile-right,.header .mobile-search-container{display:none}.header .header-divider{display:flex;height:1px;background-color:var(--color-gray-700)}.header .nav{display:flex;justify-content:center;gap:var(--spacing-base)}.header .nav .nav-link{color:var(--text-secondary)}.header .actions{display:flex;align-items:center;gap:var(--spacing-xl)}.header .cart{position:relative;color:var(--text-secondary);background-color:transparent;border:none;cursor:pointer;padding:0;transition:color var(--transition-fast)}.header .cart:hover{color:var(--color-primary)}.header .cart .cart-badge{position:absolute;top:-8px;right:-8px;background-color:var(--color-primary);color:var(--color-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);border-radius:var(--radius-full);width:20px;height:20px;display:flex;align-items:center;justify-content:center}.header .user{position:relative}.header .user .user-button{display:flex;align-items:center;gap:var(--spacing-sm);background-color:transparent;border:none;cursor:pointer;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-lg);transition:background-color var(--transition-fast)}.header .user .user-name{font-weight:var(--font-weight-semibold);color:var(--text-primary);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header .auth{display:flex;align-items:center;gap:var(--spacing-md)}.header .auth .auth-link{font-weight:var(--font-weight-semibold);color:var(--text-secondary);text-decoration:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-fast)}.header .auth .auth-link:hover{color:var(--color-primary);background-color:var(--color-gray-100)}.header .auth .auth-button{font-weight:var(--font-weight-semibold);color:var(--color-white);background-color:var(--color-primary);padding:var(--spacing-sm) var(--spacing-xl);border-radius:var(--radius-md);text-decoration:none;transition:all var(--transition-fast)}.header .auth .auth-button:hover{background-color:var(--color-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.header .auth .auth-button:active{transform:translateY(0)}.header .hamburger,.header .mobile-backdrop,.header .mobile-menu{display:none}.header .mobile-user{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-xl) var(--spacing-xl);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:var(--color-white)}.header .mobile-user .mobile-user-name{font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);margin-bottom:2px}.header .mobile-user .mobile-user-email{font-size:var(--font-size-sm);opacity:.9}.header .mobile-user .mobile-close-button{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);background:none;border:none;cursor:pointer;color:var(--color-white);padding:var(--spacing-xs);display:flex;align-items:center;justify-content:center}.header .mobile-nav{padding:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-xs)}.header .mobile-nav .mobile-nav-link{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);color:var(--text-secondary);font-weight:var(--font-weight-semibold);text-decoration:none;border-radius:var(--radius-md);transition:all var(--transition-fast);position:relative}.header .mobile-nav .mobile-nav-link:hover{background-color:var(--color-gray-100);color:var(--color-primary)}.header .mobile-nav .mobile-cart-badge{background-color:var(--color-primary);color:var(--color-white);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);border-radius:var(--radius-full);padding:2px 8px;margin-left:auto}.header .mobile-menu-actions,.header .mobile-auth{padding:var(--spacing-xl);border-top:1px solid var(--color-gray-200);display:flex;flex-direction:column;gap:var(--spacing-xs)}.header .mobile-menu-actions .mobile-action-link,.header .mobile-menu-actions .mobile-action-button{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border:none;background-color:transparent;color:var(--text-secondary);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);text-decoration:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);width:100%;text-align:left}.header .mobile-menu-actions .mobile-action-link:hover,.header .mobile-menu-actions .mobile-action-button:hover{background-color:var(--color-gray-100);color:var(--color-primary)}.header .mobile-menu-actions .mobile-action-button{color:var(--color-error)}.header .mobile-menu-actions .mobile-action-button:hover{background-color:#ef44441a;color:var(--color-error)}.header .mobile-auth .mobile-auth-link{display:block;padding:var(--spacing-md) var(--spacing-lg);color:var(--text-secondary);font-weight:var(--font-weight-semibold);text-decoration:none;text-align:center;border-radius:var(--radius-md);transition:all var(--transition-fast)}.header .mobile-auth .mobile-auth-link:hover{background-color:var(--color-gray-100);color:var(--color-primary)}.header .mobile-auth .mobile-auth-button{display:block;padding:var(--spacing-md) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-white);font-weight:var(--font-weight-semibold);text-decoration:none;text-align:center;border-radius:var(--radius-md);transition:all var(--transition-fast)}.header .mobile-auth .mobile-auth-button:hover{background-color:var(--color-primary)}.header--scrolled{box-shadow:var(--shadow-md)}.header--scrolled .banner-wrap{max-height:0;opacity:0}.header--scrolled .wrapper{padding-top:var(--spacing-xxs);padding-bottom:var(--spacing-xxs)}.header--scrolled .logo{transform:scale(.95)}.header--scrolled .search-input{height:36px}.header--scrolled .header-divider{display:none}.header--scrolled .nav-link{padding:var(--spacing-md) var(--spacing-lg)}@media(max-width:768px){.header--scrolled .mobile-top-bar{padding-top:var(--spacing-xs);padding-bottom:var(--spacing-xs)}.header--scrolled .mobile-search-container{padding-bottom:var(--spacing-xs)}.header .wrapper,.header .header-divider,.header .nav,.header .actions,.header .search-container{display:none}.header .mobile-top-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-base) 0;gap:var(--spacing-md);transition:padding var(--transition-fast)}.header .mobile-top-bar .logo{flex:1;text-align:center}.header .mobile-left{display:flex;align-items:center}.header .mobile-search-container{display:block;padding-bottom:var(--spacing-base);transition:padding var(--transition-fast)}.header .mobile-right{display:flex;align-items:center;gap:var(--spacing-md)}.header .mobile-right .mobile-action-icon{position:relative;color:var(--text-secondary);background-color:transparent;border:none;cursor:pointer;padding:var(--spacing-xs);transition:color var(--transition-fast)}.header .mobile-right .mobile-action-icon:hover{color:var(--color-primary)}.header .mobile-right .mobile-action-icon .mobile-cart-badge-icon{position:absolute;top:-4px;right:-4px;background-color:var(--color-primary);color:var(--color-white);font-size:10px;font-weight:var(--font-weight-bold);border-radius:var(--radius-full);width:16px;height:16px;display:flex;align-items:center;justify-content:center}.header .mobile-right .mobile-user-icon{width:32px;height:32px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:var(--color-white);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm);flex-shrink:0}.header .hamburger{display:flex;align-items:center;justify-content:center;background-color:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:var(--spacing-sm);border-radius:var(--radius-md);transition:all var(--transition-fast)}.header .hamburger:hover{background-color:var(--color-gray-100);color:var(--color-primary)}.header .hamburger:active{transform:scale(.95)}.header .mobile-backdrop{display:block;position:fixed;inset:0;background-color:#00000080;z-index:calc(var(--z-sticky) + 1);animation:fadeIn .3s ease-out}.header .mobile-menu{display:block;position:fixed;top:0;left:0;bottom:0;width:100%;max-width:320px;background-color:var(--bg-card);box-shadow:var(--shadow-xl);z-index:calc(var(--z-sticky) + 2);overflow-y:auto;animation:slideInLeft .3s ease-out}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.footer{min-height:128px;width:100%;background:var(--bg-footer);padding:var(--spacing-lg) 0}.footer .footer-inner{max-width:1280px;margin:0 auto;text-align:center;font-size:var(--font-size-sm);display:flex;flex-direction:column;gap:var(--spacing-sm);align-items:center}.footer .footer-inner p{color:var(--text-light)}.cart-drawer-overlay{position:fixed;inset:0;background:#00000080;z-index:var(--z-dropdown);animation:fadeIn .3s ease}.cart-drawer{position:fixed;top:0;right:-400px;width:400px;height:100vh;background:#fff;box-shadow:-2px 0 10px #0000001a;z-index:var(--z-dropdown);display:flex;flex-direction:column;transition:right .3s ease}.cart-drawer.open{right:0}@media(min-width:769px){.cart-drawer{top:170px;height:calc(100vh - 180px)}}@media(max-width:768px){.cart-drawer{width:100%;right:-100%;top:160px;height:calc(100vh - 180px)}}@media(max-width:480px){.cart-drawer{width:100%}}.cart-drawer-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid #eee}.cart-drawer-header h3{display:flex;align-items:center;gap:.5rem;margin:0;font-size:1.25rem}.cart-drawer-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;color:#666;transition:color .2s}.cart-drawer-header .close-btn:hover{color:#000}.cart-drawer-loading,.cart-drawer-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;color:#666}.cart-drawer-loading svg,.cart-drawer-empty svg{font-size:3rem;margin-bottom:1rem;color:#ccc}.cart-drawer-loading .btn-continue,.cart-drawer-empty .btn-continue{margin-top:1rem;padding:.75rem 1.5rem;background:#000;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background .2s}.cart-drawer-loading .btn-continue:hover,.cart-drawer-empty .btn-continue:hover{background:#333}.cart-drawer-items{flex:1;overflow-y:auto;padding:1rem}.cart-drawer-item{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid #eee}.cart-drawer-item:last-child{border-bottom:none}.cart-drawer-item .item-image{width:80px;height:80px;border-radius:4px;overflow:hidden;background:#f5f5f5;flex-shrink:0}.cart-drawer-item .item-image img{width:100%;height:100%;object-fit:cover}.cart-drawer-item .item-image .placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#ccc;font-size:2rem}.cart-drawer-item .item-details{flex:1;display:flex;flex-direction:column;gap:.25rem}.cart-drawer-item .item-details .item-name{font-weight:600;margin:0;font-size:.95rem}.cart-drawer-item .item-details .item-variant{font-size:.85rem;color:#666;margin:0}.cart-drawer-item .item-details .item-price{font-size:.9rem;color:#666;margin:0}.cart-drawer-item .item-actions{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between}.cart-drawer-item .item-actions .item-total{font-weight:600;margin:0}.cart-drawer-item .item-actions .btn-remove{background:none;border:none;color:#999;cursor:pointer;padding:.25rem;font-size:1.1rem;transition:color .2s}.cart-drawer-item .item-actions .btn-remove:hover{color:#c00}.cart-drawer-footer{border-top:1px solid #eee;padding:1.5rem}.cart-drawer-footer .subtotal{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:1.1rem}.cart-drawer-footer .subtotal .amount{font-weight:600}.cart-drawer-footer .shipping-note{font-size:.85rem;color:#666;margin:0 0 1rem}.cart-drawer-footer .btn-view-cart,.cart-drawer-footer .btn-checkout{display:block;width:100%;padding:.75rem;text-align:center;border-radius:4px;text-decoration:none;font-weight:600;transition:all .2s;margin-bottom:.5rem}.cart-drawer-footer .btn-view-cart{background:#fff;color:#000;border:2px solid #000}.cart-drawer-footer .btn-view-cart:hover{background:#f5f5f5}.cart-drawer-footer .btn-checkout{background:#000;color:#fff;border:2px solid #000}.cart-drawer-footer .btn-checkout:hover{background:#333;border-color:#333}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}:root{--bg-body: #FFFFFF;--bg-page: #FFFFFF;--bg-banner: #99B77B;--bg-header: #99B77B;--color-primary: #E76F51;--color-secondary: #5F6F63;--color-accent: #AFCF6F;--bg-card: var(--color-gray-100);--bg-input: #ffffff;--bg-footer: #3F4A43;--text-primary: #000000;--text-secondary: #4c2f2f;--text-light: #f2f2f2;--color-success: #6b8e23;--color-warning: #c58a2b;--color-error: #b5523c;--color-info: #5f8f8b;--color-white: #ffffff;--color-gray-50: #f9fafb;--color-gray-100: #f3f4f6;--color-gray-200: #e5e7eb;--color-gray-300: #d1d5db;--color-gray-400: #9ca3af;--color-gray-500: #6b7280;--color-gray-600: #4b5563;--color-gray-700: #374151;--color-gray-800: #1f2937;--color-gray-900: #111827;--color-black: #000000;--font-body: "Lato", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;--font-heading: "Quicksand", system-ui, sans-serif;--font-logo: "Pacifico", system-ui, sans-serif;--alert-font: "Roboto", system-ui, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.35rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--spacing-xxs: .15rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: .75rem;--spacing-base: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--spacing-4xl: 6rem;--radius-xs: .125rem;--radius-sm: .25rem;--radius-md: .35rem;--radius-base: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 2rem;--radius-full: 9999px;--border-width: 1px;--border-color: var(--color-gray-300);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--transition-fast: .15s ease-in-out;--transition-base: .25s ease-in-out;--transition-slow: .4s ease-in-out;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-body);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--text-primary);background-color:var(--bg-body);overflow-x:hidden}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-gray-900);margin-bottom:var(--spacing-md)}h1{font-size:var(--font-size-4xl)}@media(min-width:768px){h1{font-size:var(--font-size-5xl)}}h2{font-size:var(--font-size-3xl)}@media(min-width:768px){h2{font-size:var(--font-size-4xl)}}h3{font-size:var(--font-size-2xl)}@media(min-width:768px){h3{font-size:var(--font-size-3xl)}}h4{font-size:var(--font-size-xl)}@media(min-width:768px){h4{font-size:var(--font-size-2xl)}}h5{font-size:var(--font-size-lg)}@media(min-width:768px){h5{font-size:var(--font-size-xl)}}h6{font-size:var(--font-size-base)}@media(min-width:768px){h6{font-size:var(--font-size-lg)}}p{margin-bottom:var(--spacing-md);color:var(--color-gray-700)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary)}a:focus{outline:2px solid var(--color-primary);outline-offset:2px}strong,b{font-weight:var(--font-weight-bold)}em,i{font-style:italic}input,textarea,select,button{font-family:inherit;font-size:inherit;line-height:inherit}button{cursor:pointer;border:none;background:none}button:disabled{cursor:not-allowed;opacity:.6}a:focus{outline:none}a:focus-visible{outline:none;text-decoration:underline}.alert{font-family:var(--alert-font)}.container{width:100%;max-width:1280px;margin-left:auto;margin-right:auto;padding:var(--spacing-xl)}