/* Store Components — Baburu v1.0 */

/* ════════════════════════════════════════════════════════════
   Features / "Por que Baburu" — Anime System style
   ════════════════════════════════════════════════════════════ */
.store-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 20px;
}

.store-feature {
    background: #ffffff;
    border: 3px solid #ddd;
    border-radius: 14px;
    padding: 28px 20px 24px;
    text-align: center;
    position: relative;
    overflow: hidden;
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease, border-color .25s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
}

.store-feature:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(227,5,122,.14);
}

/* ── Pattern overlay (hidden until hover) ── */
.store-feature::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0;
    transition: opacity .4s ease;
    border-radius: inherit;
}

.store-feature:hover::before {
    opacity: 1;
}

/* ── Pattern variants ── */
.store-feature--pattern-dots::before { background-image: var(--p-dots); }
.store-feature--pattern-hatch::before { background-image: var(--p-hatch); }
.store-feature--pattern-diamond::before { background-image: var(--p-diamond); }
.store-feature--pattern-wave::before { background-image: var(--p-wave); }

/* ── Ensure content stays above pattern ── */
.store-feature > * {
    position: relative;
    z-index: 1;
}

/* ── Color variants ── */
.store-feature--pk { border-color: var(--pk); }
.store-feature--pk:hover { box-shadow: 0 8px 24px rgba(227,5,122,.14); }

.store-feature--cy { border-color: var(--cy); }
.store-feature--cy:hover { box-shadow: 0 8px 24px rgba(32,194,215,.14); }

.store-feature--pu { border-color: var(--pu); }
.store-feature--pu:hover { box-shadow: 0 8px 24px rgba(155,89,182,.14); }

.store-feature--ye { border-color: var(--ye); }
.store-feature--ye:hover { box-shadow: 0 8px 24px rgba(245,215,110,.3); }

/* ── Icon ── */
.store-feature__icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    font-size: 1.3rem;
    color: #fff;
    transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}

.store-feature:hover .store-feature__icon {
    transform: scale(1.12);
}

.store-feature__icon--pk { background: var(--pk); }
.store-feature__icon--cy { background: var(--cy); }
.store-feature__icon--pu { background: var(--pu); }
.store-feature__icon--ye { background: var(--ye); }

/* ── Text ── */
.store-feature h4 {
    font-family: var(--f-head, 'Fredoka', sans-serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text, #333);
    margin: 0 0 6px;
    line-height: 1.3;
}

.store-feature p {
    font-family: var(--f-body, 'Inter', sans-serif);
    font-size: .83rem;
    color: var(--text-sec, #666);
    margin: 0;
    line-height: 1.5;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .store-features {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }
    .store-feature {
        padding: 20px 14px 18px;
    }
    .store-feature__icon {
        width: 46px;
        height: 46px;
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .store-features {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}
/* Toast */
.store-toast{position:fixed;top:148px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:380px;width:calc(100vw - 40px)}
.store-toast__item{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:14px;background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.12);border-left:4px solid #E3057A;pointer-events:auto;animation:toastIn .4s cubic-bezier(.34,1.56,.64,1);transition:opacity .3s,transform .3s}
.store-toast__item.toast-out{opacity:0;transform:translateX(30px)}
@keyframes toastIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
.store-toast__icon{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;font-size:.7rem;color:#fff}
.store-toast__icon--success{background:#27ae60}
.store-toast__icon--error{background:#e74c3c}
.store-toast__icon--warning{background:#f39c12}
.store-toast__icon--info{background:#20C2D7}
.store-toast__body{flex:1;font-size:.85rem;color:#333;line-height:1.4;min-width:0}
.store-toast__body strong{display:block;font-family:'Fredoka',sans-serif;font-size:.9rem;margin-bottom:2px}
.store-toast__close{width:24px;height:24px;border-radius:50%;border:none;background:transparent;color:#999;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.85rem}
.store-toast__close:hover{color:#E3057A}
body.dark-theme .store-toast__item{background:#222;box-shadow:0 4px 20px rgba(0,0,0,.3);color:#e0e0e0}
body.dark-theme .store-toast__body{color:#e0e0e0}
body.dark-theme .store-toast__body strong{color:#e0e0e0}

/* Drawer */
.store-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:9997;opacity:0;pointer-events:none;transition:opacity .35s}
.store-drawer{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:90vw;background:#fff;z-index:9998;box-shadow:-4px 0 30px rgba(0,0,0,.1);transform:translateX(100%);transition:transform .4s cubic-bezier(.34,1.56,.64,1);display:flex;flex-direction:column}
body.store-drawer--open .store-drawer{transform:translateX(0)}
body.store-drawer--open .store-drawer-overlay{opacity:1;pointer-events:auto}
.store-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:2px solid #ddd;flex-shrink:0}
.store-drawer__title{font-family:'Fredoka',sans-serif;font-size:1.05rem;font-weight:700;color:#333;margin:0}
.store-drawer__close{width:32px;height:32px;border-radius:50%;border:2px solid #ddd;background:transparent;color:#999;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem}
.store-drawer__close:hover{border-color:#E3057A;color:#E3057A}
.store-drawer__body{flex:1;overflow-y:auto;padding:16px 20px}
.store-drawer__item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.04)}
.store-drawer__item-img{width:52px;height:52px;border-radius:8px;overflow:hidden;flex-shrink:0;background:#eee}
.store-drawer__item-img img{width:100%;height:100%;object-fit:cover;display:block}
.store-drawer__item-info{flex:1;min-width:0}
.store-drawer__item-name{font-family:'Fredoka',sans-serif;font-size:.85rem;font-weight:700;color:#333;margin:0 0 2px}
.store-drawer__item-meta{font-size:.78rem;color:#666}
.store-drawer__item-price{font-size:.85rem;font-weight:700;color:#E3057A;white-space:nowrap}
.store-drawer__footer{padding:16px 20px 20px;border-top:2px solid #ddd;flex-shrink:0}
.store-drawer__subtotal{display:flex;justify-content:space-between;align-items:center;font-size:.95rem;margin-bottom:14px}
.store-drawer__subtotal span:first-child{color:#666}
.store-drawer__subtotal span:last-child{font-weight:700;color:#333;font-size:1.05rem}
.store-drawer__actions{display:flex;flex-direction:column;gap:8px}
.store-drawer__actions .anime-btn{width:100%}
body.dark-theme .store-drawer{background:#222}
body.dark-theme .store-drawer__header{border-bottom-color:#444}
body.dark-theme .store-drawer__title{color:#e0e0e0}
body.dark-theme .store-drawer__close{border-color:#444;color:#777}
body.dark-theme .store-drawer__item-name{color:#e0e0e0}
body.dark-theme .store-drawer__item-meta{color:#b0b0b0}
body.dark-theme .store-drawer__footer{border-top-color:#444}
body.dark-theme .store-drawer__subtotal span:last-child{color:#e0e0e0}

/* Pagination */
.store-pagination{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.store-pagination__btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:36px;padding:0 10px;border-radius:14px;border:2px solid #ddd;background:transparent;color:#666;font-family:'Inter',sans-serif;font-weight:600;font-size:.85rem;cursor:pointer;text-decoration:none;white-space:nowrap}
.store-pagination__btn:hover{border-color:#E3057A;color:#E3057A}
.store-pagination__btn--active{background:#E3057A;border-color:#E3057A;color:#fff}
.store-pagination__btn--disabled{opacity:.4;pointer-events:none}
.store-pagination__ellipsis{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;color:#999;font-size:.85rem;letter-spacing:2px;user-select:none}
.store-pagination--sm .store-pagination__btn{min-width:30px;height:30px;font-size:.78rem;padding:0 8px}
.store-pagination--lg .store-pagination__btn{min-width:44px;height:44px;font-size:1rem;padding:0 16px}
@media(max-width:480px){.store-pagination__page--hide-mobile{display:none}}

/* Breadcrumbs */
.store-breadcrumb{display:flex;align-items:center;gap:4px;flex-wrap:wrap;font-size:.82rem;padding:8px 0}
.store-breadcrumb__item{display:inline-flex;align-items:center;gap:4px;color:#666;text-decoration:none;font-weight:500;white-space:nowrap}
.store-breadcrumb__item:hover{color:#E3057A}
.store-breadcrumb__item--active{color:#333;font-weight:600}
.store-breadcrumb__sep{color:#999;font-size:.7rem;margin:0 2px;user-select:none}
.store-breadcrumb--sm{font-size:.75rem}
@media(max-width:480px){.store-breadcrumb__item--hide-mobile{display:none}.store-breadcrumb__item--back{font-weight:700;gap:6px;color:#E3057A}}
body.dark-theme .store-breadcrumb__item{color:#b0b0b0}
body.dark-theme .store-breadcrumb__item--active{color:#e0e0e0}

/* Footer */
.store-footer{background:#fff;border-top:2px solid #ddd;padding:40px 24px 20px;font-size:.85rem;color:#666}
.store-footer__inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px}
@media(max-width:768px){.store-footer__inner{grid-template-columns:1fr 1fr;gap:24px}}
@media(max-width:480px){.store-footer__inner{grid-template-columns:1fr;gap:20px}}
.store-footer__brand{display:flex;flex-direction:column;gap:10px}
.store-footer__logo{display:flex;align-items:center;gap:8px;text-decoration:none}
.store-footer__logo img{width:32px;height:32px;border-radius:6px;object-fit:contain}
.store-footer__logo span{font-family:'Fredoka',sans-serif;font-size:1.1rem;font-weight:700;color:#E3057A;letter-spacing:.5px}
.store-footer__desc{line-height:1.6;margin:0}
.store-footer__social{display:flex;gap:8px;margin-top:4px}
.store-footer__social a{width:34px;height:34px;border-radius:50%;border:2px solid #ddd;display:flex;align-items:center;justify-content:center;color:#666;text-decoration:none}
.store-footer__social a:hover{border-color:#E3057A;color:#E3057A}
.store-footer__col h4{font-family:'Fredoka',sans-serif;font-size:.9rem;font-weight:700;color:#333;margin:0 0 12px}
.store-footer__col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.store-footer__col ul a{color:#666;text-decoration:none}
.store-footer__col ul a:hover{color:#E3057A}
.store-footer__bottom{border-top:1px solid #ddd;margin-top:32px;padding-top:16px;text-align:center;font-size:.78rem;color:#999}
body.dark-theme .store-footer{background:#222;border-top-color:#444;color:#b0b0b0}
body.dark-theme .store-footer__col h4{color:#e0e0e0}
body.dark-theme .store-footer__col ul a{color:#b0b0b0}
body.dark-theme .store-footer__bottom{color:#777;border-top-color:#444}

/* Tabs (CSS-only radio) */
.store-tabs{position:relative}
.store-tabs>input[type="radio"]{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.store-tabs__headers{display:flex;gap:0;border-bottom:2px solid #ddd;overflow-x:auto;scrollbar-width:none}
.store-tabs__headers::-webkit-scrollbar{display:none}
.store-tabs__btn{display:inline-flex;align-items:center;padding:10px 20px;border:none;background:transparent;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;color:#666;cursor:pointer;white-space:nowrap;position:relative;flex-shrink:0}
.store-tabs__btn::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;border-radius:3px 3px 0 0;background:transparent}
.store-tabs__panel{display:none;padding:20px 0;font-size:.9rem;color:#666;line-height:1.6}
#tab-1:checked~.store-tabs__headers label[for="tab-1"],#tab-2:checked~.store-tabs__headers label[for="tab-2"],#tab-3:checked~.store-tabs__headers label[for="tab-3"],#tab-4:checked~.store-tabs__headers label[for="tab-4"]{color:#E3057A}
#tab-1:checked~.store-tabs__headers label[for="tab-1"]::after,#tab-2:checked~.store-tabs__headers label[for="tab-2"]::after,#tab-3:checked~.store-tabs__headers label[for="tab-3"]::after,#tab-4:checked~.store-tabs__headers label[for="tab-4"]::after{background:#E3057A}
#tab-1:checked~#panel-1,#tab-2:checked~#panel-2,#tab-3:checked~#panel-3,#tab-4:checked~#panel-4{display:block}
body.dark-theme .store-tabs__headers{border-bottom-color:#444}
body.dark-theme .store-tabs__btn{color:#b0b0b0}
body.dark-theme .store-tabs__panel{color:#b0b0b0}

/* Accordion */
.store-accordion{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:2px solid #ddd}
.store-accordion__item{border-bottom:1px solid #ddd}
.store-accordion__item:last-child{border-bottom:none}
.store-accordion__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 18px;border:none;background:transparent;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;color:#333;cursor:pointer;text-align:left;gap:12px}
.store-accordion__trigger:hover{background:rgba(227,5,122,.04)}
.store-accordion__trigger i:last-child{transition:transform .3s;font-size:.75rem;color:#999;flex-shrink:0}
.store-accordion__content{max-height:0;overflow:hidden;transition:max-height .35s;padding:0 18px;font-size:.85rem;color:#666;line-height:1.6}
.store-accordion__item--open .store-accordion__trigger i:last-child{transform:rotate(180deg)}
.store-accordion__item--open .store-accordion__content{max-height:300px;padding:0 18px 14px}
body.dark-theme .store-accordion{border-color:#444}
body.dark-theme .store-accordion__item{border-bottom-color:#444}
body.dark-theme .store-accordion__trigger{color:#e0e0e0}
body.dark-theme .store-accordion__content{color:#b0b0b0}

/* Select */
.store-select{position:relative;display:inline-block}
.store-select select{-webkit-appearance:none;appearance:none;padding:10px 38px 10px 14px;border-radius:14px;border:2px solid #ddd;background:#fff;font-family:'Inter',sans-serif;font-size:.88rem;color:#333;cursor:pointer;outline:none;min-width:160px;width:100%}
.store-select select:hover{border-color:#20C2D7}
.store-select select:focus{border-color:#E3057A}
.store-select::after{content:'\f078';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.7rem;color:#999;pointer-events:none}
.store-select--sm select{padding:7px 32px 7px 10px;font-size:.82rem;min-width:120px}
body.dark-theme .store-select select{background:#222;border-color:#444;color:#e0e0e0}

/* Star Rating */
.store-rating{display:inline-flex;align-items:center;gap:2px;font-size:1rem;direction:rtl;unicode-bidi:bidi-override}
.store-rating input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.store-rating label{cursor:pointer;font-size:inherit;line-height:1}
.store-rating label::before{content:'\f005';font-family:'Font Awesome 6 Free';font-weight:900}
.store-rating input:checked~label,.store-rating label:hover,.store-rating label:hover~label{color:#f5d76e!important}
.store-rating input:not(:checked)~label{color:#ddd!important}
.store-rating--sm{font-size:.82rem}
.store-rating--lg{font-size:1.3rem}
.store-rating--display label{cursor:default}
.store-rating--display input:checked~label{color:#f5d76e!important}
.store-rating--display input:not(:checked)~label{color:#ddd!important}

/* Stepper */
.store-stepper{display:flex;align-items:center;justify-content:center;gap:0;padding:16px 0}
.store-stepper__step{display:flex;align-items:center;gap:8px;white-space:nowrap}
.store-stepper__circle{width:32px;height:32px;border-radius:50%;border:2px solid #ddd;display:flex;align-items:center;justify-content:center;font-family:'Fredoka',sans-serif;font-weight:700;font-size:.82rem;color:#999;flex-shrink:0}
.store-stepper__label{font-size:.78rem;color:#999}
.store-stepper__line{width:40px;height:2px;background:#ddd;margin:0 8px;flex-shrink:0}
.store-stepper__step--active .store-stepper__circle{background:#E3057A;border-color:#E3057A;color:#fff}
.store-stepper__step--active .store-stepper__label{color:#333;font-weight:600}
.store-stepper__step--done .store-stepper__circle{background:#27ae60;border-color:#27ae60;color:#fff}
.store-stepper__step--done+.store-stepper__line{background:#27ae60}
@media(max-width:480px){.store-stepper__label{display:none}.store-stepper__line{width:20px}}
body.dark-theme .store-stepper__circle{border-color:#444;color:#777}
body.dark-theme .store-stepper__label{color:#777}
body.dark-theme .store-stepper__line{background:#444}

/* Empty State */
.store-empty{text-align:center;padding:48px 24px;color:#999}
.store-empty__icon{font-size:2.8rem;margin-bottom:16px;display:block;color:#ddd}
.store-empty h3{font-family:'Fredoka',sans-serif;font-size:1.15rem;font-weight:700;color:#333;margin:0 0 6px}
.store-empty p{font-size:.88rem;margin:0 0 18px;color:#666;line-height:1.5}
.store-empty--sm{padding:32px 16px}
body.dark-theme .store-empty h3{color:#e0e0e0}
body.dark-theme .store-empty p{color:#b0b0b0}

/* Auth Form */
.store-auth{max-width:420px;margin:0 auto;padding:32px 24px}
.store-auth__header{text-align:center;margin-bottom:24px}
.store-auth__header h2{font-family:'Fredoka',sans-serif;font-size:1.3rem;font-weight:700;color:#333;margin:0 0 4px}
.store-auth__header p{font-size:.85rem;color:#666;margin:0}
.store-auth__divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:#999;font-size:.78rem}
.store-auth__divider::before,.store-auth__divider::after{content:'';flex:1;height:1px;background:#ddd}
.store-auth__social{display:flex;gap:10px}
.store-auth__social button{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;border-radius:14px;border:2px solid #ddd;background:transparent;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:#333;cursor:pointer}
.store-auth__social button:hover{border-color:#E3057A;color:#E3057A}
.store-auth__switch{text-align:center;margin-top:16px;font-size:.85rem;color:#666}
.store-auth__switch a{color:#E3057A;font-weight:600;text-decoration:none}
body.dark-theme .store-auth__header h2{color:#e0e0e0}
body.dark-theme .store-auth__header p{color:#b0b0b0}
body.dark-theme .store-auth__social button{color:#e0e0e0;border-color:#444}

/* ═══ Wishlist / Favorites ═══ */
.store-wishlist{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:2px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;transition:all .25s;font-size:1.1rem}
.store-wishlist:hover{border-color:var(--pk);color:var(--pk)}
.store-wishlist--active,.store-wishlist--active:hover{color:#e74c3c;border-color:#e74c3c}
body.dark-theme .store-wishlist{border-color:var(--border)}
body.dark-theme .store-wishlist--active{border-color:#e74c3c}

/* ═══ Stats / Counters ═══ */
.store-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px}
.store-stat{text-align:center;padding:24px 16px;border-radius:14px;border:2px solid var(--border);background:var(--card-bg)}
.store-stat__value{font-family:Fredoka,sans-serif;font-size:2rem;font-weight:700;color:var(--pk);line-height:1;margin-bottom:4px}
.store-stat__label{font-size:.82rem;color:var(--text-sec)}
.store-stat--cy .store-stat__value{color:var(--cy)}
.store-stat--pu .store-stat__value{color:#9b59b6}
.store-stat--ye .store-stat__value{color:#f5d76e}
body.dark-theme .store-stat{background:var(--card-bg);border-color:var(--border)}

/* ═══ File Upload ═══ */
.store-upload{position:relative;border:2px dashed var(--border);border-radius:14px;padding:40px 24px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s}
.store-upload:hover{border-color:var(--pk);background:rgba(227,5,122,.03)}
.store-upload input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer}
.store-upload__icon{font-size:2rem;color:var(--text-muted);margin-bottom:8px;display:block}
.store-upload__text{font-size:.88rem;color:var(--text-sec);font-weight:600}
.store-upload__hint{font-size:.75rem;color:var(--text-muted);margin-top:4px}
.store-upload--active{border-color:var(--pk);background:rgba(227,5,122,.05)}
body.dark-theme .store-upload:hover{background:rgba(227,5,122,.06)}

/* ═══ Scroll to Top ═══ */
.scroll-top{position:fixed;bottom:24px;right:24px;z-index:9996;width:44px;height:44px;border-radius:50%;background:var(--pk);color:#fff;border:2px solid rgba(255,255,255,.2);box-shadow:0 4px 16px rgba(227,5,122,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;opacity:0;pointer-events:none;transform:translateY(16px);transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.scroll-top--visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.scroll-top:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px rgba(227,5,122,.3)}
body.dark-theme .scroll-top{border-color:rgba(255,255,255,.1);box-shadow:0 4px 16px rgba(227,5,122,.15)}

/* ═══ Navbar ═══ */
.ec-nav{position:sticky;top:0;z-index:200;background:var(--pk);border-bottom:2px solid rgba(255,255,255,.12);font-family:Inter,sans-serif}
.ec-nav__main{display:flex;align-items:center;gap:16px;padding:10px 24px;max-width:1200px;margin:0 auto}
.ec-nav__logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.ec-nav__logo-img{width:36px;height:36px;border-radius:8px;object-fit:contain}
.ec-nav__logo-text{font-family:Fredoka,sans-serif;font-size:1.2rem;font-weight:700;color:#fff;letter-spacing:1px}
.ec-nav__logo-text span{color:rgba(255,255,255,.7)}
.ec-nav__search{flex:1;max-width:400px;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:2px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);margin:0 auto}
.ec-nav__search:focus-within{border-color:#fff}
.ec-nav__search i{color:rgba(255,255,255,.55);font-size:.85rem}
.ec-nav__search input{border:none;background:transparent;outline:none;flex:1;font-size:.85rem;color:#fff;font-family:Inter,sans-serif}
.ec-nav__search input::placeholder{color:rgba(255,255,255,.45)}
.ec-nav__actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.ec-nav__icon{width:38px;height:38px;border-radius:50%;border:2px solid transparent;background:rgba(255,255,255,.08);color:#fff;font-size:1.05rem;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:all .2s}
.ec-nav__icon:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.15);color:#fff}
.ec-nav__badge{position:absolute;top:-4px;right:-4px;width:18px;height:18px;border-radius:50%;background:#fff;color:var(--pk);font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.ec-nav__sub{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 24px;border-top:1px solid rgba(255,255,255,.12);overflow-x:auto;max-width:1200px;margin:0 auto}
.ec-nav__sub a{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;color:rgba(255,255,255,.8);text-decoration:none;font-size:.78rem;font-weight:600;white-space:nowrap;transition:all .2s}
.ec-nav__sub a:hover{background:rgba(255,255,255,.12);color:#fff}
.ec-nav__sub a i{font-size:.85rem}
.ec-nav__sub .active{background:rgba(255,255,255,.18);color:#fff}
@media(max-width:640px){.ec-nav__search{display:none}.ec-nav__sub a span{display:none}.ec-nav__main{padding:8px 12px}.ec-nav__sub{padding:4px 8px;justify-content:flex-start}.ec-nav__sub a{padding:6px 10px;font-size:.75rem}}

/* ═══ Hamburger Dropdown ═══ */
.hamburger{width:38px;height:38px;border-radius:8px;border:none;background:rgba(255,255,255,.1);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;flex-shrink:0;transition:background .2s;position:relative}
.hamburger:hover{background:rgba(255,255,255,.18)}
.hamburger span{display:block;width:18px;height:2px;border-radius:2px;background:#fff;transition:all .3s}
.hamburger--open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger--open span:nth-child(2){opacity:0}
.hamburger--open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.ham-dropdown{position:absolute;top:calc(100% + 8px);left:0;background:var(--card-bg);border:2px solid var(--border);border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.1);padding:8px;min-width:220px;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .2s;z-index:300}
.ham-dropdown--open{opacity:1;visibility:visible;transform:translateY(0)}
.ham-dropdown__item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--text);text-decoration:none;font-size:.85rem;font-weight:500;transition:background .12s;border:none;background:transparent;width:100%;text-align:left;font-family:Inter,sans-serif;cursor:pointer}
.ham-dropdown__item:hover{background:rgba(227,5,122,.06);color:var(--pk)}
.ham-dropdown__item i{width:18px;text-align:center;color:var(--text-sec);font-size:.9rem}
.ham-dropdown__item:hover i{color:var(--pk)}
.ham-dropdown__divider{height:1px;background:var(--border);margin:4px 0}
@media(max-width:480px){.ham-dropdown{position:fixed;top:60px;left:8px;right:8px;bottom:auto;min-width:0;width:auto;max-height:70vh;overflow-y:auto;border-radius:16px;box-shadow:0 8px 30px rgba(0,0,0,.15)}}
body.dark-theme .ham-dropdown{background:var(--card-bg);border-color:var(--border)}

/* ═══ Mega Menu ═══ */
.mega-trigger{position:relative}
.mega-trigger>a{cursor:pointer}
.mega-menu{position:absolute;top:calc(100% + 6px);right:auto;left:50%;transform:translateY(6px) translateX(-50%);background:var(--card-bg);border:2px solid var(--border);border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.1);padding:16px;min-width:440px;opacity:0;visibility:hidden;transition:all .2s ease;z-index:200;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:92vw;width:max-content}
.mega-trigger:hover .mega-menu,.mega-trigger:focus-within .mega-menu{opacity:1;visibility:visible;transform:translateY(0) translateX(-50%)}
@media(max-width:900px){.mega-menu{position:fixed;top:70px;left:50%;transform:translateY(6px) translateX(-50%);min-width:0;width:92vw;max-width:500px;grid-template-columns:repeat(2,1fr);padding:14px;gap:8px}}
.mega-menu__item{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:10px;transition:background .15s}
.mega-menu__item:hover{background:rgba(227,5,122,.06)}
.mega-menu__item i{font-size:1.2rem;color:var(--pk)}
.mega-menu__item strong{font-size:.85rem;color:var(--text);font-weight:600}
.mega-menu__item span{font-size:.75rem;color:var(--text-sec);margin-top:1px}
body.dark-theme .mega-menu{background:var(--card-bg);border-color:var(--border)}

/* ═══ Badges ═══ */
.prod-badge{display:inline-flex;align-items:center;gap:4px;font-family:Inter,sans-serif;font-size:.7rem;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}
.prod-badge--pk{background:var(--pk);color:#fff}
.prod-badge--cy{background:var(--cy);color:#fff}
.prod-badge--pu{background:#9b59b6;color:#fff}
.prod-badge--ye{background:#f5d76e;color:#333}
.prod-badge--low{background:#f39c12;color:#fff}
.prod-badge--sold{background:#666;color:#fff}
.prod-badge--soon{background:#9b59b6;color:#fff}
.prod-badge--disc{background:#888;color:#fff}
.prod-badge--abs{position:absolute;top:10px;right:10px;z-index:3}

/* ════════════════════════════════════════════════════════════
   Modal — Shared across all pages
   ════════════════════════════════════════════════════════════ */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998;display:none}
.modal-box{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--card-bg);border:2px solid var(--border);border-radius:16px;padding:24px;width:90vw;max-width:600px;z-index:9999;display:none;max-height:85vh;overflow-y:auto}
.modal-box--open,.modal-overlay--open{display:block}
.modal-box h3{font-family:Fredoka,sans-serif;font-size:1rem;font-weight:700;color:var(--text);margin:0 0 16px;display:flex;align-items:center;justify-content:space-between}
.modal-box h3 button{border:none;background:none;color:var(--text-muted);font-size:1.2rem;cursor:pointer}
.modal-field{margin-bottom:12px}
.modal-field label{display:block;font-size:.82rem;font-weight:600;color:var(--text);margin-bottom:3px}
.modal-field input,.modal-field select{width:100%;padding:9px 11px;border-radius:8px;border:2px solid var(--border);background:transparent;font-family:Inter,sans-serif;font-size:.85rem;color:var(--text);outline:none;box-sizing:border-box}
.modal-field input:focus,.modal-field select:focus{border-color:var(--pk)}
.modal-field .curr-file{font-size:.75rem;color:var(--text-muted);margin-top:2px}
.modal-footer{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;padding-top:12px;border-top:1px solid var(--border)}
.modal-footer button{padding:8px 20px;border-radius:8px;font-weight:600;font-size:.85rem;cursor:pointer}
body.dark-theme .modal-box{background:var(--card-bg);border-color:var(--border)}

/* ════════════════════════════════════════════════════════════
   User Menu — Profile dropdown in navbar
   ════════════════════════════════════════════════════════════ */
.user-menu{position:absolute;top:calc(100% + 8px);right:0;background:var(--card-bg);border:2px solid var(--border);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.12);padding:6px;min-width:200px;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .2s;z-index:300}
.user-menu--open{opacity:1;visibility:visible;transform:translateY(0)}
.user-menu__item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--text);text-decoration:none;font-size:.85rem;background:transparent;border:none;width:100%;text-align:left;cursor:pointer;font-family:Inter,sans-serif}
.user-menu__item:hover{background:rgba(227,5,122,.06);color:var(--pk)}
.user-menu__item i{width:18px;text-align:center;color:var(--text-sec)}
.user-menu__profile{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border);margin-bottom:4px}
.user-menu__profile img{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--pk)}
.user-menu__profile span{font-family:Fredoka,sans-serif;font-weight:700;font-size:.88rem;color:var(--text)}
body.dark-theme .user-menu{background:var(--card-bg);border-color:var(--border)}