* { box-sizing: border-box; }



.pc-header {
    height: 60px;
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #e3e3e3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
}

.hamburger {
    cursor: pointer;
}



.pc-sidebar {
    width: 260px;
    background: #1e1e2d;
    color: #fff;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    transition: transform .3s ease;
    z-index: 1032;
}


    .pc-sidebar {
        transform: translateX(-100%);
    }
    .pc-sidebar.mob-sidebar-active {
        transform: translateX(0);
    }


/* Overlay */
.pc-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    display: none;
    z-index: 1031;
}
.pc-menu-overlay.active {
    display: block;
}

/* ------------------------------------ */
/* MENÚ */
/* ------------------------------------ */
.pc-navbar {
    list-style: none;
    margin: 0;
    padding: 15px;
}

.pc-navbar a {
    color: #cfd0e0;
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 12px 15px;
    border-radius: 6px;
    transition: all .2s;
    font-size: 14px;
}

.pc-navbar li.pc-trigger > a,
.pc-navbar a:hover {
    background: #34344e;
    color: #fff;
}

.pc-submenu {
    padding-left: 15px;
    background: #2a2a3d;
    border-radius: 4px;
    margin-top: 5px;
}

.pc-submenu li a {
    padding-left: 30px;
    font-size: 13px;
}

/* Store navigation drawer */
#sidebar.sidebar-wrapper { position:fixed; inset:0; width:100%; height:100%; z-index:1040; background:rgba(15,32,24,.48);  }
#sidebar #sidebar-content { box-sizing:border-box; display:flex; flex-direction:column; width:340px; max-width:calc(100vw - 32px); height:100%; padding:0; border-radius:0; background:#fff; box-shadow:12px 0 60px rgba(13,46,29,.16); overflow:hidden; animation:store-menu-enter .2s ease-out; }
#sidebar .store-menu-top { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#78867e; font-size:10px; font-weight:700; letter-spacing:1.7px; }
#sidebar .store-menu-close { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; border:0; border-radius:50%; background:#f2f5f3; color:#52665a; cursor:pointer; }
#sidebar #sidebar-header { display:flex; align-items:center; gap:14px; padding:25px 0 26px; border-bottom:1px solid #edf1ee; }
#sidebar .store-menu-avatar { display:grid; place-items:center; flex-shrink:0; width:56px; height:56px; border:1px solid #d9e9df; border-radius:18px; background:#edf6f0; }
#sidebar .store-menu-avatar i { color:#167342; font-size:26px; width:auto; }
#sidebar-header strong { display:block; color:#183d29; font-size:18px; line-height:1.4; overflow-wrap:anywhere; }
#sidebar .store-menu-greeting { display:block; color:#718078; font-size:11px; margin-bottom:3px; }
#sidebar .store-menu-status { display:block; color:#548266; font-size:11px; margin-top:3px; }
#sidebar .store-menu-body { padding-top:22px; }
#sidebar .store-menu-label { color:#839087; font-size:10px; font-weight:700; letter-spacing:1.5px; margin:0 12px 12px; }
#sidebar .store-menu-link { display:flex; align-items:center; gap:13px; width:100%; min-height:48px; padding:12px 14px; margin-bottom:5px; border:0; border-radius:12px; background:transparent; color:#43564a; font:inherit; font-size:14px; text-align:left; text-decoration:none; cursor:pointer; transition:background .15s,color .15s; }
#sidebar .store-menu-link > i { width:20px; flex-shrink:0; text-align:center; color:#7b9083; font-size:18px; }
#sidebar .store-menu-link:hover { background:#f1f6f3; color:#146b3c; }
#sidebar .store-menu-link.is-active { background:#e9f4ec; color:#116d3c; font-weight:600; }
#sidebar .store-menu-link.is-active > i { color:#167342; }
#sidebar .store-menu-link .store-menu-arrow { margin-left:auto; font-size:16px; }
#sidebar .store-menu-count { margin-left:auto; min-width:24px; padding:2px 7px; border-radius:8px; background:#167342; color:white; font-size:11px; text-align:center; }
#sidebar .store-menu-divider { border-top:1px solid #edf1ee; padding-top:23px; margin-top:20px; }
#sidebar #sidebar-footer { position:static; width:100%; margin-top:auto; padding-top:28px; }
#sidebar .store-menu-auth { border:1px solid #e2eae5; color:#286940; }
#sidebar .store-menu-note { margin:15px 0 0; color:#87968d; font-size:10px; text-align:center; }
#sidebar button:focus-visible, #sidebar a:focus-visible { outline:2px solid #167342; outline-offset:3px; }
@keyframes store-menu-enter { from { transform:translateX(-100%); } to { transform:translateX(0); } }
@media (prefers-reduced-motion:reduce) { #sidebar #sidebar-content { animation:none; } #sidebar .store-menu-link { transition:none; } }
@media (max-height:600px) { #sidebar #sidebar-content { padding-top:12px; } #sidebar #sidebar-header { padding:14px 0; } #sidebar #sidebar-footer { padding-top:16px; } }

/* Store drawer layout with the original light palette */
#sidebar .store-menu-top { padding:22px 20px; background:#fff; color:#183d29; border-bottom:4px solid #edf1ee; flex-shrink:0; letter-spacing:0; }
#sidebar .store-menu-brand { display:flex; align-items:center; gap:12px; }
#sidebar .store-menu-brand img { width:48px; height:48px; object-fit:contain; }
#sidebar .store-menu-brand strong { display:block; font-size:24px; line-height:1.1; font-weight:750; letter-spacing:-.6px; }
#sidebar .store-menu-brand span { display:block; margin-top:5px; color:#548266; font-size:11px; font-weight:400; }
#sidebar .store-menu-close { display:flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; border:1px solid #e2eae5; border-radius:6px; background:#f2f5f3; color:#52665a; }
#sidebar .store-menu-close:hover { background:#e9f4ec; }
#sidebar #sidebar-header { margin:0 20px; padding:18px 0; gap:12px; flex-shrink:0; border-color:#edf1ee; }
#sidebar .store-menu-avatar { width:40px; height:40px; border-radius:50%; background:#edf6f0; border:0; }
#sidebar .store-menu-avatar i { font-size:20px; }
#sidebar-header strong { font-size:16px; }
#sidebar .store-menu-greeting { font-size:11px; }
#sidebar .store-menu-status { font-size:10px; }
#sidebar .store-menu-body { padding:18px 14px 10px; overflow-y:auto; min-height:0; flex:1; scrollbar-width:thin; scrollbar-color:#c6d4cb transparent; }
#sidebar .store-menu-label { color:#839087; font-size:10px; letter-spacing:1.3px; margin-bottom:8px; }
#sidebar .store-menu-link { border-radius:5px; min-height:44px; margin-bottom:3px; font-size:14px; }
#sidebar .store-menu-link.is-active { background:#e9f4ec; color:#116d3c; box-shadow:none; }
#sidebar .store-menu-link.is-active > i { color:#167342; }
#sidebar .store-menu-link:hover:not(.is-active) { background:#f1f6f3; }
#sidebar .store-menu-divider { margin-top:14px; padding-top:16px; border-color:#edf1ee; }
#sidebar #sidebar-footer { padding:12px 20px 16px; margin-top:0; flex-shrink:0; border-top:1px solid #edf1ee; background:#fff; }
#sidebar .store-menu-auth { border:0; padding:8px 0; min-height:36px; font-size:13px; }
#sidebar .store-menu-note { margin-top:6px; text-align:left; font-size:10px; color:#87968d; }
#sidebar .store-menu-close:focus-visible { outline-color:#167342; }
@media(max-height:600px) { #sidebar #sidebar-content { padding:0; } #sidebar .store-menu-top { padding:12px 20px; } #sidebar #sidebar-header { padding:12px 0; } #sidebar .store-menu-body { padding-top:12px; } #sidebar #sidebar-footer { padding:8px 20px; } }

/* Search toolbar: existing neutral palette */
#headerSection .store-search-toolbar { display:flex; align-items:center; gap:10px; padding:4px 0 8px; }
#headerSection .store-menu-trigger-wrap { flex:0 0 44px; }
#headerSection .store-menu-trigger { display:flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:1px solid #A8A69A; border-radius:10px; color:#5e5e5e; background:transparent; cursor:pointer; }
#headerSection .store-search-field { flex:1; min-width:0; }
#headerSection #datalist { position:relative; }
#headerSection #searchBox { height:44px; border-radius:10px; padding:10px 50px 10px 15px; margin:0; font-size:14px; box-shadow:none; }
#headerSection .store-search-submit { position:absolute; right:4px; top:4px; z-index:1; width:36px; height:36px; display:flex; align-items:center; justify-content:center; padding:0; border:0; border-radius:7px; background:transparent; color:#5e5e5e; cursor:pointer; }
#headerSection .store-search-cart { flex:0 0 48px; position:relative; }
#headerSection .store-search-cart > button { min-height:44px; align-items:center; }
#headerSection .store-menu-trigger:focus, #headerSection .store-search-submit:focus { box-shadow:none; }
#headerSection .store-menu-trigger:focus-visible, #headerSection .store-search-submit:focus-visible { outline:2px solid #5e5e5e; outline-offset:2px; }
#headerSection #searchBox:focus { border-color:#5e5e5e; box-shadow:0 0 0 1px #5e5e5e; }
#headerSection #datalist .list-group { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:1050; border-radius:10px; overflow:hidden; }
@media(max-width:480px) { #headerSection .store-search-toolbar { gap:8px; } #headerSection .store-search-cart { flex-basis:36px; } }
