*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

:root{
--black:#0a0a0f;
--panel:#15151d;
--panel-soft:#1c1c27;
--gold:#f4b73f;
--gold-light:#ffe3a3;
--lime:#d4ff4f;
--white:#fbf8f1;
--muted:rgba(251,248,241,.6);
--line:rgba(244,183,63,.16);
--display:'Poppins',sans-serif;

/* ===== App palette (image spec A–K) — used ONLY under html.is-app so the
   website theme is untouched. Defining them here is harmless (no effect until
   referenced). Rolled out screen-by-screen. ===== */
--ec-navy:#28354D;      /* [A] deep navy text */
--ec-blue:#647D97;      /* [B] medium blue */
--ec-gold2:#CDA87E;     /* [C] accent gold */
--ec-bg:#F4F4F4;        /* [D] light gray/silver background */
--ic-blue:#6DAAD0;      /* [E] icon primary blue */
--ic-peach:#F3C096;     /* [F] icon peach */
--ic-lav:#CABEDD;       /* [G] icon lavender */
--ic-mint:#A5D0A1;      /* [H] icon soft mint green */
--ic-pink:#ED8D92;      /* [I] icon blush pink */
--ic-sky:#99D5E7;       /* [J] icon light sky blue */
--ec-shadow:#BFC7CE;    /* [K] shadow color */
}

html{
scroll-behavior:smooth;
}

body{
background:var(--black);
color:var(--white);
overflow-x:hidden;
min-height:100vh;
-webkit-tap-highlight-color:transparent;
}

::selection{
background:var(--lime);
color:#0a0a0f;
}

h1,h2,h3,
.hero-title,.section-title,.store-heading,.category-search-title,
.category-hero h2,.login-logo,.nav-logo,.footer-logo,
.price,.product-price,.cart-price,.wallet-stat strong,.status-value{
font-family:var(--display);
letter-spacing:-0.01em;
}

nav{
position:relative;
z-index:100;
display:flex;
justify-content:space-between;
align-items:center;
gap:24px;
padding:18px 56px;
background:rgba(10,10,15,.85);
border-bottom:1px solid var(--line);
}

/* Header only on shopping pages, hidden on membership/login/cart/etc */
nav{display:none;}
body[data-page="store"] nav,
body[data-page="boys"] nav,
body[data-page="girls"] nav,
body[data-page="women"] nav,
body[data-page="child"] nav,
body[data-page="gadgets"] nav,
body[data-page="wallet"] nav{
display:flex;
}

.nav-logo{
font-size:1.4rem;
font-weight:800;
color:var(--white);
letter-spacing:.02em;
}

.nav-logo::after{
content:"";
display:inline-block;
width:8px;
height:8px;
margin-left:8px;
border-radius:50%;
background:var(--lime);
box-shadow:0 0 12px var(--lime);
vertical-align:middle;
}

.nav-links{
display:flex;
gap:30px;
list-style:none;
}

.nav-links a,
.nav-cta{
color:var(--white);
text-decoration:none;
font-size:.74rem;
letter-spacing:.18em;
text-transform:uppercase;
opacity:.78;
transition:.3s;
touch-action:manipulation;
}

.nav-links a:hover{
color:var(--gold-light);
opacity:1;
}

.nav-links a.active-link{
color:var(--lime);
opacity:1;
}

.nav-cta{
background:transparent;
border:1px solid var(--gold);
color:var(--gold-light);
padding:10px 22px;
border-radius:999px;
cursor:pointer;
opacity:1;
font-weight:700;
}

.nav-cta:hover{
background:var(--gold);
color:#0a0a0f;
box-shadow:0 0 24px rgba(244,183,63,.45);
}

section{
padding:110px 56px;
}

.hero{
min-height:100vh;
min-height:100dvh;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
position:relative;
}

.hero::before{
content:"";
position:absolute;
inset:0;
background:
radial-gradient(circle at 18% 22%, rgba(212,255,79,.10), transparent 38%),
radial-gradient(circle at 84% 78%, rgba(244,183,63,.16), transparent 42%);
pointer-events:none;
}

.hero::after{
content:"";
position:absolute;
top:50%;
left:50%;
width:760px;
height:760px;
transform:translate(-50%,-50%);
background:radial-gradient(circle, rgba(244,183,63,.10), transparent 70%);
pointer-events:none;
}

.hero > *{
position:relative;
z-index:1;
}

.eyebrow{
color:var(--lime);
letter-spacing:.36em;
text-transform:uppercase;
font-size:.7rem;
margin-bottom:24px;
font-weight:700;
}

.hero-title{
font-size:clamp(4rem,14vw,10.5rem);
font-weight:800;
line-height:.92;
letter-spacing:-0.03em;
background:linear-gradient(135deg, var(--white) 0%, var(--gold-light) 45%, var(--gold) 75%, var(--lime) 100%);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
}

.hero-sub{
max-width:560px;
margin-top:30px;
color:var(--muted);
line-height:1.8;
font-size:1.02rem;
}

.hero-actions{
margin-top:34px;
display:flex;
gap:16px;
flex-wrap:wrap;
justify-content:center;
}

/* SIGNATURE: Live earnings ticker */
.earn-ticker{
margin-top:48px;
display:flex;
align-items:center;
gap:22px;
padding:18px 30px;
border:1px solid var(--line);
border-radius:20px;
background:linear-gradient(145deg, rgba(28,28,39,.85), rgba(15,15,22,.85));
box-shadow:0 24px 60px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.04);
transform:rotate(-1.4deg);
}

.earn-ticker-icon{
width:46px;
height:46px;
border-radius:14px;
background:linear-gradient(135deg, var(--lime), var(--gold));
display:flex;
align-items:center;
justify-content:center;
font-size:1.4rem;
flex-shrink:0;
box-shadow:0 0 24px rgba(212,255,79,.35);
}

.earn-ticker-text{
text-align:left;
}

.earn-ticker-label{
font-size:.66rem;
letter-spacing:.24em;
text-transform:uppercase;
color:var(--muted);
margin-bottom:6px;
}

.earn-ticker-value{
font-family:var(--display);
font-size:1.9rem;
font-weight:800;
color:var(--lime);
display:flex;
align-items:baseline;
gap:6px;
}

.earn-ticker-value small{
font-size:.7rem;
color:var(--muted);
font-weight:600;
letter-spacing:.08em;
text-transform:uppercase;
}

@media(max-width:560px){
.earn-ticker{
flex-direction:column;
text-align:center;
transform:rotate(0deg);
padding:18px 22px;
}
.earn-ticker-text{
text-align:center;
}
}

.shine-btn,
.btn-primary{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:48px;
padding:14px 32px;
border-radius:999px;
border:1px solid rgba(255,255,255,.16);
background:rgba(255,255,255,.02);
color:#fff;
text-decoration:none;
font-size:.78rem;
font-weight:700;
letter-spacing:.18em;
text-transform:uppercase;
cursor:pointer;
position:relative;
overflow:hidden;
transition:.3s;
touch-action:manipulation;
}

.shine-btn::before,
.shine-card::before,
.join-btn::before{
content:"";
position:absolute;
top:0;
left:-100%;
width:100%;
height:100%;
background:linear-gradient(120deg, transparent, rgba(212,255,79,.18), transparent);
transition:.45s;
pointer-events:none;
}

.shine-btn:hover,
.shine-card:hover{
transform:translateY(-5px) scale(1.02);
border-color:var(--lime);
box-shadow:0 16px 34px rgba(212,255,79,.14);
}

.shine-btn:hover::before,
.shine-card:hover::before,
.join-btn:hover::before{
left:100%;
}

.btn-primary{
background:linear-gradient(135deg, var(--gold-light), var(--gold));
color:#15130a;
border-color:transparent;
font-weight:800;
}

.btn-primary:hover{
background:linear-gradient(135deg, var(--lime), var(--gold-light));
transform:translateY(-3px);
box-shadow:0 16px 32px rgba(212,255,79,.22);
}

.btn-primary:disabled,
.join-btn:disabled{
cursor:not-allowed;
opacity:.68;
transform:none;
}

.ticker{
width:min(650px,90vw);
margin-top:28px;
overflow:hidden;
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
padding:14px 0;
mask-image:linear-gradient(to right, transparent, black 12%, black 88%, transparent);
}

.ticker-track{
display:flex;
gap:34px;
width:max-content;
white-space:nowrap;
animation:featureSlide 5.5s ease-in-out infinite alternate;
}

.ticker-track span{
color:var(--muted);
font-size:.76rem;
letter-spacing:.22em;
text-transform:uppercase;
}

@keyframes featureSlide{
from{transform:translateX(0);}
to{transform:translateX(calc(-100% + min(650px,90vw)));}
}

.features{
max-width:1180px;
margin:0 auto;
}

.section-label{
color:var(--lime);
letter-spacing:.42em;
text-transform:uppercase;
font-size:.7rem;
margin-bottom:16px;
font-weight:700;
}

.section-title{
font-size:clamp(2.2rem,5vw,4rem);
font-weight:800;
margin-bottom:44px;
letter-spacing:-0.02em;
}

.features-grid,
.membership-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:22px;
max-width:1240px;
margin:0 auto;
}

.feature-card,
.plan-card{
background:var(--panel);
border:1px solid var(--line);
border-radius:22px;
padding:30px;
position:relative;
overflow:hidden;
transition:.3s;
}

.feature-number{
font-family:var(--display);
font-size:2.7rem;
font-weight:800;
color:rgba(244,183,63,.16);
margin-bottom:16px;
}

.feature-card h3{
color:var(--gold-light);
font-size:1rem;
letter-spacing:.1em;
text-transform:uppercase;
margin-bottom:12px;
font-family:var(--display);
}

.feature-card p,
.plan-card li{
color:var(--muted);
line-height:1.75;
font-size:.9rem;
}

.stats-cta{
display:flex;
justify-content:center;
margin:42px 0 28px;
}

.status-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:16px;
}

.status-card{
background:var(--panel);
border:1px solid var(--line);
border-radius:20px;
padding:24px;
text-align:center;
position:relative;
overflow:hidden;
transition:.3s;
}

.status-card > *{
position:relative;
z-index:1;
}

.status-value{
color:var(--lime);
font-size:clamp(1.7rem,4vw,2.5rem);
font-weight:800;
line-height:1;
margin-bottom:10px;
}

.status-title{
color:#fff;
font-size:.86rem;
font-weight:700;
letter-spacing:.12em;
text-transform:uppercase;
margin-bottom:8px;
}

.status-text{
color:var(--muted);
font-size:.82rem;
line-height:1.6;
}

.login-section{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
background:#0b0b0f;
}

.login-box{
width:min(420px,100%);
padding:46px;
background:var(--panel);
border:1px solid var(--line);
border-radius:24px;
box-shadow:0 18px 50px rgba(0,0,0,.55);
text-align:center;
animation:fadeInUp .8s cubic-bezier(.25,1,.5,1) forwards;
}

@keyframes fadeInUp{
from{opacity:0;transform:translateY(30px);}
to{opacity:1;transform:translateY(0);}
}

.login-logo{
font-size:36px;
font-weight:800;
color:var(--gold-light);
letter-spacing:.04em;
}

.login-sub{
font-size:.72rem;
letter-spacing:.28em;
color:var(--muted);
margin:10px 0 28px;
text-transform:uppercase;
}

input{
width:100%;
padding:15px;
margin:10px 0;
background:rgba(255,255,255,.02);
border:1px solid rgba(255,255,255,.14);
color:#fff;
font-size:15px;
border-radius:12px;
transition:.3s;
}

input:focus{
outline:none;
border-color:var(--lime);
box-shadow:0 0 14px rgba(212,255,79,.18);
}

.otp-action{
width:100%;
margin:10px 0;
}

.otp-status{
min-height:22px;
margin:4px 0 8px;
font-size:.78rem;
color:var(--muted);
}

.otp-status.success{
color:var(--lime);
}

.otp-status.error{
color:#ff8d8d;
}

.form-note{
margin-top:18px;
font-size:.86rem;
color:var(--muted);
}

.form-note a,
.footer-contact{
color:var(--gold);
text-decoration:none;
}

.store-section{
background:#edf1f5;
color:#111827;
padding:92px 18px 42px;
text-align:left;
}

.shop-shell,
.category-wrap{
max-width:1240px;
margin:0 auto;
}

.shop-shell{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:14px;
align-items:start;
}

.shop-topbar{
display:grid;
grid-template-columns:170px minmax(220px,1fr) auto;
gap:12px;
align-items:center;
background:#172337;
border-radius:8px;
padding:12px;
box-shadow:0 12px 30px rgba(15,23,42,.18);
position:sticky;
top:84px;
z-index:70;
}

.store-heading{
font-size:1.35rem;
line-height:1;
font-weight:900;
color:#ffd814;
letter-spacing:.08em;
text-transform:uppercase;
}

.search{
margin:0;
position:relative;
}

.search input{
height:46px;
width:100%;
max-width:none;
margin:0;
border-radius:4px;
background:#fff;
color:#111827;
border:0;
padding:0 128px 0 16px;
box-shadow:none;
}

.search::after{
content:"Search";
position:absolute;
right:0;
top:0;
bottom:0;
width:104px;
display:flex;
align-items:center;
justify-content:center;
background:#ffce12;
color:#172337;
border-radius:0 4px 4px 0;
font-size:.78rem;
font-weight:900;
letter-spacing:.06em;
text-transform:uppercase;
pointer-events:none;
}

/* Real, clickable search button (replaces the decorative ::after on nav search) */
.nav-search::after{display:none;}
.search-go{
position:absolute;
right:0;top:0;bottom:0;
width:54px;
border:0;
background:#ffce12;
color:#172337;
border-radius:0 4px 4px 0;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
}
.search-go:hover{background:#ffd84a;}
.search-go svg{display:block;}

/* Right-side action group (location, membership, profile/login) */
.nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto;}
/* Make all three pills one matched set — same height + gold pill shape. */
.nav-actions > .nav-loc,
.nav-actions > .nav-icon-btn,
.nav-actions > .nav-profile,
.nav-actions > .nav-cta{
height:40px;border-radius:999px;border:1px solid var(--gold);
display:inline-flex;align-items:center;justify-content:center;
box-sizing:border-box;padding:0 14px;font-size:.8rem;font-weight:700;
background:transparent;color:var(--gold-light);margin:0;line-height:1;
}
.nav-actions > .nav-profile{padding:0 12px 0 6px;}
.nav-actions .nav-avatar{width:28px;height:28px;}

/* Nav delivery-location pill — matches the Membership / Profile gold pills */
.nav-loc{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--gold);color:var(--gold-light);border-radius:999px;padding:9px 14px;cursor:pointer;flex-shrink:0;max-width:180px;font-weight:700;line-height:1;}
.nav-loc:hover{background:var(--gold);color:#0a0a0f;}
.nav-loc:hover .nav-loc-col b{color:#0a0a0f;}
.nav-loc-ico{font-size:.95rem;line-height:1;flex-shrink:0;}
.nav-loc-col{display:inline-flex;align-items:center;min-width:0;}
.nav-loc-col small{display:none;}
.nav-loc-col b{font-size:.78rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.ec-sort-label{font-size:.8rem;color:#64748b;font-weight:700;white-space:nowrap;}

/* Contact link icon in the drawer */
.dl-contact{display:inline-flex;align-items:center;gap:7px;}
.dl-ico{flex-shrink:0;}

/* Safety net: the light (white) pages must always have dark, visible input text
   (the global input{color:#fff} is only for the dark hero/login sections). */
.category-page input,.category-page select,.category-page textarea,
.checkout-form input,.checkout-form textarea{
color:#172337;-webkit-text-fill-color:#172337;
}
.category-page input::placeholder,.checkout-form input::placeholder,
.category-page textarea::placeholder{color:#9aa6b5;-webkit-text-fill-color:#9aa6b5;}

.quick-actions{
display:flex;
gap:10px;
min-width:0;
margin:0;
}

.shop-action-row{
display:block;
}

.menu-toggle{
display:none;
}

.hamburger-lines{
width:22px;
display:grid;
gap:5px;
}

.hamburger-lines span{
display:block;
height:2px;
border-radius:999px;
background:var(--gold-light);
transition:.3s;
}

.category-menu{
display:block;
}

.category-menu-inner{
overflow:visible;
}

.menu-label{
display:none;
}

.categories{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:10px;
padding:12px;
max-width:none;
margin:0;
overflow:visible;
background:#fff;
border-radius:8px;
box-shadow:0 8px 22px rgba(15,23,42,.08);
}

.category-card{
width:100%;
min-height:72px;
padding:10px;
background:#fff;
border:1px solid rgba(15,23,42,.08);
border-radius:6px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:7px;
cursor:pointer;
position:relative;
overflow:hidden;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
touch-action:manipulation;
color:#172337;
}

.category-card::before,
.product-card::before,
.subcategory-card::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(120deg, transparent 0%, rgba(40,116,240,.12) 42%, rgba(255,206,18,.18) 52%, transparent 66%);
transform:translateX(-120%);
transition:transform .55s ease;
pointer-events:none;
}

.category-card:hover,
.category-card.active-category{
transform:translateY(-5px) scale(1.02);
border-color:#2874f0;
box-shadow:0 16px 30px rgba(40,116,240,.18);
}

.category-card:hover::before,
.product-card:hover::before,
.subcategory-card:hover::before{
transform:translateX(120%);
}

.category-card:hover .icon,
.product-card:hover .product-image,
.subcategory-card:hover .subcategory-icon{
transform:scale(1.08);
}

.quick-actions .category-card{
min-height:46px;
min-width:130px;
background:#243b5a;
border-color:rgba(255,255,255,.12);
color:#fff;
box-shadow:none;
flex-direction:row;
}

.quick-actions .category-card:hover{
background:#2f4b70;
border-color:#ffce12;
box-shadow:0 10px 22px rgba(255,206,18,.18);
}

.category-card .icon{
font-size:1.55rem;
position:relative;
z-index:1;
font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
line-height:1;
transition:transform .28s ease;
}

.category-card h3{
color:inherit;
font-size:.82rem;
line-height:1.1;
position:relative;
z-index:1;
}

.shop-content{
min-width:0;
display:grid;
grid-template-columns:minmax(0,1fr);
gap:14px;
}

.shop-hero{
min-height:130px;
border-radius:8px;
padding:16px 20px;
display:grid;
grid-template-columns:minmax(0,1fr);
align-items:center;
gap:14px;
background:linear-gradient(135deg,#fff 0%,#e8f2ff 48%,#d7e6fb 100%);
color:#172337;
position:relative;
overflow:hidden;
box-shadow:0 10px 28px rgba(15,23,42,.1);
}

.shop-hero-copy span{
display:inline-flex;
background:#ffef9a;
color:#7a5600;
font-size:.66rem;
font-weight:900;
letter-spacing:.12em;
text-transform:uppercase;
margin-bottom:8px;
padding:5px 9px;
border-radius:4px;
}

.shop-hero-copy h2{
font-size:clamp(1.3rem,2.6vw,2.2rem);
line-height:1.05;
font-weight:900;
letter-spacing:0;
}

.shop-hero-copy p{
max-width:510px;
margin-top:8px;
font-size:.85rem;
color:#475569;
line-height:1.45;
}

.deal-row{
display:flex;
gap:12px;
flex-wrap:wrap;
margin-top:12px;
}

.deal-pill{
background:#16a34a;
color:#fff;
border-radius:4px;
padding:8px 10px;
font-size:.78rem;
font-weight:900;
}

.shop-visual-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
}

.visual-tile{
min-height:80px;
border-radius:8px;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:2.6rem;
box-shadow:0 12px 28px rgba(15,23,42,.14);
font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
}

.visual-tile.wide{
grid-column:span 2;
min-height:56px;
background:#172337;
color:#fff;
font-size:.85rem;
font-weight:900;
letter-spacing:.08em;
text-transform:uppercase;
}

.store-band,
.category-band{
background:#fff;
border-radius:8px;
padding:18px;
box-shadow:0 8px 22px rgba(15,23,42,.08);
transition:transform .28s ease, box-shadow .28s ease;
}

.store-band:hover,
.category-band:hover{
transform:translateY(-2px);
box-shadow:0 14px 34px rgba(15,23,42,.12);
}

.band-heading{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
margin-bottom:14px;
}

.band-heading h3{
font-size:1.18rem;
color:#172337;
}

.band-heading span{
font-size:.78rem;
font-weight:800;
color:#2874f0;
}

.product-strip,
.category-products{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:14px;
margin-top:0;
}

.product-card,
.subcategory-card{
background:#fff;
border:1px solid rgba(15,23,42,.08);
border-radius:6px;
padding:12px;
box-shadow:none;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
position:relative;
overflow:hidden;
}

.product-card:hover,
.subcategory-card:hover{
transform:translateY(-7px);
border-color:rgba(40,116,240,.28);
box-shadow:0 18px 34px rgba(15,23,42,.16);
}

.product-card.is-hidden,
.subcategory-card.is-hidden,
.wallet-row.is-hidden{
display:none;
}

/* Global hide helper — forms/panels that should stay collapsed until opened
   (address form, admin panel, withdraw method forms, etc.). */
.is-hidden{display:none !important;}

.product-badge{
display:inline-flex;
align-items:center;
min-height:24px;
padding:4px 8px;
border-radius:4px;
background:#e8f7ee;
color:#13803d;
font-size:.68rem;
font-weight:900;
text-transform:uppercase;
margin-bottom:10px;
}

.product-image,
.subcategory-icon{
height:148px;
border-radius:6px;
background:#f3f6fb;
display:flex;
align-items:center;
justify-content:center;
font-size:4rem;
font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
margin-bottom:12px;
transition:transform .28s ease, background .28s ease;
}

.product-card:hover .product-image,
.subcategory-card:hover .subcategory-icon{
background:#eaf2ff;
}

.product-image img{
width:100%;
height:100%;
object-fit:contain;
display:block;
min-width:0;
}

/* Grid/flex children must be allowed to shrink, otherwise a wide intrinsic
   image (1000px source) forces each card past the screen width — which made the
   2-column grid overflow and look like a single full-width product on phones. */
.product-card,
.subcategory-card{
min-width:0;
}
.product-image{
min-width:0;
overflow:hidden;
}

.product-card h3,
.subcategory-card h3{
font-size:.95rem;
line-height:1.25;
color:#172337;
margin-bottom:6px;
}

.product-card p,
.subcategory-card p{
font-size:.8rem;
color:#64748b;
line-height:1.45;
}

.rating{
display:inline-flex;
align-items:center;
gap:4px;
margin:8px 0;
padding:3px 7px;
border-radius:4px;
background:#16a34a;
color:#fff;
font-size:.72rem;
font-weight:800;
}

.product-price{
display:flex;
align-items:baseline;
gap:8px;
margin-top:5px;
font-weight:900;
color:#111827;
font-size:1.05rem;
}

.product-price del{
color:#94a3b8;
font-size:.78rem;
font-weight:600;
}

.product-offer{
display:block;
margin-top:4px;
color:#16a34a;
font-size:.76rem;
font-weight:800;
}

.cart-btn{
width:100%;
margin-top:12px;
min-height:38px;
border:0;
border-radius:4px;
background:#ff9f00;
color:#111827;
font-weight:900;
cursor:pointer;
transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}

.cart-btn.secondary{
background:#fff;
border:1px solid #2874f0;
color:#2874f0;
}

.cart-btn:hover{
background:#fb641b;
color:#fff;
transform:translateY(-2px);
box-shadow:0 10px 20px rgba(251,100,27,.24);
}

.cart-btn:active{
transform:translateY(0) scale(.98);
}

.product-actions{
display:grid;
grid-template-columns:1fr 1fr;
gap:8px;
}

.product-actions .cart-btn{
margin-top:12px;
}

.cart-count{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:22px;
height:22px;
padding:0 6px;
border-radius:999px;
background:#ffce12;
color:#172337;
font-size:.72rem;
font-weight:900;
}

.floating-cart{
position:fixed;
right:22px;
bottom:22px;
z-index:95;
display:none;
align-items:center;
gap:10px;
min-height:50px;
padding:0 16px 0 14px;
border:0;
border-radius:999px;
background:#172337;
color:#fff;
box-shadow:0 16px 36px rgba(15,23,42,.28);
font-weight:900;
cursor:pointer;
transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}

.floating-cart::before{
content:"\1F6D2";
font-size:1.15rem;
line-height:1;
}

.floating-cart:hover{
background:#0f172a;
transform:translateY(-3px);
box-shadow:0 20px 42px rgba(15,23,42,.34);
}

.floating-cart .cart-count{
background:var(--lime);
color:#172337;
}

body[data-page="store"] .floating-cart,
body[data-page="boys"] .floating-cart,
body[data-page="girls"] .floating-cart,
body[data-page="women"] .floating-cart,
body[data-page="child"] .floating-cart,
body[data-page="gadgets"] .floating-cart{
display:flex;
}

.product-empty{
display:none;
margin-top:24px;
padding:22px;
border:1px dashed rgba(0,0,0,.18);
border-radius:8px;
background:#fff;
color:#5d5d5d;
text-align:center;
}

.product-empty.is-visible{
display:block;
}

.api-product-status{
margin:0 0 14px;
color:#64748b;
font-size:.84rem;
line-height:1.5;
}

.api-product-status.error{
color:#b91c1c;
}

.api-product-status.success{
color:#13803d;
font-weight:800;
}

.wallet-summary{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
margin-top:24px;
}

.wallet-stat{
background:#fff;
border:1px solid rgba(0,0,0,.08);
border-radius:8px;
padding:18px;
box-shadow:0 12px 28px rgba(0,0,0,.08);
}

.wallet-stat span{
display:block;
font-size:.72rem;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase;
color:#777;
margin-bottom:8px;
}

.wallet-stat strong{
font-size:1.7rem;
color:#151515;
}

.wallet-table{
margin-top:22px;
background:#fff;
border:1px solid rgba(0,0,0,.08);
border-radius:8px;
overflow:hidden;
box-shadow:0 12px 28px rgba(0,0,0,.08);
}

.wallet-row{
display:grid;
grid-template-columns:1.2fr 1fr 1fr .9fr;
gap:12px;
padding:14px 18px;
align-items:center;
border-top:1px solid rgba(0,0,0,.07);
font-size:.9rem;
}

.wallet-row:first-child{
border-top:0;
background:#15191b;
color:#fff;
font-size:.72rem;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
}

.wallet-amount{
font-weight:900;
color:#151515;
}

.wallet-row:first-child .wallet-amount{
color:#fff;
}

.wallet-status{
display:inline-flex;
justify-content:center;
padding:6px 10px;
border-radius:999px;
background:rgba(201,168,76,.18);
color:#6f561d;
font-size:.72rem;
font-weight:800;
}

.cart-section,
.checkout-section{
background:#edf1f5;
color:#111827;
padding:104px 18px 60px;
}

.cart-shell,
.checkout-shell{
max-width:1240px;
margin:0 auto;
display:grid;
gap:16px;
}

.cart-grid,
.checkout-grid{
display:grid;
grid-template-columns:minmax(0,1fr) 360px;
gap:16px;
align-items:start;
}

.cart-panel,
.summary-panel,
.checkout-panel,
.suggestion-panel{
background:#fff;
border:1px solid rgba(15,23,42,.08);
border-radius:8px;
padding:18px;
box-shadow:0 8px 22px rgba(15,23,42,.08);
}

.cart-panel h2,
.summary-panel h3,
.checkout-panel h2,
.suggestion-panel h3{
color:#172337;
line-height:1.2;
}

.cart-list{
display:grid;
gap:12px;
margin-top:16px;
}

.cart-empty{
padding:28px;
border:1px dashed rgba(15,23,42,.18);
border-radius:8px;
color:#64748b;
text-align:center;
}

.cart-item{
display:grid;
grid-template-columns:76px minmax(0,1fr) auto;
gap:12px;
align-items:center;
padding:12px;
border:1px solid rgba(15,23,42,.08);
border-radius:8px;
}

.cart-item-image{
width:76px;
height:76px;
border-radius:6px;
background:#f3f6fb;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
font-size:2.1rem;
font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
}

.cart-item-image img{
width:100%;
height:100%;
object-fit:contain;
}

.cart-item h3{
font-size:.96rem;
line-height:1.28;
color:#172337;
}

.cart-meta{
display:block;
margin-top:4px;
font-size:.76rem;
color:#64748b;
}

.cart-price{
display:block;
margin-top:8px;
font-weight:900;
color:#111827;
}

.qty-control{
display:flex;
align-items:center;
justify-content:flex-end;
gap:8px;
}

.qty-control button,
.remove-item-btn,
.suggestion-btn{
border:0;
border-radius:4px;
font-weight:900;
cursor:pointer;
}

.qty-control button{
width:30px;
height:30px;
background:#e8f2ff;
color:#2874f0;
}

.qty-control span{
min-width:24px;
text-align:center;
font-weight:900;
}

.remove-item-btn{
margin-top:10px;
background:transparent;
color:#b91c1c;
font-size:.76rem;
}

.summary-row{
display:flex;
justify-content:space-between;
gap:12px;
padding:10px 0;
border-bottom:1px solid rgba(15,23,42,.08);
color:#475569;
font-size:.9rem;
}

.summary-row.total{
border-bottom:0;
font-size:1.1rem;
font-weight:900;
color:#111827;
}

.summary-row.member-disc span,
.summary-row.member-disc strong{color:#1a7f37;font-weight:700;}
.summary-row.wallet-row span,
.summary-row.wallet-row strong{color:#1559b3;font-weight:700;}
.summary-note{margin-top:10px;font-size:.82rem;line-height:1.45;}
.summary-note.member-upsell{background:#fff8e6;border:1px solid #f3d27a;color:#7a5600;padding:10px 12px;border-radius:8px;}

/* ===== Order confirmed modal ===== */
.oc-overlay{position:fixed;inset:0;z-index:300;background:rgba(8,10,20,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s;}
.oc-overlay.open{opacity:1;pointer-events:auto;}
.oc-modal{background:#fff;border-radius:18px;max-width:420px;width:100%;padding:32px 26px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.3);transform:translateY(12px) scale(.97);transition:transform .25s;}
.oc-overlay.open .oc-modal{transform:none;}
.oc-check{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#1a7f37,#22c55e);color:#fff;font-size:2.4rem;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 8px 22px rgba(26,127,55,.4);animation:ocPop .35s ease;}
@keyframes ocPop{0%{transform:scale(.4);opacity:0;}60%{transform:scale(1.12);}100%{transform:scale(1);opacity:1;}}
.oc-modal h2{font-size:1.4rem;color:#111827;margin-bottom:8px;}
.oc-sub{color:#475569;font-size:.92rem;line-height:1.5;margin-bottom:20px;}
.oc-actions{display:flex;flex-direction:column;gap:10px;}
.oc-actions .btn-primary{width:100%;}
.oc-secondary{width:100%;background:#fff;border:1px solid #cbd5e1;color:#172337;border-radius:10px;padding:11px;font-weight:700;cursor:pointer;}
.oc-secondary:hover{background:#f1f5f9;}

/* ===== Product review modal (multi-step) ===== */
.rv-overlay{position:fixed;inset:0;z-index:310;background:rgba(8,10,20,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .25s;}
.rv-overlay.open{opacity:1;pointer-events:auto;}
.rv-modal{position:relative;background:#fff;border-radius:18px;max-width:440px;width:100%;padding:26px 24px;box-shadow:0 24px 60px rgba(0,0,0,.3);}
.rv-close{position:absolute;top:12px;right:14px;background:none;border:0;font-size:1.5rem;color:#94a3b8;cursor:pointer;line-height:1;}
.rv-prod{font-weight:800;color:#172337;font-size:.9rem;margin-bottom:6px;padding-right:24px;}
.rv-steps-bar{display:flex;gap:6px;margin-bottom:16px;}
.rv-dot{flex:1;height:5px;border-radius:999px;background:#e2e8f0;transition:.2s;}
.rv-dot.on{background:#1a7f37;}
.rv-step h3{font-size:1.05rem;color:#111827;margin-bottom:14px;}
.rv-step h3 small{font-weight:500;color:#94a3b8;}
.rv-stars{display:flex;justify-content:center;gap:8px;margin:6px 0;}
.rv-stars button{background:none;border:0;font-size:2.4rem;line-height:1;color:#e2e8f0;cursor:pointer;transition:.1s;}
.rv-stars button.on{color:#fbbf24;transform:scale(1.05);}
.rv-label{text-align:center;font-weight:800;color:#172337;min-height:1.4em;margin-bottom:16px;}
.rv-fullbtn{width:100%;}
.rv-photos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.rv-thumb{position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;border:1px solid #e2e8f0;}
.rv-thumb img{width:100%;height:100%;object-fit:cover;}
.rv-thumb button{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:.8rem;line-height:1;cursor:pointer;}
.rv-addphoto{display:inline-flex;align-items:center;gap:6px;border:1px dashed #94a3b8;color:#475569;border-radius:10px;padding:10px 14px;font-weight:700;font-size:.85rem;cursor:pointer;}
.rv-addphoto:hover{border-color:#1a7f37;color:#1a7f37;}
.rv-step textarea{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:11px;font-size:.9rem;resize:vertical;margin-bottom:12px;}
.rv-step-actions{display:flex;gap:10px;}
.rv-step-actions button{flex:1;}
.rv-status{text-align:center;font-size:.85rem;margin-top:10px;font-weight:700;}
.rv-status.success{color:#16a34a;}
.rv-status.error{color:#dc2626;}
.od-rate-btn{margin-top:6px;background:#fff7e6;border:1px solid #f3d27a;color:#7a5600;border-radius:8px;padding:6px 12px;font-weight:800;font-size:.78rem;cursor:pointer;}
.od-rate-btn:hover{background:#ffce12;color:#172337;}
.od-rate-card{background:linear-gradient(135deg,#ffffff,#fffaf0);border:1px solid #f3d27a;}
.od-rate-sub{font-size:.82rem;color:#7a5600;margin:2px 0 12px;}
.od-rate-list{display:flex;flex-direction:column;gap:8px;}
.od-rate-row{display:flex;align-items:center;gap:12px;padding:8px;background:#fff;border:1px solid #f1e3bf;border-radius:10px;}
.od-rate-thumb{width:44px;height:44px;border-radius:8px;overflow:hidden;background:#f5f5f5;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.od-rate-thumb img{width:100%;height:100%;object-fit:cover;}
.od-rate-name{flex:1;min-width:0;font-size:.85rem;font-weight:600;color:#172337;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.od-rate-row .od-rate-btn{margin-top:0;flex-shrink:0;}

/* ===== Out of stock ===== */
.cart-btn.out-of-stock{background:#e2e8f0!important;color:#64748b!important;cursor:not-allowed;border:0;}
.soldout-badge{position:absolute;top:8px;left:8px;background:#dc2626;color:#fff;font-size:.7rem;font-weight:800;padding:3px 9px;border-radius:6px;z-index:2;letter-spacing:.02em;}
.product-card.is-soldout .product-image img{opacity:.55;filter:grayscale(.3);}

.checkout-btn{
width:100%;
min-height:44px;
margin-top:14px;
border:0;
border-radius:4px;
background:#fb641b;
color:#fff;
font-weight:900;
cursor:pointer;
}

.checkout-btn:disabled{
opacity:.5;
cursor:not-allowed;
}

.suggestion-panel{
display:grid;
gap:14px;
}

.suggestion-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:12px;
}

.suggestion-card{
border:1px solid rgba(15,23,42,.08);
border-radius:8px;
padding:12px;
background:#fff;
display:grid;
gap:8px;
}

.suggestion-card strong{
color:#172337;
line-height:1.25;
}

.suggestion-card span{
color:#64748b;
font-size:.8rem;
}

.suggestion-card .suggestion-price{
color:#111827;
font-weight:900;
}

.suggestion-btn{
min-height:34px;
background:#ffce12;
color:#172337;
}

.checkout-form{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
margin-top:16px;
}

.checkout-form input,
.checkout-form textarea{
width:100%;
border:1px solid rgba(15,23,42,.12);
border-radius:6px;
padding:12px;
font:inherit;
color:#111827;
background:#fff;
}

.checkout-form textarea,
.checkout-form .full{
grid-column:1 / -1;
}

.checkout-form textarea{
min-height:88px;
resize:vertical;
}

.checkout-note{
margin-top:12px;
padding:12px;
border-radius:6px;
background:#e8f7ee;
color:#13803d;
font-size:.86rem;
font-weight:800;
}

.category-page{
background:#edf1f5;
color:#111827;
padding:104px 18px 60px;
}

.category-hero{
border-radius:8px;
padding:30px;
background:linear-gradient(135deg,#172337,#2874f0);
color:#fff;
display:grid;
grid-template-columns:minmax(0,1fr) 260px;
align-items:center;
justify-content:space-between;
gap:20px;
box-shadow:0 14px 30px rgba(15,23,42,.16);
}

.category-hero h2{
font-size:clamp(2.4rem,6vw,4.5rem);
line-height:.98;
font-weight:900;
}

.category-hero p{
max-width:420px;
color:rgba(255,255,255,.72);
line-height:1.7;
margin-top:12px;
}

.category-section-title{
margin:34px 0 16px;
font-size:1.45rem;
font-weight:900;
}

.category-searchbar{
display:grid;
grid-template-columns:160px minmax(220px,1fr) auto;
gap:12px;
align-items:center;
position:sticky;
top:84px;
z-index:70;
margin-bottom:14px;
padding:12px;
border-radius:8px;
background:#172337;
box-shadow:0 12px 30px rgba(15,23,42,.18);
}

.category-search-title{
font-size:1.08rem;
line-height:1;
font-weight:900;
color:#ffd814;
letter-spacing:.08em;
text-transform:uppercase;
}

.category-visual{
display:flex;
align-items:center;
justify-content:center;
min-height:180px;
border-radius:8px;
background:rgba(255,255,255,.14);
font-size:5rem;
font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
}

.category-filter-row{
display:flex;
gap:10px;
flex-wrap:wrap;
margin:18px 0;
}

.filter-chip{
border:1px solid rgba(15,23,42,.12);
background:#fff;
border-radius:999px;
padding:9px 14px;
font-size:.78rem;
font-weight:800;
color:#334155;
}

.membership-section{
background:#0b0b0b;
}

.app-page{
display:none !important;
min-height:100vh;
min-height:100dvh;
opacity:0;
transform:translateX(22px);
pointer-events:none;
}

.app-page.active{
display:block !important;
opacity:1;
transform:translateX(0);
pointer-events:auto;
animation:openPage .38s ease both;
}

.page-back-btn{
position:fixed;
left:18px;
top:80px;
z-index:130;
display:none;
align-items:center;
justify-content:center;
width:46px;
height:46px;
padding:0;
border:0;
border-radius:50%;
background:
linear-gradient(145deg, rgba(30,34,52,.95), rgba(15,18,28,.95));
color:#fff;
font-size:1.35rem;
font-weight:800;
line-height:1;
cursor:pointer;
backdrop-filter:blur(10px) saturate(150%);
-webkit-backdrop-filter:blur(10px) saturate(150%);
box-shadow:
0 8px 22px rgba(0,0,0,.45),
inset 0 1px 0 rgba(255,255,255,.08);
transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease, background .25s ease;
}

/* gradient ring border using pseudo element */
.page-back-btn::before{
content:"";
position:absolute;
inset:-2px;
border-radius:50%;
padding:2px;
background:linear-gradient(135deg, var(--gold-light), var(--lime));
-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask-composite:exclude;
opacity:.55;
transition:opacity .25s ease;
}

/* Show back button on every page EXCEPT the home store page */
body:not([data-page="store"]) .page-back-btn{
display:inline-flex;
}

.page-back-btn.is-visible{
display:inline-flex;
}

.page-back-btn:hover{
transform:translateY(-3px) scale(1.06);
background:linear-gradient(145deg, rgba(36,40,58,.98), rgba(20,24,34,.98));
box-shadow:
0 14px 32px rgba(212,255,79,.28),
0 4px 12px rgba(0,0,0,.4),
inset 0 1px 0 rgba(255,255,255,.12);
}

.page-back-btn:hover::before{
opacity:1;
}

.page-back-btn:active{
transform:translateY(-1px) scale(.98);
}

.login-section.app-page.active{
display:flex !important;
}

@keyframes openPage{
from{
opacity:0;
transform:translateX(22px);
}

to{
opacity:1;
transform:translateX(0);
}
}

.membership-heading{
text-align:center;
margin-bottom:46px;
}

.membership-heading h2{
font-size:clamp(2.4rem,7vw,4.4rem);
color:var(--white);
font-weight:800;
background:linear-gradient(135deg, var(--gold-light), var(--gold), var(--lime));
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
}

.membership-heading p{
color:var(--muted);
margin-top:10px;
letter-spacing:.18em;
text-transform:uppercase;
font-size:.8rem;
}

/* ---- T&C CHECKBOX ---- */
.tnc-check{
display:flex;
align-items:flex-start;
gap:9px;
margin:4px 0 6px;
text-align:left;
cursor:pointer;
}
.tnc-check input[type=checkbox]{
width:18px;height:18px;
min-width:18px;
margin-top:2px;
accent-color:var(--lime);
cursor:pointer;
}
.tnc-check span{
color:var(--muted);
font-size:.82rem;
line-height:1.45;
}
.tnc-check a{
color:var(--gold-light);
text-decoration:underline;
}

/* ---- T&C MODAL ---- */
.tnc-overlay{
position:fixed;
inset:0;
background:rgba(0,0,0,.72);
backdrop-filter:blur(4px);
display:none;
align-items:center;
justify-content:center;
z-index:2000;
padding:20px;
}
.tnc-overlay.open{
display:flex;
animation:tncFade .25s ease both;
}
@keyframes tncFade{from{opacity:0}to{opacity:1}}
.tnc-modal{
background:var(--panel);
border:1px solid var(--line);
border-radius:22px;
max-width:560px;
width:100%;
max-height:86vh;
display:flex;
flex-direction:column;
box-shadow:0 30px 70px rgba(0,0,0,.6);
overflow:hidden;
}
.tnc-modal-head{
display:flex;
align-items:center;
justify-content:space-between;
padding:20px 24px;
border-bottom:1px solid var(--line);
}
.tnc-modal-head h3{
font-size:1.4rem;
background:linear-gradient(135deg,var(--gold-light),var(--lime));
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.tnc-close{
background:none;border:none;color:var(--muted);
font-size:1.8rem;line-height:1;cursor:pointer;padding:0 6px;
}
.tnc-close:hover{color:var(--white);}
.tnc-modal-body{
padding:20px 24px;
overflow-y:auto;
}
.tnc-modal-body p{
color:var(--muted);
font-size:.9rem;
line-height:1.6;
margin-bottom:12px;
}
.tnc-modal-body h4{
color:var(--white);
font-size:1rem;
margin:16px 0 6px;
}
.tnc-modal-body strong{color:var(--white);}
.tnc-modal-body a{color:var(--gold-light);text-decoration:underline;}
.tnc-contact{margin-top:18px;font-size:.84rem;}
.tnc-modal-foot{
display:flex;
gap:12px;
padding:18px 24px;
border-top:1px solid var(--line);
}
.tnc-agree{flex:1;margin:0;}
.tnc-decline{
background:var(--panel-soft);
border:1px solid var(--line);
color:var(--muted);
border-radius:999px;
padding:0 22px;
font-weight:700;
cursor:pointer;
transition:.25s;
}
.tnc-decline:hover{color:var(--white);border-color:var(--muted);}

/* ---- HERO CTA ---- */
.hero-cta{
background:linear-gradient(135deg,var(--lime),var(--gold-light));
color:#15130a;
font-weight:800;
font-size:1.05rem;
border:none;
border-radius:999px;
padding:15px 34px;
cursor:pointer;
box-shadow:0 10px 30px rgba(212,255,79,.25);
transition:.25s;
}
.hero-cta:hover{transform:translateY(-2px);box-shadow:0 14px 38px rgba(212,255,79,.4);}

/* ---- HOW IT WORKS / CONVINCE ---- */
.how-section{
max-width:1100px;
margin:8px auto 28px;
padding:24px;
background:linear-gradient(160deg,var(--panel),var(--panel-soft));
border:1px solid var(--line);
border-radius:22px;
}
.how-title{
text-align:center;
font-size:1.5rem;
color:var(--gold-light);
margin-bottom:6px;
}
.how-sub{
text-align:center;
color:var(--muted);
font-size:.9rem;
margin-bottom:24px;
}
.how-steps{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin-bottom:24px;
}
.how-step{
text-align:center;
padding:20px 16px;
background:var(--panel);
border:1px solid var(--line);
border-radius:18px;
position:relative;
}
.how-step .step-num{
width:34px;height:34px;
margin:0 auto 12px;
border-radius:50%;
background:linear-gradient(135deg,var(--gold-light),var(--lime));
color:#15130a;
font-weight:800;
display:flex;align-items:center;justify-content:center;
}
.how-step .step-ico{font-size:1.8rem;display:block;margin-bottom:8px;}
.how-step h4{color:var(--white);font-size:1rem;margin-bottom:6px;}
.how-step p{color:var(--muted);font-size:.84rem;line-height:1.5;}
.how-reassure{
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:center;
}
.how-pill{
display:inline-flex;align-items:center;gap:6px;
background:rgba(212,255,79,.06);
border:1px solid var(--line);
color:var(--muted);
font-size:.82rem;
padding:8px 14px;
border-radius:999px;
}
.how-pill b{color:var(--lime);font-weight:700;}
@media(max-width:640px){
.how-steps{grid-template-columns:1fr;}
}

/* ---- SOCIAL PROOF COUNTERS ---- */
.proof-strip{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
max-width:1000px;
margin:0 auto 34px;
}
.proof-card{
background:linear-gradient(160deg,var(--panel),var(--panel-soft));
border:1px solid var(--line);
border-radius:20px;
padding:24px 18px;
text-align:center;
}
.proof-num{
font-family:var(--display);
font-size:2rem;
background:linear-gradient(135deg,var(--gold-light),var(--lime));
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
display:block;
}
.proof-label{color:var(--muted);font-size:.84rem;margin-top:6px;display:block;}

/* ---- SECTION TITLE (membership sub) ---- */
.mem-block-title{
text-align:center;
font-size:1.6rem;
color:var(--gold-light);
margin:48px 0 22px;
}

/* ---- REVIEWS ---- */
.reviews-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:16px;
max-width:1000px;
margin:0 auto;
}
.review-card{
background:var(--panel);
border:1px solid var(--line);
border-radius:18px;
padding:20px;
}
.review-stars{color:var(--gold-light);font-size:.95rem;letter-spacing:2px;margin-bottom:10px;}
.review-text{color:var(--white);font-size:.92rem;line-height:1.55;margin-bottom:14px;}
.review-author{display:flex;align-items:center;gap:10px;}
.review-avatar{
width:38px;height:38px;border-radius:50%;
background:linear-gradient(135deg,var(--gold),var(--lime));
color:#15130a;font-weight:800;display:flex;align-items:center;justify-content:center;
font-size:.95rem;
}
.review-meta strong{color:var(--white);font-size:.86rem;display:block;}
.review-meta small{color:var(--muted);font-size:.76rem;}

/* ---- MEMBERSHIP BADGES ---- */
.badge-row{
display:flex;
gap:12px;
flex-wrap:wrap;
justify-content:center;
max-width:900px;
margin:0 auto;
}
.tier-badge{
display:flex;align-items:center;gap:8px;
padding:10px 18px;border-radius:999px;
font-weight:700;font-size:.9rem;
border:1px solid var(--line);
background:var(--panel);
}
.tier-badge .dot{font-size:1.1rem;}
.tier-badge.silver{color:#cfd3da;border-color:#cfd3da55;}
.tier-badge.gold{color:#f4b73f;border-color:#f4b73f66;}
.tier-badge.pro{color:#d4ff4f;border-color:#d4ff4f66;}
.tier-badge.elite{
color:#15130a;
background:linear-gradient(135deg,var(--gold-light),var(--lime));
border-color:transparent;
}

/* ---- RENEWAL REWARDS ---- */
.renew-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:14px;
max-width:900px;
margin:0 auto;
}
.renew-card{
background:var(--panel);
border:1px dashed var(--line);
border-radius:16px;
padding:18px;
text-align:center;
}
.renew-card .plan{color:var(--muted);font-size:.82rem;}
.renew-card .bonus{
font-family:var(--display);
font-size:1.4rem;
color:var(--lime);
display:block;
margin-top:6px;
}
.renew-card small{color:var(--muted);font-size:.74rem;}

/* ---- LEADERBOARD ---- */
.leaderboard{
max-width:560px;
margin:0 auto;
background:var(--panel);
border:1px solid var(--line);
border-radius:20px;
overflow:hidden;
}
.lb-row{
display:flex;align-items:center;gap:14px;
padding:14px 20px;
border-bottom:1px solid var(--line);
}
.lb-row:last-child{border-bottom:none;}
.lb-rank{
width:30px;height:30px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-weight:800;font-size:.85rem;
background:var(--panel-soft);color:var(--muted);
}
.lb-row:nth-child(1) .lb-rank{background:linear-gradient(135deg,#f4b73f,#ffd97a);color:#15130a;}
.lb-row:nth-child(2) .lb-rank{background:#cfd3da;color:#15130a;}
.lb-row:nth-child(3) .lb-rank{background:#cd7f4d;color:#15130a;}
.lb-name{flex:1;color:var(--white);font-weight:600;font-size:.92rem;}
.lb-earn{color:var(--lime);font-weight:700;font-size:.92rem;}

@media(max-width:640px){
.proof-strip{grid-template-columns:1fr;}
}

/* ---- TRUST STRIP ---- */
.trust-strip{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:14px;
max-width:1100px;
margin:0 auto 28px;
}
.trust-item{
display:flex;
gap:12px;
align-items:center;
background:var(--panel);
border:1px solid var(--line);
border-radius:16px;
padding:14px 16px;
}
.trust-ico{font-size:1.5rem;line-height:1;}
.trust-item strong{display:block;font-size:.92rem;color:var(--white);}
.trust-item small{color:var(--muted);font-size:.74rem;}

.clarity-note{
max-width:760px;
margin:0 auto 38px;
text-align:center;
color:var(--muted);
font-size:.98rem;
line-height:1.6;
background:rgba(212,255,79,.05);
border:1px solid var(--line);
border-radius:16px;
padding:16px 20px;
}
.clarity-note strong{color:var(--lime);}

/* ---- CALCULATOR ---- */
.calc-card{
max-width:880px;
margin:0 auto 50px;
background:var(--panel);
border:1px solid var(--line);
border-radius:24px;
padding:28px;
}
.calc-head h3{font-size:1.5rem;color:var(--gold-light);}
.calc-head p{color:var(--muted);font-size:.88rem;margin:6px 0 22px;}
.calc-row{margin-bottom:20px;}
.calc-row label{
display:flex;justify-content:space-between;align-items:center;
color:var(--white);font-size:.9rem;margin-bottom:10px;font-weight:600;
}
.calc-row label b{color:var(--lime);font-size:1rem;}
.calc-row input[type=range]{
width:100%;height:6px;border-radius:999px;-webkit-appearance:none;
background:var(--panel-soft);outline:none;cursor:pointer;
}
.calc-row input[type=range]::-webkit-slider-thumb{
-webkit-appearance:none;width:22px;height:22px;border-radius:50%;
background:linear-gradient(135deg,var(--gold-light),var(--gold));
border:2px solid #0b0b0b;cursor:pointer;
}
.calc-row input[type=range]::-moz-range-thumb{
width:22px;height:22px;border-radius:50%;
background:var(--gold);border:2px solid #0b0b0b;cursor:pointer;
}
.calc-plans{display:flex;gap:8px;flex-wrap:wrap;}
.calc-plan{
flex:1;min-width:70px;padding:10px;border-radius:12px;
background:var(--panel-soft);border:1px solid var(--line);
color:var(--muted);font-weight:700;cursor:pointer;transition:.25s;
}
.calc-plan.active{
background:linear-gradient(135deg,var(--gold-light),var(--gold));
color:#15130a;border-color:transparent;
}
.calc-result{
display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
margin-top:24px;
}
.calc-stat{
background:var(--panel-soft);border:1px solid var(--line);
border-radius:16px;padding:16px;text-align:center;
}
.calc-stat small{display:block;color:var(--muted);font-size:.76rem;margin-bottom:6px;}
.calc-stat strong{font-size:1.4rem;color:var(--white);font-family:var(--display);}
.calc-stat.highlight{
background:linear-gradient(135deg,rgba(212,255,79,.14),rgba(244,183,63,.10));
border-color:var(--lime);
}
.calc-stat.highlight strong{color:var(--lime);}
.calc-break{
margin-top:18px;text-align:center;color:var(--muted);
font-size:.86rem;line-height:1.5;
}

/* ---- BEST BADGE ---- */
.best-card{position:relative;border-color:var(--lime)!important;overflow:visible;}
.best-badge{
position:absolute;top:-12px;left:50%;transform:translateX(-50%);
background:linear-gradient(135deg,var(--lime),var(--gold-light));
color:#15130a;font-size:.72rem;font-weight:800;letter-spacing:.06em;
padding:5px 14px;border-radius:999px;white-space:nowrap;
}
.plan-tag{
color:var(--muted);font-size:.72rem;letter-spacing:.16em;
text-transform:uppercase;margin-bottom:14px;
}
.price .per{
font-size:1rem;
font-weight:600;
color:var(--muted);
-webkit-text-fill-color:var(--muted);
letter-spacing:0;
}
.plan-card ul li{margin-bottom:8px;font-size:.9rem;line-height:1.45;}
.plan-card ul li b{color:var(--lime);}

/* ---- POLICIES PAGE ---- */
.policies-wrap{
max-width:900px;
margin:0 auto;
padding:0 16px;
}
.policies-head{text-align:center;margin-bottom:28px;}
.policies-head h2{
font-size:2rem;
background:linear-gradient(135deg,var(--gold-light),var(--lime));
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.policies-head p{color:var(--muted);font-size:.92rem;margin-top:6px;}
.policy-tabs{
display:flex;
flex-wrap:wrap;
gap:8px;
justify-content:center;
margin-bottom:28px;
}
.policy-tab{
padding:9px 16px;
border-radius:999px;
background:var(--panel);
border:1px solid var(--line);
color:var(--muted);
font-weight:600;
font-size:.85rem;
cursor:pointer;
transition:.2s;
}
.policy-tab:hover{color:var(--white);}
.policy-tab.active{
background:linear-gradient(135deg,var(--gold-light),var(--lime));
color:#15130a;
border-color:transparent;
}
.policy-panel{
display:none;
background:var(--panel);
border:1px solid var(--line);
border-radius:20px;
padding:30px 32px;
animation:polFade .3s ease both;
}
.policy-panel.active{display:block;}
@keyframes polFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.policy-panel h2{
font-size:1.5rem;
color:var(--gold-light);
margin-bottom:6px;
}
.policy-updated{
color:var(--muted);
font-size:.78rem;
margin-bottom:20px;
display:block;
}
.policy-panel h3{
color:var(--white);
font-size:1.05rem;
margin:22px 0 8px;
}
.policy-panel p{
color:var(--muted);
font-size:.9rem;
line-height:1.65;
margin-bottom:12px;
}
.policy-panel ul{
list-style:none;
padding-left:0;
margin-bottom:14px;
}
.policy-panel ul li{
color:var(--muted);
font-size:.9rem;
line-height:1.6;
padding-left:20px;
position:relative;
margin-bottom:7px;
}
.policy-panel ul li::before{
content:"";
position:absolute;
left:4px;top:9px;
width:6px;height:6px;
border-radius:50%;
background:var(--lime);
}
.policy-panel strong{color:var(--white);}
.policy-panel a{color:var(--gold-light);text-decoration:underline;}
.policy-contact-box{
margin-top:24px;
padding:16px 18px;
background:var(--panel-soft);
border:1px solid var(--line);
border-radius:14px;
font-size:.88rem;
color:var(--muted);
}
.footer-links{
display:flex;
flex-wrap:wrap;
gap:14px;
justify-content:center;
margin:10px 0;
}
.footer-links a{
color:var(--muted);
font-size:.82rem;
text-decoration:none;
cursor:pointer;
transition:.2s;
}
.footer-links a:hover{color:var(--lime);}

/* ---- FAQ ---- */
.mem-faq{
max-width:760px;margin:54px auto 0;
}
.mem-faq h3{
text-align:center;font-size:1.5rem;color:var(--gold-light);margin-bottom:22px;
}
.mem-faq details{
background:var(--panel);border:1px solid var(--line);
border-radius:14px;padding:16px 18px;margin-bottom:12px;cursor:pointer;
}
.mem-faq summary{
font-weight:700;color:var(--white);font-size:.95rem;list-style:none;
display:flex;justify-content:space-between;align-items:center;
}
.mem-faq summary::after{content:"+";color:var(--lime);font-size:1.3rem;}
.mem-faq details[open] summary::after{content:"\2212";}
.mem-faq details p{color:var(--muted);font-size:.88rem;line-height:1.55;margin-top:12px;}

@media(max-width:760px){
.trust-strip{grid-template-columns:repeat(2,1fr);}
.calc-result{grid-template-columns:1fr;}
}

.plan-card{
background:var(--panel);
border:1px solid var(--line);
border-radius:24px;
transition:.35s;
}

.plan-card:hover{
border-color:var(--lime);
transform:translateY(-6px);
box-shadow:0 24px 50px rgba(212,255,79,.10);
}

.price{
font-size:2.7rem;
color:var(--gold-light);
margin-bottom:18px;
font-weight:800;
}

.plan-card ul{
padding-left:18px;
}

.join-btn{
width:100%;
margin-top:24px;
padding:15px;
background:linear-gradient(135deg, var(--gold-light), var(--gold));
color:#15130a;
border:none;
border-radius:999px;
font-weight:800;
letter-spacing:.12em;
cursor:pointer;
position:relative;
overflow:hidden;
transition:.3s;
touch-action:manipulation;
}

.join-btn span{
position:relative;
z-index:1;
}

.join-btn:hover{
transform:translateY(-3px) scale(1.02);
background:linear-gradient(135deg, var(--lime), var(--gold-light));
box-shadow:0 14px 30px rgba(212,255,79,.22);
}

footer{
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
padding:32px 24px;
border-top:1px solid var(--line);
}
.footer-links-row{display:flex;align-items:center;gap:24px;}
.footer-policies,
footer .footer-contact{color:var(--gold);font-size:.9rem;text-decoration:none;cursor:pointer;transition:.2s;}
.footer-policies:hover,
footer .footer-contact:hover{color:var(--lime);}
footer .footer-copy{text-align:center;color:var(--muted);font-size:.78rem;}

.footer-logo{
color:var(--white);
font-weight:800;
letter-spacing:.04em;
}

.footer-logo::after{
content:"";
display:inline-block;
width:7px;
height:7px;
margin-left:7px;
border-radius:50%;
background:var(--lime);
box-shadow:0 0 10px var(--lime);
vertical-align:middle;
}

.footer-copy{
font-size:.78rem;
color:var(--muted);
}

.form-note a,
.footer-contact{
color:var(--lime);
text-decoration:none;
}

@media(max-width:768px){
section{
padding:112px 18px 80px;
}

.hero-actions{
flex-direction:column;
}

.login-box{
padding:34px 22px;
}

.store-section,
.category-page,
.cart-section,
.checkout-section{
padding:104px 14px 42px;
}

.shop-shell{
gap:16px;
}

.search input{
height:44px;
padding-right:96px;
}

.shop-hero{
min-height:auto;
padding:14px 14px;
grid-template-columns:1fr;
align-items:flex-start;
}

.shop-hero-copy h2{
font-size:1.4rem;
}

.shop-visual-grid{
width:100%;
grid-template-columns:repeat(2,minmax(0,1fr));
}

.visual-tile{
min-height:64px;
font-size:2rem;
}

.product-strip,
.category-products{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
}

.product-actions,
.checkout-form{
grid-template-columns:1fr;
}

.cart-grid,
.checkout-grid{
grid-template-columns:1fr;
}

.cart-item{
grid-template-columns:64px minmax(0,1fr);
align-items:start;
}

.cart-item-image{
width:64px;
height:64px;
}

.qty-control{
grid-column:1 / -1;
justify-content:flex-start;
}

.suggestion-grid{
grid-template-columns:1fr;
}

.wallet-summary{
grid-template-columns:1fr;
}

.wallet-row{
grid-template-columns:1fr;
gap:6px;
}

.product-image,
.subcategory-icon{
height:110px;
font-size:3rem;
}

.category-hero{
grid-template-columns:1fr;
align-items:flex-start;
padding:26px 20px;
}

.band-heading{
align-items:flex-start;
flex-direction:column;
}

.page-back-btn{
left:14px;
top:120px;
right:auto;
bottom:auto;
width:40px;
height:40px;
font-size:1.2rem;
z-index:130;
}

.floating-cart{
right:14px;
bottom:14px;
min-height:46px;
padding:0 13px;
font-size:.82rem;
}

.status-grid{
grid-template-columns:repeat(2,1fr);
}

.membership-grid{
gap:16px;
}

footer{
flex-direction:column;
text-align:center;
padding:30px 18px;
}
}

/* ===== AMAZON-STYLE MOBILE NAV + DRAWER ===== */

nav{
flex-direction:column;
align-items:stretch;
gap:10px;
padding:10px 16px 12px;
}

.nav-row-1{
display:flex;
align-items:center;
gap:8px;
}

.nav-row-1 .nav-cta,
.nav-row-1 .nav-icon-btn{
height:34px;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:0;
}

.nav-row-1 .category-card:hover,
.nav-row-1 .category-card.active-category{
transform:none !important;
box-shadow:none;
}

.nav-logo{
flex-shrink:0;
}

.menu-toggle{
display:flex !important;
align-items:center;
justify-content:center;
width:42px;
height:42px;
border-radius:12px;
border:1px solid var(--line);
background:var(--panel);
cursor:pointer;
flex-shrink:0;
}

.menu-toggle .hamburger-lines{
width:20px;
}

.menu-toggle .hamburger-lines span{
background:var(--gold-light);
}

.menu-toggle:hover{
border-color:var(--lime);
}

.nav-row-2{
display:flex;
}

.nav-search{
flex:1;
min-width:0;
position:relative;
}

.nav-search input{
height:44px;
width:100%;
margin:0;
border-radius:10px;
background:#fff;
color:#111827;
border:0;
padding:0 54px 0 16px;
font-size:.88rem;
}

.nav-search input::placeholder{
color:#94a3b8;
}

.nav-search::after{
content:"\1F50D";
position:absolute;
right:0;
top:0;
bottom:0;
width:46px;
display:flex;
align-items:center;
justify-content:center;
background:linear-gradient(135deg, var(--gold-light), var(--gold));
color:#15130a;
border-radius:0 10px 10px 0;
font-size:1.1rem;
pointer-events:none;
}

.nav-cta{
flex-shrink:0;
margin-left:10px;
}

.nav-icon-btn{
display:inline-flex;
width:auto;
min-height:auto;
align-items:center;
justify-content:center;
height:auto;
padding:10px 14px;
border-radius:999px;
background:transparent;
border:1px solid var(--gold);
color:var(--gold-light);
cursor:pointer;
flex-shrink:0;
flex-grow:0;
font-weight:700;
opacity:1;
transition:.3s;
}

.nav-icon-btn .lbl{
font-size:.74rem;
letter-spacing:.18em;
text-transform:uppercase;
font-weight:700;
white-space:nowrap;
}

.nav-icon-btn:hover{
background:var(--gold);
color:#0a0a0f;
box-shadow:0 0 24px rgba(244,183,63,.45);
}

/* Drawer overlay */
.drawer-overlay{
position:fixed;
inset:0;
z-index:190;
background:rgba(8,8,12,.6);
backdrop-filter:blur(2px);
opacity:0;
pointer-events:none;
transition:opacity .3s ease;
}

.drawer-overlay.open{
opacity:1;
pointer-events:auto;
}

/* Drawer panel - slide in from right */
.category-menu{
position:fixed;
top:0;
left:0;
height:100vh;
height:100dvh;
width:min(330px, 88vw);
max-width:none;
background:#fff;
border-right:1px solid #e6e6e6;
box-shadow:18px 0 50px rgba(0,0,0,.5);
z-index:200;
transform:translateX(-100%);
transition:transform .35s cubic-bezier(.25,1,.5,1);
overflow:hidden;
padding:0;
}

.category-menu.open{
transform:translateX(0);
}

.category-menu-inner{
height:100%;
overflow-y:auto;
padding:0;
background:#fff;
}

.drawer-head{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:0;
padding:15px 18px;
background:var(--panel);
position:sticky;
top:0;
z-index:2;
}

.drawer-close{
width:36px;
height:36px;
border-radius:10px;
border:1px solid var(--line);
background:transparent;
color:var(--white);
font-size:1rem;
cursor:pointer;
}

.drawer-close:hover{
border-color:var(--lime);
color:var(--lime);
}

/* Section headings ("Shop Category", "Earn Category") as distinct gold boxes so
   they clearly stand apart from the category rows below them. */
.category-menu .menu-label{
display:block;
color:#15130a;
background:linear-gradient(90deg,#ffe9a3,#ffd75e);
letter-spacing:.02em;
text-transform:none;
font-size:.95rem;
font-weight:800;
margin:14px 12px 10px;
padding:11px 14px;
border-top:0;
border-radius:10px;
box-shadow:0 3px 10px rgba(244,183,63,.28);
}

.category-menu .categories{
display:flex;
flex-direction:column;
grid-template-columns:none;
gap:0;
padding:0;
background:transparent;
box-shadow:none;
border-radius:0;
}

.category-menu .category-card{
display:flex;
flex-direction:row;
align-items:center;
justify-content:flex-start;
gap:14px;
width:100%;
min-height:0;
padding:13px 18px;
background:#fff;
border:0;
border-bottom:1px solid #f1f1f1;
border-radius:0;
color:#0f1111;
text-align:left;
transition:background .15s;
}

.category-menu .category-card .icon{
font-size:1.3rem;
width:26px;
text-align:center;
flex-shrink:0;
margin:0;
}

.category-menu .category-card h3{
color:#0f1111;
font-size:.95rem;
font-weight:500;
margin:0;
}

.category-menu .category-card:hover{
border-color:#f1f1f1;
background:#f3f4f5;
box-shadow:none;
transform:none;
}

.category-menu .category-card.active-category{
background:#fff7e6;
box-shadow:inset 3px 0 0 var(--gold);
transform:none;
}

.drawer-links{
display:flex;
flex-direction:column;
gap:0;
}

.drawer-links a{
display:flex;
align-items:center;
gap:14px;
padding:13px 18px;
color:#0f1111;
text-decoration:none;
font-size:.95rem;
font-weight:500;
border-bottom:1px solid #f1f1f1;
transition:background .15s;
}

.drawer-links a:hover{
color:#0f1111;
background:#f3f4f5;
padding-left:18px;
}

.drawer-links a .dl-ico{flex-shrink:0;}
/* Leading icon box for drawer links — same width/spacing as the category cards'
   .icon, so Store / Wishlist / My Orders align like Stationary, Photo Frames... */
.drawer-links a .dl-ico-e{width:26px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;line-height:1;}

/* Account block (Contact / Login) sits in its own grey-separated section */
.category-menu .drawer-links + .drawer-links{
border-top:9px solid #eef0f1;
}

@media(min-width:769px){
nav{
padding:14px 56px 16px;
}

.nav-row-2{
max-width:760px;
margin:0 auto;
width:100%;
}
}

@media(max-width:768px){
nav{
padding:10px 12px 12px;
gap:8px;
}

.nav-logo{
font-size:1.05rem;
}

.nav-cta{
padding:9px 14px;
font-size:.62rem;
}
}

.store-section{
padding-top:16px;
}

.cart-section,
.checkout-section,
.category-page{
padding-top:16px;
}

section{
padding-top:16px;
}

.hero{
padding-top:0;
}

@media(max-width:768px){
.store-section{
padding-top:12px;
}

.cart-section,
.checkout-section,
.category-page{
padding-top:12px;
}

section{
padding-top:12px;
}

.hero{
padding-top:0;
}
}
/* ===== INDIVIDUAL MEMBERSHIP WALLET ===== */
.wallet-state{max-width:1240px;margin:0 auto;}

.wallet-locked{
background:#fff;
border:1px dashed rgba(15,23,42,.18);
border-radius:12px;
padding:42px 24px;
text-align:center;
color:#475569;
}
.wallet-locked h3{color:#172337;font-size:1.3rem;margin-bottom:8px;}
.wallet-locked p{margin-bottom:18px;font-size:.92rem;}
.wallet-locked button{
border:0;border-radius:8px;padding:12px 26px;
font-weight:800;cursor:pointer;background:#172337;color:#fff;
}
.wallet-locked button:hover{background:#0f172a;}

.member-card{
position:relative;
border-radius:16px;
padding:24px;
color:#fff;
overflow:hidden;
box-shadow:0 18px 40px rgba(15,23,42,.18);
margin-bottom:16px;
}
.member-card::after{
content:"";position:absolute;right:-50px;top:-50px;
width:190px;height:190px;border-radius:50%;
background:rgba(255,255,255,.12);
}
.member-card > *{position:relative;z-index:1;}
.member-card .mc-tier{
font-size:.72rem;font-weight:800;letter-spacing:.18em;
text-transform:uppercase;opacity:.85;
}
.member-card .mc-name{font-size:1.8rem;font-weight:900;margin:6px 0 2px;line-height:1.05;}
.member-card .mc-sub{font-size:.86rem;opacity:.85;}
.member-card .mc-foot{
display:flex;flex-direction:column;gap:14px;
margin-top:22px;
}
.member-card .mc-dates{display:flex;gap:18px;}
.member-card .mc-dates > .mc-cell{flex:1;}
.member-card .mc-foot small{
display:block;font-size:.64rem;letter-spacing:.1em;
text-transform:uppercase;opacity:.8;margin-bottom:3px;
}
.member-card .mc-foot b{font-size:1.02rem;font-weight:800;}
.member-card .mc-includes{margin-top:14px;font-size:.74rem;font-weight:700;background:rgba(0,0,0,.16);display:inline-block;padding:6px 12px;border-radius:999px;}

.member-card.tier-silver{background:linear-gradient(135deg,#6b7280,#aeb7c4);}
.member-card.tier-gold{background:linear-gradient(135deg,#b8893a,#f4cd6a);color:#2a2008;}
.member-card.tier-gold .mc-tier,
.member-card.tier-gold .mc-sub,
.member-card.tier-gold .mc-foot small{opacity:.72;}
.member-card.tier-pro{background:linear-gradient(135deg,#2f6b22,#7bc043);}
.member-card.tier-elite{background:linear-gradient(135deg,#15130a,#3a2f12 55%,#a9842f);}
.member-card.tier-elite .mc-name{
background:linear-gradient(135deg,#ffe3a3,#d4ff4f);
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

.wallet-grid-accent .wallet-stat{border-top:3px solid var(--wallet-accent,#172337);}

/* ===== CHECKOUT PAYMENT METHODS ===== */
.pay-methods{display:grid;gap:8px;margin-top:4px;}
.pay-title{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#475569;}
.pay-opt{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid rgba(15,23,42,.14);border-radius:8px;cursor:pointer;background:#fff;color:#172337;font-size:.9rem;}
.pay-opt input{width:auto;margin:0;}
.pay-opt:hover{border-color:#2874f0;}
.pay-opt strong{color:#172337;}
.ec-share-btn{width:100%;margin-top:10px;padding:11px;border-radius:10px;border:1.5px dashed #1a7f37;background:#f3fbf5;color:#1a7f37;font-weight:800;font-size:.9rem;cursor:pointer;transition:.15s;}
.ec-share-btn:hover{background:#1a7f37;color:#fff;}
.pay-wallet{border-color:#1a7f37;background:#f3fbf5;}
.pay-wallet #walletAvailLbl{color:#1a7f37;font-weight:700;font-size:.82rem;}
.wallet-split-note{margin:2px 0 0;font-size:.84rem;font-weight:700;color:#1a7f37;}
.pay-opt input:disabled{opacity:.5;}
.pay-opt:has(input:disabled){opacity:.55;cursor:not-allowed;}

/* ===== PROFILE ICON + ACCOUNT PAGE ===== */
.nav-profile{display:inline-flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--gold);color:var(--gold-light);border-radius:999px;padding:5px 12px 5px 5px;cursor:pointer;font-weight:700;flex-shrink:0;}
.nav-profile:hover{background:var(--gold);color:#0a0a0f;}
.nav-avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--lime));color:#15130a;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.8rem;flex-shrink:0;}
.nav-name{font-size:.74rem;letter-spacing:.04em;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.nav-profile:hover .nav-name{color:#0a0a0f;}

.acct-head{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:18px;box-shadow:0 8px 22px rgba(15,23,42,.08);}
.acct-avatar{width:54px;height:54px;border-radius:50%;background:#172337;color:#ffd814;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.4rem;flex-shrink:0;}
.acct-id h2{color:#172337;font-size:1.3rem;line-height:1.1;}
.acct-email{color:#64748b;font-size:.86rem;}
.acct-logout{margin-left:auto;border:0;background:#fb641b;color:#fff;border-radius:8px;padding:10px 18px;font-weight:800;cursor:pointer;}
.acct-logout:hover{background:#e2580f;}
.acct-order{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:8px;padding:14px;margin-bottom:10px;box-shadow:0 6px 16px rgba(15,23,42,.06);}
.acct-order-top{display:flex;justify-content:space-between;gap:10px;color:#172337;font-size:.92rem;}
.acct-order-meta{color:#64748b;font-size:.82rem;margin:5px 0;}
.acct-badge{background:#e8f7ee;color:#13803d;border-radius:4px;padding:2px 8px;font-size:.72rem;font-weight:800;}
.acct-order-total{font-weight:900;color:#111827;}
.acct-address{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:8px;padding:14px;margin-bottom:10px;color:#334155;font-size:.88rem;line-height:1.5;}
.acct-address strong{color:#172337;}

/* ===== REFER & EARN CARD ===== */
.referral-card{background:linear-gradient(135deg,#172337,#2c3e63);color:#fff;border-radius:12px;padding:18px;margin-top:16px;}
.referral-card h3{color:#ffd814;font-size:1.1rem;margin-bottom:6px;}
.referral-card > p{color:rgba(255,255,255,.8);font-size:.84rem;margin-bottom:14px;line-height:1.5;}
.referral-card b{color:#d4ff4f;}
.ref-code-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.ref-code{font-family:var(--display);font-size:1.05rem;font-weight:800;letter-spacing:.1em;background:rgba(255,255,255,.12);padding:9px 14px;border-radius:8px;color:#ffd814;}
.ref-btn{border:0;border-radius:8px;padding:9px 14px;font-weight:800;cursor:pointer;background:#ffce12;color:#172337;}
.ref-btn.share{background:#d4ff4f;}
.ref-btn:hover{opacity:.9;}
.ref-stats{display:flex;gap:28px;margin-top:16px;}
.ref-stats strong{display:block;font-size:1.4rem;color:#fff;font-family:var(--display);line-height:1;}
.ref-stats span{font-size:.74rem;color:rgba(255,255,255,.7);}

/* ===== MOBILE REFINEMENT (compact Amazon-style, no overflow) ===== */
html{overflow-x:hidden;}
img{max-width:100%;}

@media(max-width:768px){
/* nav fits on small screens */
.nav-row-1{gap:6px;}
.nav-name{max-width:74px;}
.nav-profile{padding:4px 9px 4px 4px;}
.nav-icon-btn{padding:8px 11px;}

/* Amazon-style compact product cards (2 per row) */
.ec-grid,.product-strip,.category-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.product-card{padding:8px;border-radius:8px;}
.product-card h3,.ec-clamp2{font-size:.82rem;line-height:1.25;margin-bottom:4px;min-height:2.1em;}
.product-card p{font-size:.72rem;}
.product-price{font-size:.92rem;gap:6px;}
.product-price del{font-size:.7rem;}
.product-offer,.ec-bought{font-size:.68rem;margin-top:2px;}
.product-badge{font-size:.6rem;padding:2px 6px;margin-bottom:6px;}
.rating{font-size:.66rem;padding:2px 6px;margin:5px 0;}
.cart-btn{min-height:34px;font-size:.74rem;margin-top:8px;}
.ec-card .ec-view{display:none;}              /* card tap khud detail kholta hai */
.ec-card .product-actions{grid-template-columns:1fr;}

/* store toolbar + chips scroll (toolbar layout is unified in the base rule) */
.ec-searchbox{max-width:none;}
.ec-chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;-webkit-overflow-scrolling:touch;}
.ec-chip{flex:0 0 auto;}

/* product detail */
.ec-main-img{height:260px;}
.ec-detail-actions .cart-btn{min-width:0;flex:1;}

/* wallet membership card */
.member-card{padding:18px;}
.member-card .mc-name{font-size:1.4rem;}

/* account page */
.acct-head{flex-wrap:wrap;}
.acct-logout{margin-left:0;width:100%;margin-top:6px;}

/* checkout */
.pay-opt{font-size:.84rem;}
}

@media(max-width:380px){
.nav-name{display:none;}                        /* sirf avatar */
.nav-icon-btn .lbl{font-size:.6rem;letter-spacing:.1em;}
.product-image{height:104px;font-size:2.2rem;}
.ec-main-img{height:200px;}
}

/* ===== DYNAMIC STORE + PRODUCT DETAIL ===== */
/* Filter/sort row: "Sort by [Popularity]" + "All Types" on ONE centered line
   at every breakpoint (phone + desktop). Selects shrink to fit ~360px. */
.ec-toolbar{display:flex;gap:8px;flex-wrap:nowrap;align-items:center;justify-content:center;margin-bottom:14px;}
.ec-toolbar .ec-tools-right{order:1;flex:0 1 auto;min-width:0;}
.ec-toolbar .ec-subcat{order:2;}
.ec-chips{display:flex;gap:8px;flex-wrap:wrap;}
.ec-chip{border:1px solid rgba(15,23,42,.14);background:#fff;color:#334155;border-radius:999px;padding:8px 14px;font-size:.8rem;font-weight:700;cursor:pointer;transition:.2s;}
.ec-chip:hover{border-color:#2874f0;}
.ec-chip.active{background:#172337;color:#ffd814;border-color:#172337;}
.ec-searchbox{flex:1;min-width:200px;max-width:340px;}
.ec-searchbox input{height:42px;width:100%;margin:0;border-radius:8px;background:#fff;color:#111827;border:1px solid rgba(15,23,42,.14);padding:0 14px;}
.ec-grid .product-card{cursor:pointer;}

/* Pagination */
.ec-pager{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:6px;margin:18px 0 4px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.ec-pager::-webkit-scrollbar{display:none;}
.ec-page{flex:0 0 auto;}
.ec-pager:empty{display:none;}
.ec-page{min-width:36px;height:36px;padding:0 10px;border:1px solid rgba(15,23,42,.16);background:#fff;color:#172337;border-radius:8px;font-size:.86rem;font-weight:700;cursor:pointer;transition:.15s;}
.ec-page:hover:not(:disabled):not(.active){border-color:#2874f0;color:#2874f0;}
.ec-page.active{background:#172337;color:#ffd814;border-color:#172337;cursor:default;}
.ec-page:disabled{opacity:.4;cursor:not-allowed;}
.ec-page-gap{padding:0 4px;color:#94a3b8;}
.ec-clamp2{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em;}
.ec-bought{display:block;margin-top:4px;color:#64748b;font-size:.74rem;font-weight:700;}

.ec-back{border:0;background:#172337;color:#fff;border-radius:8px;padding:10px 18px;font-weight:800;cursor:pointer;margin-bottom:14px;}
.ec-back:hover{background:#0f172a;}

.ec-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;}
.ec-gallery{display:grid;gap:10px;align-content:start;}
.ec-main-img{height:380px;border-radius:10px;background:#f3f6fb;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:5rem;}
.ec-main-img img{width:100%;height:100%;object-fit:contain;}
.ec-thumbs{display:flex;gap:8px;flex-wrap:wrap;}
.ec-thumb{width:60px;height:60px;border-radius:8px;border:2px solid transparent;background:#f3f6fb;cursor:pointer;overflow:hidden;}
.ec-thumb img{width:100%;height:100%;object-fit:contain;}
.ec-thumb.active{border-color:#2874f0;}
.ec-info h2{font-size:1.5rem;color:#172337;line-height:1.2;margin-bottom:8px;}
.ec-rating-line{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;color:#64748b;}
.ec-rating-badge{background:#16a34a;color:#fff;border-radius:4px;padding:3px 8px;font-size:.8rem;font-weight:800;}
.ec-price-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:10px 0;}
.ec-price{font-size:1.8rem;font-weight:900;color:#111827;}
.ec-mrp{color:#94a3b8;text-decoration:line-through;}
.ec-disc{color:#16a34a;font-weight:800;}
.ec-save{color:#16a34a;font-weight:700;font-size:.9rem;margin-bottom:14px;}
.ec-opt-label{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#475569;margin:14px 0 8px;}
.ec-sizes{display:flex;gap:8px;flex-wrap:wrap;}
.ec-size{min-width:42px;padding:8px 12px;border:1px solid rgba(15,23,42,.18);border-radius:6px;background:#fff;cursor:pointer;font-weight:700;color:#172337;}
.ec-size.active{border-color:#172337;background:#172337;color:#fff;}
.ec-colors{display:flex;gap:10px;flex-wrap:wrap;}
.ec-color{width:30px;height:30px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(15,23,42,.25);cursor:pointer;}
.ec-color.active{box-shadow:0 0 0 2px #2874f0;}
.ec-detail-actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap;}
.ec-detail-actions .cart-btn{margin-top:0;min-width:150px;}

.ec-section-title{font-size:1.2rem;color:#172337;font-weight:900;margin:28px 0 14px;}
.ec-reviews-summary{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-bottom:16px;}
.ec-avg{text-align:center;}
.ec-avg strong{font-size:2.4rem;color:#172337;font-family:var(--display);display:block;line-height:1;}
.ec-avg-count{display:block;font-size:.72rem;color:#94a3b8;margin-top:4px;}
.ec-bars{flex:1;min-width:220px;display:grid;gap:6px;}
.ec-bar-row{display:flex;align-items:center;gap:8px;font-size:.78rem;color:#475569;}
.ec-bar{flex:1;height:8px;border-radius:999px;background:#e5e9f0;overflow:hidden;}
.ec-bar span{display:block;height:100%;background:#16a34a;}
.ec-review{border:1px solid rgba(15,23,42,.08);border-radius:8px;padding:14px;margin-bottom:10px;background:#fff;}
.ec-review-head{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.ec-avatar{width:36px;height:36px;border-radius:50%;background:#172337;color:#ffd814;display:flex;align-items:center;justify-content:center;font-weight:800;}
.ec-review-meta strong{display:block;color:#172337;font-size:.9rem;}
.ec-review-meta small{color:#64748b;font-size:.74rem;}
.ec-review-stars{color:#16a34a;font-size:.82rem;font-weight:800;}
.ec-review p{color:#334155;font-size:.88rem;line-height:1.5;margin-top:4px;}

@media(max-width:768px){
.ec-detail{grid-template-columns:1fr;}
.ec-main-img{height:300px;}
}

/* ============================================================
   WALLET BALANCE CARDS · TRANSACTION TIMELINE
   ============================================================ */
.wallet-balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:18px 0 8px;}
.wallet-bal-card.share-card{border-top-color:#1a7f37;}
.wallet-bal-card .share-warn{display:block;font-size:.72rem;color:#b45309;background:#fff8e6;border:1px solid #f3d27a;border-radius:8px;padding:7px 9px;margin-top:8px;line-height:1.35;}
.wallet-bal-card{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;padding:18px;box-shadow:0 6px 16px rgba(15,23,42,.06);border-top:3px solid var(--wallet-accent,#172337);}
.wallet-bal-card span{display:block;font-size:.78rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.04em;}
.wallet-bal-card strong{display:block;font-family:var(--display);font-size:1.7rem;font-weight:900;color:#111827;margin-top:6px;line-height:1;}
.wallet-bal-card small{display:block;font-size:.74rem;color:#94a3b8;margin-top:6px;}
.wallet-bal-card.primary{background:linear-gradient(135deg,#172337,#2c3e63);border-top-color:#ffce12;}
.wallet-bal-card.primary span{color:rgba(255,255,255,.72);}
.wallet-bal-card.primary strong{color:#fff;}
.wallet-withdraw-btn{margin-top:12px;border:0;border-radius:8px;background:#ffce12;color:#172337;font-weight:800;padding:10px 18px;cursor:pointer;width:100%;}
.wallet-withdraw-btn:hover{background:#ffd84a;}

.wallet-txns-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:22px;flex-wrap:wrap;}
.wallet-txns-hint{font-size:.78rem;color:#64748b;}
.wallet-timeline{display:flex;flex-direction:column;gap:8px;}
.wt-item{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:13px 16px;}
.wt-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1rem;flex-shrink:0;}
.wt-credit .wt-icon{background:#e8f7ee;color:#13803d;}
.wt-debit .wt-icon{background:#fdecec;color:#d23b3b;}
.wt-mid{flex:1;min-width:0;}
.wt-mid strong{display:block;color:#172337;font-size:.92rem;text-transform:capitalize;}
.wt-mid small{display:block;color:#94a3b8;font-size:.76rem;}
.wt-right{text-align:right;flex-shrink:0;}
.wt-amt{font-family:var(--display);font-weight:900;font-size:1rem;}
.wt-credit .wt-amt{color:#13803d;}
.wt-debit .wt-amt{color:#d23b3b;}
.wt-right small{display:block;color:#94a3b8;font-size:.74rem;}

/* ============================================================
   ACCOUNT: section heads, inline forms, address & phone cards
   ============================================================ */
.acct-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:24px;}
.acct-add-btn{border:1px solid #2874f0;background:#fff;color:#2874f0;border-radius:8px;padding:8px 14px;font-weight:800;cursor:pointer;font-size:.84rem;}
.acct-add-btn:hover{background:#2874f0;color:#fff;}
.acct-inline-form{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:10px;padding:16px;display:grid;gap:10px;margin:12px 0;box-shadow:0 6px 16px rgba(15,23,42,.06);}
.acct-inline-form input,.acct-inline-form select{width:100%;padding:11px 12px;border:1px solid rgba(15,23,42,.18);border-radius:8px;font-size:.9rem;color:#172337;background:#fff;}
.acct-inline-form input:focus,.acct-inline-form select:focus{outline:none;border-color:#2874f0;}
.acct-check{display:flex;align-items:center;gap:8px;font-size:.84rem;color:#475569;}
.acct-check input{width:auto;}
.acct-form-actions{display:flex;gap:10px;flex-wrap:wrap;}
.acct-save-btn{border:0;background:#fb641b;color:#fff;border-radius:8px;padding:11px 22px;font-weight:800;cursor:pointer;}
.acct-save-btn:hover{background:#e2580f;}
.acct-save-btn:disabled{opacity:.55;cursor:not-allowed;}
.acct-cancel-btn{border:1px solid rgba(15,23,42,.2);background:#fff;color:#475569;border-radius:8px;padding:11px 18px;font-weight:700;cursor:pointer;}
.acct-form-status{font-size:.82rem;color:#64748b;margin:0;}
.acct-form-status.error{color:#d23b3b;}
.acct-form-status.success{color:#13803d;}

.acct-addr-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px;}
.acct-addr-label{background:#eef2f7;color:#475569;border-radius:4px;padding:2px 8px;font-size:.7rem;font-weight:800;text-transform:uppercase;}
.acct-addr-default{background:#e8f7ee;color:#13803d;border-radius:4px;padding:2px 8px;font-size:.7rem;font-weight:800;}
.acct-address.is-default{border-color:#13803d;}
.acct-addr-body{color:#475569;}
.acct-link-btn{margin-top:8px;border:0;background:none;color:#2874f0;font-weight:800;cursor:pointer;padding:0;font-size:.82rem;}
.acct-link-btn:hover{text-decoration:underline;}
.acct-phone{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:8px;padding:12px 14px;margin-bottom:8px;}
.acct-phone.is-default{border-color:#13803d;}
.acct-phone-num{font-weight:800;color:#172337;font-size:.95rem;}
.acct-phone .acct-link-btn{margin:0 0 0 auto;}
.acct-phone .acct-addr-default{margin-left:auto;}
.acct-quick-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px;}

/* ===== ADDRESS BOOK (compact, professional, Flipkart-style) ===== */
.addr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:6px;}
.addr-card{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:15px;box-shadow:0 4px 14px rgba(15,23,42,.05);position:relative;}
.addr-card.is-default{border-color:#13803d;box-shadow:0 4px 16px rgba(19,128,61,.12);}
.addr-card-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:7px;}
.addr-name{font-weight:800;color:#172337;font-size:.95rem;}
.addr-card-phone{color:#334155;font-size:.84rem;margin-bottom:4px;}
.addr-card-phone .addr-alt{color:#94a3b8;}
.addr-card-line{color:#64748b;font-size:.83rem;line-height:1.45;}
.addr-add-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:118px;background:#f8fafc;border:2px dashed #b9c6d6;border-radius:12px;color:#2874f0;font-weight:800;font-size:.9rem;cursor:pointer;transition:.2s;}
.addr-add-tile:hover{background:#eef4ff;border-color:#2874f0;}
.addr-add-plus{font-size:2rem;line-height:1;font-weight:400;}
.loc-btn{display:inline-flex;align-items:center;gap:6px;background:#eef4ff;border:1px solid #2874f0;color:#2874f0;border-radius:8px;padding:10px 14px;font-weight:800;font-size:.85rem;cursor:pointer;margin-bottom:12px;}
.loc-btn:hover{background:#2874f0;color:#fff;}
.loc-btn:disabled{opacity:.6;cursor:wait;}

.addr-form{background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:12px;padding:18px;margin-top:14px;box-shadow:0 8px 22px rgba(15,23,42,.08);}
.addr-form-title{color:#172337;font-size:1.02rem;font-weight:800;margin-bottom:14px;}
.addr-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.addr-form-grid input{width:100%;padding:12px;margin:0;background:#fff;border:1px solid rgba(15,23,42,.18);border-radius:8px;color:#172337;-webkit-text-fill-color:#172337;font-size:.9rem;}
.addr-form-grid input:focus{outline:none;border-color:#2874f0;box-shadow:none;}
.addr-form-grid input.addr-wide{grid-column:1 / -1;}
.addr-form .acct-check{margin:12px 0;}

@media(max-width:560px){.addr-form-grid{grid-template-columns:1fr;}}

/* ============================================================
   WITHDRAW PAGE
   ============================================================ */
.withdraw-wrap{max-width:760px;}
.withdraw-intro{color:#475569;font-size:.9rem;line-height:1.5;margin-bottom:14px;}
.withdraw-balance-card{background:linear-gradient(135deg,#172337,#2c3e63);color:#fff;border-radius:12px;padding:20px;margin-bottom:18px;}
.withdraw-balance-card span{font-size:.8rem;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.05em;}
.withdraw-balance-card strong{display:block;font-family:var(--display);font-size:2rem;font-weight:900;margin-top:4px;}
.withdraw-balance-card small{color:#ffce12;font-size:.78rem;}

.kyc-banner{border-radius:10px;padding:13px 16px;font-size:.88rem;font-weight:700;margin-bottom:14px;}
.kyc-banner.kyc-ok{background:#e8f7ee;color:#13803d;}
.kyc-banner.kyc-pending{background:#fff6e5;color:#a15c00;}
.kyc-banner.kyc-rejected{background:#fdecec;color:#d23b3b;}
.kyc-card{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:18px;margin-bottom:16px;box-shadow:0 6px 16px rgba(15,23,42,.06);}
.kyc-card h3{color:#172337;font-size:1.05rem;margin-bottom:6px;}
.kyc-help{font-size:.82rem;color:#64748b;line-height:1.5;margin-bottom:12px;}
.kyc-file-label{display:block;font-size:.82rem;color:#475569;font-weight:700;}
.kyc-file-label input{display:block;margin-top:6px;font-weight:400;}

.wd-method-tabs{margin:12px 0;}
.wd-tab-row{display:flex;gap:8px;margin-bottom:10px;}
.wd-tab{flex:1;border:1px solid rgba(15,23,42,.18);background:#fff;color:#475569;border-radius:8px;padding:10px;font-weight:800;cursor:pointer;}
.wd-tab.active{background:#172337;color:#fff;border-color:#172337;}
.wd-method-card{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:14px;margin-bottom:8px;}
.wd-method-ico{width:40px;height:40px;border-radius:8px;background:#eef2f7;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
.wd-method-info{flex:1;min-width:0;}
.wd-method-info strong{display:block;color:#172337;font-size:.92rem;}
.wd-method-info small{display:block;color:#64748b;font-size:.78rem;}
.wd-verify{display:inline-block;margin-top:4px;font-size:.68rem;font-weight:800;text-transform:uppercase;border-radius:4px;padding:2px 7px;}
.wd-verify.pending{background:#fff6e5;color:#a15c00;}
.wd-verify.verified{background:#e8f7ee;color:#13803d;}
.wd-verify.rejected{background:#fdecec;color:#d23b3b;}
.wd-primary-tag{background:#e8f7ee;color:#13803d;font-size:.7rem;font-weight:800;border-radius:4px;padding:3px 9px;}

.withdraw-request-form{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:16px;display:grid;gap:10px;box-shadow:0 6px 16px rgba(15,23,42,.06);}
.withdraw-request-form input,.withdraw-request-form select{width:100%;padding:12px;border:1px solid rgba(15,23,42,.18);border-radius:8px;font-size:.92rem;color:#172337;}
.withdraw-request-form input:focus,.withdraw-request-form select:focus{outline:none;border-color:#2874f0;}

.wd-hist-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:13px 16px;margin-bottom:8px;}
.wd-hist-main strong{display:block;color:#172337;font-family:var(--display);}
.wd-hist-main small{display:block;color:#64748b;font-size:.78rem;}
.wd-hist-meta{text-align:right;display:flex;flex-direction:column;gap:3px;align-items:flex-end;}
.wd-hist-meta small{color:#94a3b8;font-size:.74rem;}
.wd-note{color:#d23b3b !important;}
.wd-24hr{color:#a15c00 !important;font-weight:800 !important;background:#fff6e5;padding:2px 8px;border-radius:5px;}
.wd-paid-note{color:#13803d !important;font-weight:800 !important;}

.wd-badge{display:inline-block;font-size:.7rem;font-weight:800;text-transform:uppercase;border-radius:4px;padding:3px 9px;}
.wd-pending{background:#fff6e5;color:#a15c00;}
.wd-approved{background:#e6f0ff;color:#2155cd;}
.wd-processing{background:#e6f0ff;color:#2155cd;}
.wd-paid{background:#e8f7ee;color:#13803d;}
.wd-rejected{background:#fdecec;color:#d23b3b;}
.wd-verified{background:#e8f7ee;color:#13803d;}

/* ============================================================
   ADMIN PANEL
   ============================================================ */
.admin-wrap{max-width:1140px;}
.admin-shell{display:flex;gap:16px;align-items:flex-start;}
.admin-content{flex:1;min-width:0;position:relative;}
.admin-login{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:20px;display:grid;gap:10px;max-width:420px;}
.admin-login p{color:#475569;font-size:.88rem;}
.admin-login input{padding:12px;border:1px solid rgba(15,23,42,.18);border-radius:8px;background:#fff;color:#172337;-webkit-text-fill-color:#172337;font-size:.95rem;margin:0;width:100%;}
.admin-login input:focus{border-color:#2874f0;}
.admin-login p{color:#475569;font-size:.88rem;}
/* Sidebar of section "rows"; content opens to the right. */
.admin-tabs{display:flex;flex-direction:column;gap:6px;flex:0 0 216px;background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:14px;padding:10px;box-shadow:0 6px 16px rgba(15,23,42,.06);position:sticky;top:12px;}
.admin-tab{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:1px solid transparent;background:transparent;color:#475569;border-radius:10px;padding:11px 13px;font-weight:700;font-size:.9rem;cursor:pointer;transition:.15s;}
.admin-tab .at-ico{font-size:1.05rem;width:22px;text-align:center;flex-shrink:0;}
.admin-tab:hover{background:#f1f5f9;color:#172337;}
.admin-tab.active{background:linear-gradient(135deg,#172337,#2c3e63);color:#fff;border-color:#172337;box-shadow:0 5px 14px rgba(23,35,55,.28);}
.admin-sec-head{display:flex;justify-content:flex-end;margin-bottom:12px;}
.adm-refresh-btn{border:1px solid #cdeed7;background:#f3fbf5;color:#1a7f37;border-radius:9px;padding:8px 14px;font-weight:700;font-size:.85rem;cursor:pointer;transition:.15s;}
.adm-refresh-btn:hover{background:#1a7f37;color:#fff;}
.adm-refresh-btn.is-loading{opacity:.6;pointer-events:none;}
/* Admin-only refresh loading screen (overlay over the active section) */
.adm-refresh-overlay{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:rgba(255,255,255,.82);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border-radius:12px;}
.adm-refresh-overlay.is-hidden{display:none;}
.adm-refresh-spinner{width:44px;height:44px;border-radius:50%;border:4px solid #dcefe1;border-top-color:#1a7f37;animation:admSpin .7s linear infinite;}
.adm-refresh-text{color:#1a7f37;font-weight:800;font-size:.95rem;letter-spacing:.3px;}
@keyframes admSpin{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.adm-refresh-spinner{animation-duration:1.6s;}}
/* Overview cards + monthly table */
.adm-ov-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
.adm-ov-card{background:#fff;border:1px solid rgba(15,23,42,.08);border-top:3px solid #172337;border-radius:12px;padding:16px;box-shadow:0 6px 16px rgba(15,23,42,.05);display:flex;flex-direction:column;gap:4px;}
.adm-ov-num{font-family:var(--display);font-size:1.5rem;font-weight:900;color:#111827;line-height:1.1;}
.adm-ov-lbl{font-size:.74rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.03em;}
.adm-ov-tablewrap{overflow-x:auto;}
.adm-ov-table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.adm-ov-table th,.adm-ov-table td{padding:10px 14px;text-align:left;font-size:.85rem;border-bottom:1px solid rgba(15,23,42,.06);}
.adm-ov-table th{background:#172337;color:#fff;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;}
.adm-ov-table td{color:#334155;}
/* ---- Volume 5 · Admin Analyze board (reuses .adm-ov-* tiles + .seller-chart) */
.adm-ana-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px;}
.adm-ana-chip{border:1px solid rgba(15,23,42,.15);background:#fff;color:#334155;border-radius:999px;padding:6px 14px;font-size:.8rem;font-weight:700;cursor:pointer;}
.adm-ana-chip.active{background:#172337;border-color:#172337;color:#fff;}
.adm-ana-title{font-family:var(--display);font-size:1rem;font-weight:900;color:#172337;margin:20px 0 10px;}
.adm-ana-split{display:grid;grid-template-columns:1fr;gap:14px;align-items:start;}
@media (min-width:768px){.adm-ana-split{grid-template-columns:1fr 1fr;}}
.adm-ana-chart-lbl{font-size:.74rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.03em;margin:0 0 6px;}
.adm-ana-empty{display:flex;align-items:center;justify-content:center;min-height:120px;color:#64748b;font-size:.85rem;}
.adm-funnel{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;padding:14px;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.adm-funnel-row{display:grid;grid-template-columns:minmax(88px,110px) 1fr 46px;align-items:center;gap:10px;font-size:.8rem;color:#334155;}
.adm-funnel-bar{height:10px;border-radius:6px;background:#172337;min-width:2px;}
.adm-funnel-num{font-weight:800;text-align:right;color:#111827;}
.adm-viewmore{background:none;border:0;color:#1559b3;font-weight:700;font-size:.82rem;cursor:pointer;padding:6px 0 0;text-decoration:underline;}
.adm-more-box{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(15,23,42,.15);}
.adm-ref-head{font-size:.82rem;color:#475569;margin:6px 0;}
.adm-ref-row{display:flex;justify-content:space-between;gap:10px;font-size:.82rem;padding:5px 0;border-bottom:1px solid rgba(15,23,42,.06);}
.adm-pay{font-weight:800;font-size:.7rem;padding:2px 8px;border-radius:999px;}
.adm-pay.done{background:#dcfce7;color:#166534;}
.adm-pay.pending{background:#fef3c7;color:#92400e;}
.adm-pay.failed{background:#fee2e2;color:#b91c1c;}
.admin-tab.admin-logout{color:#dc2626;background:#fef2f2;border-color:#f7cccc;}
.admin-tab.admin-logout:hover{background:#fde0e0;}
@media(max-width:768px){
.admin-shell{flex-direction:column;}
.admin-tabs{flex-direction:row;flex-wrap:wrap;flex-basis:auto;width:100%;position:static;}
.admin-tab{width:auto;}
}
.adm-card{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:16px;margin-bottom:12px;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.adm-card-top{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:1.1rem;color:#111827;}
.adm-card-meta{display:flex;justify-content:space-between;gap:10px;color:#64748b;font-size:.8rem;margin:6px 0;flex-wrap:wrap;}
.adm-card-dest{color:#334155;font-size:.86rem;background:#f6f8fb;border-radius:8px;padding:9px 12px;margin:8px 0;word-break:break-word;}
.adm-card-ref{color:#475569;font-size:.8rem;margin-bottom:4px;}
/* ===== Admin: Members ===== */
.adm-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px;}
.adm-stat{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:14px 10px;text-align:center;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.adm-stat-num{display:block;font-family:var(--display);font-size:1.35rem;font-weight:800;color:#111827;line-height:1.1;}
.adm-stat-lbl{display:block;font-size:.72rem;color:#64748b;margin-top:3px;text-transform:uppercase;letter-spacing:.04em;}
.adm-member-search{width:100%;padding:11px 14px;border:1px solid rgba(15,23,42,.18);border-radius:10px;margin-bottom:14px;font-size:.9rem;background:#fff;color:#172337;-webkit-text-fill-color:#172337;}
.adm-member-search:focus{outline:none;border-color:#2874f0;}
.adm-member .adm-card-top{flex-wrap:wrap;}
.adm-tier{font-family:var(--body,inherit);font-size:.68rem;font-weight:800;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em;}
.adm-tier-silver{background:#eef1f5;color:#5b6677;}
.adm-tier-gold{background:#fdf0cf;color:#9a7b18;}
.adm-tier-pro{background:#e7e0ff;color:#5b3fc4;}
.adm-tier-elite{background:#0f172a;color:#ffce12;}

/* Members tab: clickable per-plan count boxes (199/499/999/1499) */
.adm-tier-boxes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px;}
.adm-tier-box{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;padding:12px 6px;border-radius:12px;border:2px solid transparent;cursor:pointer;font-family:inherit;transition:.15s;}
.adm-tier-box-plan{font-size:.72rem;font-weight:700;white-space:nowrap;}
.adm-tier-box-num{font-family:var(--display);font-size:1.35rem;font-weight:800;line-height:1;}
.adm-tier-box.t-silver{background:#eef1f5;color:#5b6677;}
.adm-tier-box.t-gold{background:#fdf0cf;color:#9a7b18;}
.adm-tier-box.t-pro{background:#e7e0ff;color:#5b3fc4;}
.adm-tier-box.t-elite{background:#0f172a;color:#ffce12;}
.adm-tier-box:hover{filter:brightness(.97);}
.adm-tier-box.active{border-color:currentColor;box-shadow:0 8px 18px rgba(15,23,42,.2);transform:translateY(-1px);}
@media(max-width:560px){.adm-tier-boxes{grid-template-columns:repeat(2,1fr);}}

/* Cart + order item: size/color chips and click-to-open */
.cart-item-image.is-clickable,.cart-item h3.is-clickable{cursor:pointer;}
.cart-item h3.is-clickable:hover{text-decoration:underline;}
.cart-variants,.od-item-variants{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0;}
.cart-variant,.od-item-variant{font-size:.72rem;background:#f1f5f9;color:#475569;border-radius:6px;padding:2px 8px;font-weight:600;}
.od-item.is-clickable{cursor:pointer;}
.od-item.is-clickable:hover{background:#f8fafc;}
.od-item-go{margin-left:auto;align-self:center;color:#94a3b8;font-size:1.4rem;font-weight:700;padding:0 4px;}

/* Admin order: per-item breakdown (image + size/color/qty) */
.adm-ord-items{display:flex;flex-direction:column;gap:8px;margin:10px 0;}
.adm-ord-item{display:flex;gap:10px;align-items:center;background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:8px;}
.adm-ord-item-img{width:48px;height:48px;border-radius:8px;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid rgba(15,23,42,.1);}
.adm-ord-item-img img{width:100%;height:100%;object-fit:cover;}
.adm-ord-item-ph{font-size:1.3rem;}
.adm-ord-item-info{display:flex;flex-direction:column;gap:2px;min-width:0;}
.adm-ord-item-info strong{font-size:.85rem;color:#172337;}
.adm-ord-item-info small{font-size:.74rem;color:#64748b;}
.adm-ord-item-info{flex:1;}
.adm-it-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px;}
.adm-it-chip{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:999px;}
.adm-it-chip.size{background:#e0f2fe;color:#075985;}
.adm-it-chip.color{background:#fae8ff;color:#86198f;}
.adm-it-chip.qty{background:#f1f5f9;color:#475569;}
.adm-it-price{align-self:center;font-weight:800;color:#15803d;font-size:.9rem;white-space:nowrap;}

/* Colourful order status badge */
.adm-ostat{display:inline-block;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;border-radius:999px;padding:3px 10px;}
.adm-ostat-ordered{background:#e0e7ff;color:#3730a3;}
.adm-ostat-shipped{background:#dbeafe;color:#1d4ed8;}
.adm-ostat-out_for_delivery{background:#fef9c3;color:#854d0e;}
.adm-ostat-delivered{background:#dcfce7;color:#166534;}
.adm-ostat-cancelled{background:#fee2e2;color:#b91c1c;}
.adm-ord-store{background:#f3e8fd;color:#7d3cc9;text-transform:none;}
.adm-ord-card{border-left:4px solid #cbd5e1;}
.adm-ord-card.adm-ost-delivered{border-left-color:#22c55e;}
.adm-ord-card.adm-ost-shipped{border-left-color:#3b82f6;}
.adm-ord-card.adm-ost-out_for_delivery{border-left-color:#eab308;}
.adm-ord-card.adm-ost-cancelled{border-left-color:#ef4444;}
.adm-ord-card.adm-ost-ordered{border-left-color:#6366f1;}
.adm-ord-email{color:#1d4ed8;font-weight:600;word-break:break-all;}

/* Order address block (admin) */
.adm-ord-addr{background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:10px 12px;margin:10px 0;display:flex;flex-direction:column;gap:5px;}
.adm-ord-addr-row{display:flex;align-items:flex-start;gap:7px;font-size:.82rem;color:#172337;}
.adm-ord-addr-ico{flex-shrink:0;}
.adm-ord-flbl{display:block;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;margin-bottom:2px;}

/* Admin date-range filter bar */
.admin-sec-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:12px;}
.adm-daterange{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.adm-daterange label{font-size:.74rem;font-weight:700;color:#64748b;display:flex;align-items:center;gap:5px;}
.adm-daterange input[type=date]{padding:6px 8px;border:1px solid rgba(15,23,42,.18);border-radius:8px;font-family:inherit;font-size:.8rem;color:#172337;background:#fff;}
.adm-date-apply{padding:7px 14px;border:0;border-radius:8px;background:#2874f0;color:#fff;font-weight:700;font-size:.8rem;cursor:pointer;font-family:inherit;}
.adm-date-clear{padding:7px 12px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#64748b;font-weight:700;font-size:.8rem;cursor:pointer;font-family:inherit;}
.adm-range-note{background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;border-radius:8px;padding:7px 12px;font-size:.8rem;font-weight:700;margin-bottom:12px;}

/* Admin Orders: status / cancelled / returns filter chips */
.adm-ord-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.adm-ord-tab{padding:7px 12px;border:1.5px solid #e2e8f0;border-radius:999px;background:#fff;color:#475569;font-size:.8rem;font-weight:700;cursor:pointer;font-family:inherit;transition:.12s;}
.adm-ord-tab:hover{border-color:#cbd5e1;background:#f8fafc;}
.adm-ord-tab.active{background:#172337;border-color:#172337;color:#fff;}
.adm-ord-tab-n{display:inline-block;min-width:18px;padding:0 5px;margin-left:3px;border-radius:999px;background:rgba(15,23,42,.1);font-size:.72rem;}
.adm-ord-tab.active .adm-ord-tab-n{background:rgba(255,255,255,.25);}

/* Membership status notice (user) — hold (amber) / expired (red) */
.membership-hold-notice{background:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:12px;padding:14px 16px;margin:0 0 16px;font-size:.9rem;line-height:1.55;}
.membership-hold-notice.expired{background:#fef2f2;border-color:#fecaca;color:#991b1b;}

/* Admin member: membership payment history (new/renew/gift) */
.adm-mp{margin:10px 0;background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:8px 12px;}
.adm-mp-title{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;margin-bottom:6px;}
.adm-mp-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:.8rem;}
.adm-mp-kind{font-size:.66rem;font-weight:800;padding:2px 8px;border-radius:999px;text-transform:uppercase;}
.adm-mp-kind.new{background:#dcfce7;color:#166534;}
.adm-mp-kind.renew{background:#dbeafe;color:#1d4ed8;}
.adm-mp-kind.gift{background:#fae8ff;color:#86198f;}
.adm-mp-amt{font-weight:700;color:#172337;min-width:60px;}
.adm-mp-date{color:#64748b;margin-left:auto;font-size:.74rem;}

/* Admin member Hold / Delete sections */
.adm-mem-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px;}
.adm-mem-sec{display:flex;flex-direction:column;gap:5px;background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:10px;padding:9px 12px;}
.adm-mem-sec-lbl{font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;}
.adm-btn.hold{background:#fef3c7;color:#92400e;border:1px solid #fde68a;}
.adm-btn.hold:hover{background:#fde68a;}

/* Admin cancel/return flags */
.adm-ord-flag{border-radius:10px;padding:10px 12px;margin:10px 0;font-size:.82rem;}
.adm-ord-flag.cancel{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;}
.adm-ord-flag.return{background:#fffbeb;border:1px solid #fde68a;color:#92400e;}
.adm-ord-flag b{display:block;margin-bottom:2px;}
.adm-ord-flag-note{font-style:italic;opacity:.85;margin-top:2px;}
.adm-ord-flag-info{margin-top:6px;font-size:.76rem;opacity:.9;}

/* User order cancel/return cards + buttons */
.od-cancel-card{border-left:4px solid #ef4444;}
.od-return-card{border-left:4px solid #f59e0b;}
.od-cr-reason{font-size:.86rem;color:#172337;margin:4px 0;}
.od-cr-note{font-size:.82rem;color:#475569;font-style:italic;margin:4px 0;}
.od-cr-info{font-size:.82rem;color:#64748b;margin:4px 0;line-height:1.5;}
.od-cancel-btn,.od-return-btn{margin-top:8px;padding:10px 18px;border:1px solid #cbd5e1;background:#fff;color:#172337;border-radius:10px;font-weight:700;font-size:.86rem;cursor:pointer;font-family:inherit;}
.od-cancel-btn:hover{background:#fef2f2;border-color:#fecaca;color:#b91c1c;}
.od-return-btn:hover{background:#fffbeb;border-color:#fde68a;color:#92400e;}

/* Cancel / return reason modal */
.ocr-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);display:none;align-items:center;justify-content:center;z-index:1200;padding:16px;}
.ocr-overlay.open{display:flex;}
.ocr-modal{background:#fff;border-radius:16px;padding:22px;max-width:440px;width:100%;position:relative;box-shadow:0 24px 60px rgba(15,23,42,.3);max-height:90vh;overflow-y:auto;}
.ocr-close{position:absolute;top:12px;right:14px;background:none;border:0;font-size:1.6rem;line-height:1;color:#94a3b8;cursor:pointer;}
.ocr-modal h3{margin:0 0 4px;font-size:1.15rem;color:#0f172a;}
.ocr-sub{font-size:.86rem;color:#64748b;margin-bottom:14px;}
.ocr-reasons{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;}
.ocr-reason{text-align:left;padding:11px 14px;border:1.5px solid #e2e8f0;border-radius:10px;background:#fff;font-size:.88rem;color:#172337;cursor:pointer;font-family:inherit;transition:.12s;}
.ocr-reason:hover{border-color:#cbd5e1;background:#f8fafc;}
.ocr-reason.active{border-color:#2874f0;background:#eff6ff;color:#1d4ed8;font-weight:700;}
.ocr-note{width:100%;padding:11px 14px;border:1px solid rgba(15,23,42,.18);border-radius:10px;font-family:inherit;font-size:.88rem;color:#172337;-webkit-text-fill-color:#172337;resize:vertical;margin-bottom:8px;}
.ocr-note:focus{outline:none;border-color:#2874f0;}
.ocr-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:8px;}
.ocr-back-btn{padding:10px 18px;border:1px solid #cbd5e1;background:#fff;color:#475569;border-radius:10px;font-weight:700;cursor:pointer;font-family:inherit;font-size:.86rem;}
.ocr-submit-btn{padding:10px 20px;border:0;background:#ef4444;color:#fff;border-radius:10px;font-weight:800;cursor:pointer;font-family:inherit;font-size:.86rem;}
.ocr-submit-btn:hover{background:#dc2626;}
.ocr-submit-btn:disabled{opacity:.6;cursor:not-allowed;}
.adm-tier-top{background:#fff2e0;color:#c2640f;border:1px solid #f3c98a;}
.adm-member-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px;}
.adm-chip{background:#f6f8fb;border:1px solid rgba(15,23,42,.06);border-radius:8px;padding:6px 10px;font-size:.78rem;color:#334155;}
.adm-chip strong{color:#111827;}
.adm-kyc-link{display:inline-block;color:#2874f0;font-weight:800;font-size:.86rem;margin:6px 0;}
.adm-ref,.adm-note{width:100%;padding:10px;border:1px solid rgba(15,23,42,.18);border-radius:8px;margin-top:8px;font-size:.86rem;background:#fff;color:#172337;-webkit-text-fill-color:#172337;}
.adm-ref:focus,.adm-note:focus{outline:none;border-color:#2874f0;}
.adm-btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.adm-btn{border:0;border-radius:8px;padding:9px 16px;font-weight:800;cursor:pointer;color:#fff;}
.adm-btn.approve{background:#2874f0;}
.adm-btn.paid{background:#13803d;}
.adm-btn.reject{background:#d23b3b;}
.adm-btn:disabled{opacity:.55;cursor:not-allowed;}

/* ===== ADMIN PRODUCT MANAGEMENT ===== */
.adm-prod-add{margin-bottom:14px;}
/* Volume 6 · 6C — Today's Deal suggestions (rule-scored, admin accepts) */
.adm-sug-wrap{margin:12px 0 6px;}
.adm-sug-btn{border:1px solid rgba(15,23,42,.15);background:#fff;color:#172337;border-radius:8px;padding:9px 16px;font-weight:800;font-size:.82rem;cursor:pointer;}
.adm-sug-btn:hover{background:#f8fafc;}
.adm-sug-hint{color:var(--muted);font-size:.78rem;margin:10px 0 8px;}
.adm-sug-row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:10px;padding:8px 10px;margin-bottom:8px;}
.adm-sug-thumb{width:44px;height:44px;border-radius:8px;overflow:hidden;background:#f1f5f9;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.adm-sug-thumb img{width:100%;height:100%;object-fit:cover;}
.adm-sug-info{flex:1;min-width:0;}
.adm-sug-info b{display:block;font-size:.85rem;color:#172337;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.adm-sug-info small{color:#64748b;font-size:.74rem;}
.adm-sug-info s{color:#94a3b8;}
.adm-sug-accept{border:0;border-radius:8px;padding:7px 14px;font-weight:800;font-size:.76rem;cursor:pointer;background:#172337;color:#fff;flex:0 0 auto;}
.adm-sug-accept.is-done{background:#16a34a;}
.adm-sug-accept:disabled{opacity:.75;cursor:default;}
.adm-prod-filters{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 6px;}
.adm-prod-filters .adm-prod-search{flex:1;min-width:180px;margin:0;}
.adm-prod-catsel{height:42px;border:1px solid rgba(15,23,42,.18);border-radius:8px;padding:0 12px;font-size:.9rem;background:#fff;cursor:pointer;flex-shrink:0;}
.adm-prod-search{width:100%;height:42px;margin:12px 0 6px;border:1px solid rgba(15,23,42,.18);border-radius:8px;padding:0 14px;font-size:.9rem;box-sizing:border-box;}
.adm-prod-count{color:var(--muted);font-size:.8rem;margin:0 0 10px;}
.adm-prod-cost{font-size:.74rem;color:#0d8a4f;font-weight:700;}
.adm-prod-sku{font-size:.7rem;color:#64748b;font-family:monospace;}
.adm-prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
.adm-prod-card{display:flex;gap:12px;background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:12px;box-shadow:0 4px 12px rgba(15,23,42,.05);}
.adm-prod-thumb{width:64px;height:64px;border-radius:8px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:1.6rem;overflow:hidden;flex-shrink:0;}
.adm-prod-thumb img{width:100%;height:100%;object-fit:cover;}
.adm-prod-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.adm-prod-info strong{color:#172337;font-size:.92rem;line-height:1.2;}
.adm-prod-cat{color:#94a3b8;font-size:.72rem;text-transform:uppercase;font-weight:700;}
.adm-prod-price{color:#111827;font-weight:800;font-size:.9rem;}
.adm-prod-price del{color:#94a3b8;font-weight:400;font-size:.78rem;}
.adm-prod-price em{color:#13803d;font-style:normal;font-size:.74rem;font-weight:800;}
.adm-prod-stock{color:#64748b;font-size:.74rem;}
.adm-prod-actions{display:flex;flex-direction:column;gap:6px;justify-content:center;}
.adm-prod-actions .adm-btn{padding:6px 12px;font-size:.78rem;}
.adm-prod-check{width:18px;height:18px;flex-shrink:0;align-self:flex-start;margin-top:2px;cursor:pointer;accent-color:#172337;}
.adm-prod-card.is-selected{border-color:#172337;box-shadow:0 0 0 2px rgba(23,35,55,.18);background:#f6f8fc;}
.adm-bulk-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 12px;padding:10px 12px;background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:10px;}
.adm-bulk-all{display:flex;align-items:center;gap:7px;font-size:.82rem;font-weight:600;color:#172337;cursor:pointer;}
.adm-bulk-all input{width:17px;height:17px;accent-color:#172337;cursor:pointer;}
.adm-bulk-count{font-size:.8rem;color:#64748b;margin-right:auto;}
.adm-bulk-del:disabled{opacity:.45;cursor:not-allowed;}
.adm-sr-line{font-size:.8rem;color:#475569;margin-top:4px;}
.adm-sr-line.sr-explain{font-weight:600;color:#334155;margin-top:7px;}
.adm-tier.adm-tier-held{background:#fee2e2;color:#b91c1c;}
.adm-card.adm-member.is-held{border-color:#f3b4b4;background:#fff6f6;}
.adm-sr-badge{font-size:.7rem;font-weight:800;padding:2px 8px;border-radius:999px;}
.adm-sr-badge.sr-pending{background:#fef3c7;color:#92400e;}
.adm-sr-badge.sr-credited{background:#dcfce7;color:#166534;}
.adm-sr-badge.sr-void{background:#f1f5f9;color:#64748b;}

/* Referral rewards: search + total boxes, per-user PT/Credit rows, view-more table */
.adm-sr-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px;}
.adm-sr-search{flex:1 1 240px;min-width:200px;}
.adm-sr-search input{width:100%;padding:10px 14px;border:1px solid rgba(15,23,42,.18);border-radius:10px;background:#fff;color:#172337;-webkit-text-fill-color:#172337;font-size:.9rem;font-family:inherit;}
.adm-sr-search input:focus{outline:none;border-color:#2874f0;}
.adm-sr-totals{display:flex;gap:10px;}
.adm-sr-stat{min-width:120px;padding:10px 16px;border-radius:12px;text-align:center;color:#fff;box-shadow:0 6px 16px rgba(15,23,42,.12);}
.adm-sr-stat span{display:block;font-size:.66rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.92;}
.adm-sr-stat b{font-size:1.15rem;line-height:1.4;}
.adm-sr-stat.pt{background:linear-gradient(135deg,#f59e0b,#d97706);}
.adm-sr-stat.cr{background:linear-gradient(135deg,#10b981,#059669);}

.adm-sr-user{padding:14px 16px;}
.adm-sr-userrow{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between;}
.adm-sr-uemail{font-weight:700;color:#172337;display:flex;flex-direction:column;gap:2px;}
.adm-sr-ucount{font-size:.7rem;font-weight:600;color:#64748b;}
.adm-sr-ubal{display:flex;gap:8px;flex-wrap:wrap;}
.adm-sr-ubal span{font-size:.78rem;font-weight:800;padding:4px 10px;border-radius:999px;}
.adm-sr-ubal .pt{background:#fef3c7;color:#92400e;}
.adm-sr-ubal .cr{background:#dcfce7;color:#166534;}

.adm-sr-table-wrap{overflow-x:auto;}
.adm-sr-table{width:100%;border-collapse:collapse;font-size:.82rem;}
.adm-sr-table th{text-align:left;font-size:.66rem;text-transform:uppercase;letter-spacing:.03em;color:#64748b;padding:6px 10px;border-bottom:1px solid rgba(15,23,42,.1);white-space:nowrap;}
.adm-sr-table td{padding:8px 10px;border-bottom:1px solid rgba(15,23,42,.06);color:#172337;vertical-align:middle;}
.adm-sr-table tr:last-child td{border-bottom:0;}
.adm-sr-actcell{display:flex;gap:6px;white-space:nowrap;}
.adm-btn.sm{padding:4px 10px;font-size:.72rem;}

/* ===== Admin: Settlements (Volume 1) ===== */
.adm-settle-tiles{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.adm-settle-tiles .adm-sr-stat.held{background:linear-gradient(135deg,#3b82f6,#2563eb);}
.adm-settle-tiles .adm-sr-stat.payable{background:linear-gradient(135deg,#8b5cf6,#6d28d9);}
.adm-settle-tiles .adm-sr-stat.rev{background:linear-gradient(135deg,#10b981,#059669);}
.adm-settle-tiles .adm-sr-stat.bank{background:linear-gradient(135deg,#0ea5e9,#0369a1);}
.adm-settle-tiles .adm-sr-stat.cash{background:linear-gradient(135deg,#f59e0b,#d97706);}
.adm-settle-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;}
.adm-settle-hint{font-size:.76rem;color:#64748b;font-weight:600;}
.adm-settle-just{font-size:.8rem;font-weight:800;color:#059669;}
.adm-settle-badge{display:inline-block;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:3px 9px;border-radius:999px;}
.adm-settle-badge.due{background:#fef3c7;color:#b45309;}
.adm-settle-badge.paid{background:#d1fae5;color:#047857;}
.adm-settle-badge.reversed{background:#fee2e2;color:#b91c1c;}
.adm-settle-badge.held{background:#dbeafe;color:#1d4ed8;}

/* Admin Help Center */
.adm-supp-msg{margin:8px 0;color:#172337;font-size:.9rem;white-space:pre-wrap;line-height:1.5;}
.adm-supp-imgs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.adm-supp-imgs img{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid rgba(15,23,42,.12);}
.adm-supp-input{width:100%;padding:10px 12px;border:1px solid rgba(15,23,42,.18);border-radius:8px;font-family:inherit;font-size:.88rem;color:#172337;-webkit-text-fill-color:#172337;resize:vertical;margin-bottom:8px;}
.adm-supp-input:focus{outline:none;border-color:#2874f0;}
.adm-supp-reply{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:8px 12px;font-size:.86rem;color:#166534;}

/* Help Center (user page) */
.help-wrap{max-width:760px;margin:0 auto;}
.help-intro{color:#475569;font-size:.92rem;line-height:1.6;margin-bottom:18px;}
.help-guest{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:22px;text-align:center;box-shadow:0 8px 22px rgba(15,23,42,.06);}
.help-guest p{margin-bottom:12px;color:#475569;}
.help-form{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:14px;padding:18px;box-shadow:0 8px 22px rgba(15,23,42,.06);margin-bottom:24px;}
.help-label{font-size:.78rem;font-weight:800;color:#475569;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;}
.help-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.help-chip{background:#f1f5f9;border:1px solid rgba(15,23,42,.1);border-radius:999px;padding:7px 14px;font-size:.82rem;font-weight:600;color:#334155;cursor:pointer;transition:.15s;}
.help-chip:hover{background:#e2e8f0;}
.help-chip.active{background:var(--gold,#d4a017);border-color:var(--gold,#d4a017);color:#fff;}
.help-textarea{width:100%;padding:12px 14px;border:1px solid rgba(15,23,42,.18);border-radius:10px;font-family:inherit;font-size:.92rem;color:#172337;-webkit-text-fill-color:#172337;resize:vertical;margin-bottom:12px;}
.help-textarea:focus{outline:none;border-color:#2874f0;}
.help-attach{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.help-attach-btn{background:#eef2ff;border:1px solid #c7d2fe;border-radius:8px;padding:9px 14px;font-size:.85rem;font-weight:700;color:#3730a3;cursor:pointer;}
.help-attach-note{font-size:.75rem;color:#94a3b8;}
.help-photos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.help-prev-title{margin-top:8px;}
.help-q-card{background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:14px 16px;margin-bottom:12px;box-shadow:0 4px 14px rgba(15,23,42,.05);}
.help-q-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;}
.help-q-cat{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:#64748b;}
.help-q-status{font-size:.7rem;font-weight:800;padding:3px 10px;border-radius:999px;}
.help-q-status.ok{background:#dcfce7;color:#166534;}
.help-q-status.wait{background:#fef3c7;color:#92400e;}
.help-q-msg{color:#172337;font-size:.9rem;line-height:1.5;white-space:pre-wrap;margin-bottom:8px;}
.help-q-imgs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.help-q-imgs img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid rgba(15,23,42,.12);}
.help-q-reply{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:8px 12px;font-size:.86rem;color:#166534;line-height:1.5;}
.help-q-pending{font-size:.82rem;color:#92400e;font-weight:600;}
.help-q-resolved-tag{display:inline-block;margin-left:6px;background:#dcfce7;color:#166534;font-size:.66rem;font-weight:800;padding:2px 7px;border-radius:999px;vertical-align:middle;}

/* Help Center conversation thread (user) */
.help-thread{display:flex;flex-direction:column;gap:8px;margin:8px 0;}
.help-bubble{max-width:85%;padding:8px 12px;border-radius:12px;font-size:.86rem;line-height:1.45;color:#172337;position:relative;}
.help-bubble-who{display:block;font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;opacity:.6;margin-bottom:2px;}
.help-bubble.mine{align-self:flex-end;background:#eff6ff;border:1px solid #bfdbfe;border-bottom-right-radius:3px;}
.help-bubble.team{align-self:flex-start;background:#f1f5f9;border:1px solid #e2e8f0;border-bottom-left-radius:3px;}
.help-reply-row{display:flex;gap:8px;margin-top:8px;}
.help-reply-input{flex:1;padding:9px 12px;border:1px solid rgba(15,23,42,.18);border-radius:10px;font-family:inherit;font-size:.86rem;color:#172337;-webkit-text-fill-color:#172337;}
.help-reply-input:focus{outline:none;border-color:#2874f0;}
.help-reply-btn{padding:9px 16px;border:0;border-radius:10px;background:#2874f0;color:#fff;font-weight:700;font-size:.84rem;cursor:pointer;font-family:inherit;}
.help-reply-btn:disabled{opacity:.6;cursor:not-allowed;}

/* Help Center conversation thread (admin) */
.adm-supp-thread{display:flex;flex-direction:column;gap:7px;margin:10px 0;}
.adm-supp-bubble{max-width:88%;padding:8px 11px;border-radius:10px;font-size:.84rem;line-height:1.45;color:#172337;}
.adm-supp-who{display:block;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;opacity:.6;margin-bottom:2px;}
.adm-supp-bubble.user{align-self:flex-start;background:#f1f5f9;border:1px solid #e2e8f0;}
.adm-supp-bubble.team{align-self:flex-end;background:#eff6ff;border:1px solid #bfdbfe;}

.adm-prod-form{background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:12px;padding:18px;margin-bottom:16px;box-shadow:0 8px 22px rgba(15,23,42,.08);}
.adm-prod-form .addr-form-grid textarea{grid-column:1 / -1;width:100%;padding:12px;background:#fff;border:1px solid rgba(15,23,42,.18);border-radius:8px;color:#172337;-webkit-text-fill-color:#172337;font-size:.9rem;font-family:inherit;resize:vertical;}
.adm-prod-form .addr-form-grid textarea:focus{outline:none;border-color:#2874f0;}
.adm-img-label{font-size:.8rem;font-weight:800;color:#475569;margin:14px 0 8px;text-transform:uppercase;letter-spacing:.04em;}
.adm-img-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.adm-img-empty{color:#94a3b8;font-size:.82rem;}
.adm-img-thumb{position:relative;width:72px;height:72px;border-radius:8px;overflow:hidden;border:1px solid rgba(15,23,42,.12);}
.adm-img-thumb img{width:100%;height:100%;object-fit:cover;}
.adm-img-thumb button{position:absolute;top:2px;right:2px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(210,59,59,.92);color:#fff;font-size:.9rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;}

/* ============================================================
   CHECKOUT: saved-address picker
   ============================================================ */
.checkout-saved{margin-bottom:14px;}
.checkout-saved-head{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#475569;margin-bottom:8px;}
.checkout-addr-list{display:flex;flex-direction:column;gap:8px;}
.checkout-addr-chip{text-align:left;background:#fff;border:1.5px solid rgba(15,23,42,.14);border-radius:10px;padding:11px 14px;cursor:pointer;display:flex;flex-direction:column;gap:3px;width:100%;}
.checkout-addr-chip:hover{border-color:#2874f0;}
.checkout-addr-chip.selected{border-color:#2874f0;background:#eef4ff;}
.checkout-addr-chip .ca-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.checkout-addr-chip .ca-top strong{color:#172337;font-size:.9rem;}
.checkout-addr-chip .ca-line{color:#64748b;font-size:.8rem;line-height:1.4;}
.checkout-addr-chip.new{color:#2874f0;font-weight:800;text-align:center;border-style:dashed;}

@media(max-width:768px){
.wallet-balance-grid{grid-template-columns:1fr;}
.withdraw-wrap,.admin-wrap{max-width:100%;}
}

/* ============================================================
   BRAND LOGO (cart) · NAV CATEGORY STRIP · ALL DROPDOWN
   ============================================================ */
.ec-brand{display:inline-flex;align-items:center;gap:8px;text-decoration:none;}
.ec-brand-ico{width:30px;height:30px;flex-shrink:0;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.35);}
.ec-brand-text{font-family:var(--display);font-weight:800;font-size:1.2rem;letter-spacing:-.01em;color:var(--white);}
.footer-logo.ec-brand .ec-brand-text{color:var(--white);}
nav .ec-brand-text{background:linear-gradient(90deg,#ffce12,#ffe9a3);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

.nav-allcat{flex-shrink:0;max-width:120px;height:44px;border:0;border-radius:4px 0 0 4px;background:#e9edf3;color:#172337;font-weight:700;font-size:.8rem;padding:0 6px;cursor:pointer;}
.nav-row-3{margin-top:8px;}
.nav-cat-wrap{position:relative;}
.nav-cat-strip{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px;scroll-behavior:smooth;}
.nav-cat-strip::-webkit-scrollbar{display:none;}
.ncat-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:30px;height:30px;border-radius:50%;border:1px solid rgba(244,183,63,.55);background:rgba(10,10,15,.92);color:var(--gold);font-size:1.25rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 9px rgba(0,0,0,.45);padding:0;}
.ncat-arrow.ncat-prev{left:-4px;}
.ncat-arrow.ncat-next{right:-4px;}
.ncat-arrow:hover{background:var(--gold);color:#15130a;}
.ncat{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;border:1.5px solid rgba(244,183,63,.4);background:rgba(255,255,255,.05);color:var(--white);border-radius:999px;padding:5px 12px;font-size:.72rem;font-weight:700;letter-spacing:.01em;cursor:pointer;white-space:nowrap;transition:.18s;}
.ncat .ncat-ico{font-size:.95em;line-height:1;}
.ncat:hover{background:rgba(244,183,63,.16);border-color:var(--gold);}
.ncat.active{background:var(--gold);color:#15130a;border-color:var(--gold);box-shadow:0 2px 9px rgba(244,183,63,.38);}

/* ===== STORE: sort dropdown + featured/offers carousel ===== */
.ec-tools-right{display:flex;gap:8px;align-items:center;}
.ec-sort{height:40px;border:1px solid rgba(15,23,42,.18);border-radius:8px;background:#fff;color:#172337;font-size:14px;font-weight:600;padding:0 10px;cursor:pointer;min-width:0;flex:1 1 auto;max-width:160px;}

.ec-featured-wrap{margin:6px 0 18px;}
.ec-featured-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.ec-featured-head h3{font-size:1.1rem;color:#172337;}
.ec-featured{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 2px 8px;}
.ec-featured::-webkit-scrollbar{display:none;}
.ecf-card{scroll-snap-align:start;flex:0 0 auto;width:calc(25% - 9px);min-width:160px;background:#fff;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:8px;box-shadow:0 6px 16px rgba(15,23,42,.06);cursor:pointer;transition:.2s;}
.ecf-card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(15,23,42,.12);}
.ecf-img{position:relative;height:78px;border-radius:8px;overflow:hidden;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:6px;}
.ecf-img img{width:100%;height:100%;object-fit:cover;}
.ecf-badge{position:absolute;top:8px;left:8px;background:#fb641b;color:#fff;font-size:.72rem;font-weight:800;padding:3px 9px;border-radius:4px;z-index:1;}
/* ===== Attention animation for discount badges ===== */
@keyframes ecDealPulse{
0%{transform:scale(1);box-shadow:0 2px 6px rgba(251,100,27,.4);}
50%{transform:scale(1.1);box-shadow:0 0 14px 2px rgba(251,100,27,.7);}
100%{transform:scale(1);box-shadow:0 2px 6px rgba(251,100,27,.4);}
}
@keyframes ecOffPulse{0%,100%{opacity:1;}50%{opacity:.55;}}
.ecf-badge,.ds-off{animation:ecDealPulse 1.3s ease-in-out infinite;transform-origin:center;}
.product-offer,.ec-disc{animation:ecOffPulse 1.5s ease-in-out infinite;}
.ecf-deal-msg{animation:ecOffPulse 1.5s ease-in-out infinite;}
/* ===== Hero "Today Deals" rotating spotlight ===== */
.visual-tile.wide.deal-spotlight{
grid-column:span 2;min-height:64px;padding:9px 13px;
display:flex;align-items:center;justify-content:flex-start;
background:linear-gradient(135deg,#172337,#28406a);
border:none;cursor:pointer;text-transform:none;letter-spacing:normal;
font-family:inherit;width:100%;overflow:hidden;text-align:left;
transition:transform .15s ease,box-shadow .15s ease;
}
.visual-tile.wide.deal-spotlight:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(15,23,42,.28);}
.deal-spotlight .ds-inner{display:flex;align-items:center;gap:12px;width:100%;opacity:0;transform:translateY(6px);}
.deal-spotlight .ds-inner.ds-show{animation:ecDealFade .5s ease forwards;}
@keyframes ecDealFade{to{opacity:1;transform:translateY(0);}}
.ds-thumb{width:46px;height:46px;border-radius:8px;overflow:hidden;background:#fff;flex:0 0 auto;display:flex;align-items:center;justify-content:center;}
.ds-thumb img{width:100%;height:100%;object-fit:cover;}
.ds-emoji{font-size:1.6rem;}
.ds-info{display:flex;flex-direction:column;gap:1px;min-width:0;}
.ds-kicker{font-size:.6rem;font-weight:800;color:#ffce12;letter-spacing:.06em;text-transform:uppercase;}
.ds-name{font-size:.82rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px;}
.ds-line{font-size:.78rem;font-weight:800;color:#fff;display:flex;align-items:center;gap:8px;}
.ds-off{background:#fb641b;color:#fff;font-size:.66rem;font-weight:800;padding:2px 7px;border-radius:4px;}
.deal-spotlight .ds-text{font-size:.85rem;font-weight:900;color:#fff;letter-spacing:.06em;text-transform:uppercase;}
@media (prefers-reduced-motion: reduce){
.ecf-badge,.ds-off,.product-offer,.ec-disc,.ecf-deal-msg,.deal-spotlight .ds-inner{animation:none;opacity:1;}
}
.ecf-card h4{font-size:.82rem;color:#172337;line-height:1.2;min-height:1.2em;max-height:2.4em;overflow:hidden;margin-bottom:4px;}
.ecf-price{font-weight:800;color:#111827;font-size:.95rem;}
.ecf-price del{color:#94a3b8;font-weight:400;font-size:.78rem;margin-left:4px;}
.ecf-view{margin-top:6px;width:100%;border:0;border-radius:8px;background:#ffce12;color:#172337;font-weight:800;padding:6px;cursor:pointer;font-size:.8rem;}
.ecf-view:hover{background:#ffd84a;}

/* product-form select matches its inputs */
.addr-form-grid select{width:100%;padding:12px;margin:0;background:#fff;border:1px solid rgba(15,23,42,.18);border-radius:8px;color:#172337;-webkit-text-fill-color:#172337;font-size:.9rem;}
.addr-form-grid select:focus{outline:none;border-color:#2874f0;}

@media(max-width:768px){
.ecf-card{width:78%;min-width:0;}
.ec-brand-text{font-size:1.05rem;}
.ec-brand-ico{width:26px;height:26px;}
.ec-tools-right{justify-content:center;}
.nav-loc-col small{display:none;}

/* Phone nav: hamburger left, logo centered on its own line; the
   Location/Membership/Profile row sits below the logo, above the search. */
.nav-row-1{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:8px;row-gap:10px;}
.menu-toggle{position:static;grid-column:1;}
.nav-logo.ec-brand{grid-column:2;justify-self:center;margin:0;}
.nav-actions{grid-column:1 / -1;justify-content:center;margin-left:0;gap:8px;width:100%;flex-wrap:nowrap;}
/* All three pills share one equal width so they look identical. */
.nav-actions > .nav-loc,
.nav-actions > .nav-icon-btn,
.nav-actions > .nav-profile,
.nav-actions > .nav-cta{flex:1 1 0;min-width:0;max-width:none;padding:0 8px;font-size:.72rem;height:38px;}
.nav-actions > .nav-profile{padding:0 8px;gap:6px;}
.nav-loc-col b,.nav-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;}
.nav-icon-btn .lbl{font-size:.72rem;}
}
/* ===== Order list cards + delivery tracking (Order Details page) ===== */
.acct-order{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #ececec;border-radius:12px;padding:12px;margin-bottom:10px;cursor:pointer;transition:box-shadow .15s,border-color .15s;}
.acct-order:hover{box-shadow:0 4px 14px rgba(0,0,0,.07);border-color:#dcdcdc;}
.acct-order-thumb{width:56px;height:56px;border-radius:10px;background:#f5f5f5;flex:0 0 auto;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.acct-order-thumb img{width:100%;height:100%;object-fit:cover;}
.acct-order-thumb-ph{font-size:26px;}
.acct-order-info{flex:1 1 auto;min-width:0;}
.acct-order-name{font-weight:600;font-size:.92rem;color:#172337;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.acct-order-status{font-size:.82rem;color:#2f6b22;margin:2px 0;display:flex;align-items:center;gap:6px;}
.acct-order-meta{font-size:.74rem;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.acct-order-chevron{color:#bbb;font-size:1.4rem;flex:0 0 auto;}
.acct-status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:#999;flex:0 0 auto;}
.acct-status-dot.status-ordered{background:#b8893a;}
.acct-status-dot.status-shipped{background:#2f6b22;}
.acct-status-dot.status-out_for_delivery{background:#2f6b22;}
.acct-status-dot.status-delivered{background:#1f9d55;}
.acct-status-dot.status-cancelled{background:#c0392b;}

.od-title{font-size:1.05rem;text-align:center;margin:6px 0 14px;color:#172337;}
.od-head{display:flex;align-items:center;gap:8px;font-size:.95rem;color:#172337;margin-bottom:12px;}
.od-card{background:#fff;border:1px solid #ececec;border-radius:12px;padding:14px;margin-bottom:12px;}
.od-h{margin:0 0 12px;font-size:.85rem;text-transform:uppercase;letter-spacing:.4px;color:#888;}
.od-item{display:flex;gap:12px;align-items:center;padding:6px 0;}
.od-item-img{width:52px;height:52px;border-radius:8px;background:#f5f5f5;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.od-item-img img{width:100%;height:100%;object-fit:cover;}
.od-item-ph{font-size:24px;}
.od-item-info strong{display:block;font-size:.9rem;color:#172337;}
.od-item-info small{color:#888;font-size:.78rem;}

/* Vertical tracking timeline */
.track-line{position:relative;padding-left:6px;}
.track-step{display:flex;gap:12px;position:relative;padding-bottom:20px;}
.track-step:last-child{padding-bottom:0;}
.track-step::before{content:"";position:absolute;left:9px;top:20px;bottom:0;width:2px;background:#e3e3e3;}
.track-step:last-child::before{display:none;}
.track-step.done::before{background:#1f9d55;}
.track-dot{width:20px;height:20px;border-radius:50%;background:#e3e3e3;color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;z-index:1;}
.track-step.done .track-dot{background:#1f9d55;}
.track-step.active .track-dot{box-shadow:0 0 0 4px rgba(31,157,85,.18);}
.track-info strong{display:block;font-size:.9rem;color:#172337;}
.track-step:not(.done) .track-info strong{color:#999;}
.track-info small{color:#888;font-size:.78rem;}
.track-line.cancelled .track-dot{background:#c0392b;}
.track-line.cancelled .track-step::before{background:#e3e3e3;}
.od-courier{margin-top:12px;font-size:.82rem;color:#555;border-top:1px dashed #eee;padding-top:10px;}

.od-addr{font-size:.85rem;color:#444;line-height:1.5;margin:0;}
.od-bill{display:flex;justify-content:space-between;font-size:.85rem;color:#555;padding:4px 0;}
.od-bill.total{border-top:1px solid #eee;margin-top:6px;padding-top:8px;font-weight:700;color:#172337;}

.od-help-btn{width:100%;background:#fff;border:1px solid #d6b36a;color:#b8893a;border-radius:12px;padding:13px;font-weight:600;cursor:pointer;margin-bottom:12px;}
.od-help-btn:hover{background:#fdf8ef;}
.od-receipt-btn{width:100%;background:#ffce12;border:1px solid #e8b800;color:#15130a;border-radius:12px;padding:13px;font-weight:700;cursor:pointer;margin:4px 0 16px;}
.od-receipt-btn:hover{background:#f5c400;}
.od-receipt-note{background:#fafafa;border:1px dashed #d8d8d8;color:#777;border-radius:12px;padding:12px 14px;font-size:.85rem;text-align:center;margin:4px 0 16px;}
.od-help-panel{background:#fff;border:1px solid #ececec;border-radius:12px;padding:12px;margin-bottom:20px;}
.od-help-intro{font-size:.8rem;color:#888;margin:0 0 8px;}
.od-faq{border-bottom:1px solid #f0f0f0;}
.od-faq:last-child{border-bottom:none;}
.od-faq-q{width:100%;text-align:left;background:none;border:none;padding:11px 4px;font-size:.88rem;color:#172337;cursor:pointer;font-weight:500;}
.od-faq-q.open{color:#b8893a;}
.od-faq-a{padding:0 4px 12px;font-size:.84rem;color:#555;line-height:1.5;}

/* ===== Admin: order fulfilment form ===== */
.adm-ord-amt{margin-left:auto;font-weight:700;color:#172337;}
.adm-ord-form{display:flex;flex-direction:column;gap:6px;margin-top:10px;}
.adm-ord-form select,.adm-ord-form input{padding:8px 10px;border:1px solid #ddd;border-radius:8px;font-size:.85rem;}
.adm-ord-save{align-self:flex-start;}

/* ===== Cart "Highly Recommended" membership suggestion ===== */
.suggestion-card.suggestion-membership{border:1.5px solid #d6b36a;background:linear-gradient(180deg,#fffdf7,#fff);position:relative;}
.suggestion-tag{display:inline-block;background:#d6b36a;color:#172337;font-size:.68rem;font-weight:700;letter-spacing:.3px;padding:3px 9px;border-radius:999px;margin-bottom:6px;text-transform:uppercase;}
.suggestion-card.suggestion-membership .suggestion-btn{background:#172337;color:#fff;}

/* ===== Order page: "Recommended for you" ===== */
.od-recos{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.od-reco{display:flex;flex-direction:column;gap:4px;background:#fafafa;border:1px solid #eee;border-radius:10px;padding:8px;cursor:pointer;text-align:left;}
.od-reco:hover{border-color:#d6b36a;}
.od-reco-img{width:100%;height:90px;border-radius:8px;background:#f0f0f0;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.od-reco-img img{width:100%;height:100%;object-fit:cover;}
.od-reco-name{font-size:.82rem;color:#172337;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.od-reco-price{font-size:.85rem;font-weight:700;color:#172337;}
@media(min-width:600px){.od-recos{grid-template-columns:repeat(4,1fr);}}

/* ===== Search bar + category strip belong to the STORE page only ===== */
body:not([data-page="store"]) .nav-row-2,
body:not([data-page="store"]) .nav-row-3 { display: none; }

/* ===== Wallet page: keep only the EarnCart logo (left) + Profile (right) ===== */
body[data-page="wallet"] #navMembership,
body[data-page="wallet"] #navWishIcon,
body[data-page="wallet"] #navCartIcon { display: none; }

/* ===== Top-right icon buttons (search + cart) ===== */
.nav-icon-only{position:relative;background:none;border:none;padding:6px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;}
.nav-cart-badge{position:absolute;top:-2px;right:-2px;background:#d6b36a;color:#172337;font-size:.62rem;font-weight:700;min-width:16px;height:16px;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 4px;}

/* ===== Today's Deal: discount message below the card ===== */
.ecf-deal-msg{font-size:.72rem;font-weight:700;color:#c0392b;margin:2px 0 6px;}

/* ===== Account: clickable profile header + quick actions ===== */
.acct-head-btn{width:100%;display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #ececec;border-radius:14px;padding:14px;cursor:pointer;text-align:left;}
.acct-head-btn:hover{border-color:#d6b36a;}
.acct-head-btn .acct-avatar{font-size:30px;display:flex;align-items:center;justify-content:center;width:54px;height:54px;background:#f5f0e3;border-radius:50%;flex:0 0 auto;}
.acct-head-btn .acct-id{flex:1 1 auto;min-width:0;}
.acct-chevron{color:#bbb;font-size:1.6rem;flex:0 0 auto;}
.acct-quick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 4px;}
.acct-quick-btn{display:flex;align-items:center;gap:8px;justify-content:center;background:#fff;border:1px solid #ececec;border-radius:12px;padding:13px;font-weight:600;color:#172337;cursor:pointer;font-size:.9rem;}
.acct-quick-btn:hover{border-color:#d6b36a;}
.acct-quick-btn .aq-ico{font-size:1.1rem;}
.acct-logout-bottom{display:block;width:100%;margin-top:20px;}

/* ===== Edit Profile page ===== */
.ep-title{font-size:1.1rem;text-align:center;margin:6px 0 14px;color:#172337;}
.ep-tabs{display:flex;gap:6px;border-bottom:1px solid #eee;margin-bottom:18px;}
.ep-tab{background:none;border:none;padding:10px 14px;font-size:.92rem;color:#888;cursor:pointer;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-1px;}
.ep-tab.active{color:#b8893a;border-bottom-color:#b8893a;}
.ep-panel.is-hidden{display:none;}
.ep-avatar-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:18px;}
.ep-avatar{width:88px;height:88px;border-radius:50%;background:#f5f0e3;display:flex;align-items:center;justify-content:center;font-size:46px;}
.ep-avatar-edit{background:none;border:none;color:#b8893a;font-weight:700;cursor:pointer;font-size:.9rem;}
.ep-emoji-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:0 0 18px;background:#fafafa;border:1px solid #eee;border-radius:12px;padding:12px;}
.ep-emoji-grid.is-hidden{display:none;}
.ep-emoji{background:#fff;border:1px solid #eee;border-radius:10px;font-size:26px;padding:6px 0;cursor:pointer;}
.ep-emoji:hover{border-color:#d6b36a;background:#fdf8ef;}
.ep-label{display:block;font-size:.78rem;color:#888;margin:14px 0 4px;font-weight:600;}
.ep-input{width:100%;padding:11px 12px;border:1px solid #ddd;border-radius:10px;font-size:.95rem;background:#fff;color:#172337;}
.ep-input:disabled{background:#f5f5f5;color:#999;}
.ep-save{width:100%;margin-top:20px;}
.ep-danger{border:1px solid #f0c4c4;background:#fff8f8;border-radius:12px;padding:16px;}
.ep-danger h4{margin:0 0 6px;color:#c0392b;}
.ep-danger p{font-size:.85rem;color:#666;line-height:1.5;margin:0 0 14px;}
.ep-delete-btn{background:#c0392b;color:#fff;border:none;border-radius:10px;padding:12px 18px;font-weight:600;cursor:pointer;}
.ep-delete-btn:hover{background:#a93226;}

/* ===== Wishlist heart on product cards ===== */
.product-card .product-image{position:relative;}
.ec-card .product-image,.product-image{position:relative;}
/* Fixed 38px circle anchored to the TOP-RIGHT of the product image, on a
   semi-transparent white badge with a soft shadow. Navy outline heart by
   default; solid red/coral when wishlisted. Same everywhere (one component). */
.wish-btn{position:absolute;top:9px;right:9px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5;padding:0;line-height:1;box-shadow:0 2px 8px rgba(15,23,42,.18);-webkit-tap-highlight-color:transparent;transition:transform .12s;}
.wish-btn:active{transform:scale(.88);}
.wish-btn svg{width:20px;height:20px;display:block;pointer-events:none;}
.wish-btn svg path{fill:none;stroke:#2b2f3a;stroke-width:2;stroke-linejoin:round;}
.wish-btn.is-wished{background:#fff;}
.wish-btn.is-wished svg path{fill:#ef4444;stroke:#ef4444;}

/* ===== Wishlist page ===== */
.wish-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.wish-item{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid #ececec;border-radius:12px;padding:10px;min-width:0;}
.wish-item-img{width:100%;height:130px;border-radius:10px;background:#f5f5f5;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.wish-item-img img{width:100%;height:100%;object-fit:contain;}
.wish-item-info{min-width:0;}
.wish-item-info strong{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.85rem;line-height:1.25;color:#172337;}
.wish-item-price{display:block;margin-top:3px;font-weight:700;color:#172337;font-size:.9rem;}
.wish-item-actions{display:flex;gap:6px;margin-top:auto;}
.wish-buy{flex:1;background:#172337;color:#fff;border:none;border-radius:8px;padding:8px 6px;font-size:.78rem;font-weight:600;cursor:pointer;transition:background .15s;}
.wish-buy.added{background:#1a7f37;}
.wish-remove{flex:1;background:none;border:1px solid #ddd;border-radius:8px;padding:8px 6px;font-size:.78rem;color:#888;cursor:pointer;}

/* ===== Account: legal/policies link row ===== */
.acct-links{margin-top:16px;}
.acct-link-row{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #ececec;border-radius:12px;padding:14px;color:#172337;text-decoration:none;font-weight:600;font-size:.9rem;}
.acct-link-row:hover{border-color:#d6b36a;}

/* ===== Uniform top-right nav items (Membership, Wishlist, Cart, Profile/Login) ===== */
.nav-actions{display:flex;align-items:center;gap:2px;}
.nav-actions .nav-item{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:none;color:var(--gold-light);cursor:pointer;padding:4px 7px;border-radius:10px;min-width:52px;}
.nav-actions .nav-item:hover{background:rgba(244,183,63,.12);}
.nav-actions .nav-item .ni-ico{position:relative;font-size:19px;line-height:1;display:inline-flex;align-items:center;justify-content:center;height:24px;color:var(--gold-light);}
.nav-actions .nav-item .ni-lbl{font-size:.62rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;color:var(--gold-light);max-width:72px;overflow:hidden;text-overflow:ellipsis;}
.nav-actions .nav-cart-badge{position:absolute;top:-7px;right:-9px;background:var(--gold);color:#0a0a0f;font-size:.58rem;font-weight:800;min-width:15px;height:15px;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 3px;}
.nav-actions .nav-item.is-wished .ni-ico{color:#e0245e;}

/* ===== Notifications: bell badge + slide-in panel (website + app) ===== */
.nav-notif-icon .ni-ico{position:relative;}
.nav-notif-badge{position:absolute;top:-7px;right:-9px;background:#e0245e;color:#fff;font-size:.58rem;font-weight:800;min-width:15px;height:15px;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 3px;}
.notif-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:1400;}
.notif-panel{position:fixed;top:0;right:0;height:100%;width:min(380px,90vw);background:#fff;z-index:1401;box-shadow:-8px 0 30px rgba(0,0,0,.2);display:flex;flex-direction:column;}
/* The explicit display rules above beat the UA [hidden]{display:none}, so make
   the hidden attribute win — otherwise the panel/overlay/badge never hide. */
.notif-panel[hidden], .notif-overlay[hidden], .nav-notif-badge[hidden]{ display:none !important; }
.notif-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #eee;flex:0 0 auto;}
.notif-head b{font-size:1.05rem;color:#172337;}
.notif-close{background:none;border:none;font-size:1.2rem;color:#888;cursor:pointer;line-height:1;padding:4px;}
.notif-list{flex:1 1 auto;overflow-y:auto;padding:8px 0;}
.notif-item{display:flex;gap:12px;padding:14px 18px;border-bottom:1px solid #f3f3f3;align-items:flex-start;}
.notif-item.is-unread{background:#fdf9ee;}
.notif-item .nti-ico{font-size:1.3rem;flex:0 0 auto;line-height:1.2;}
.notif-item .nti-body{flex:1 1 auto;min-width:0;}
.notif-item .nti-title{font-size:.9rem;font-weight:700;color:#172337;margin:0 0 2px;}
.notif-item .nti-sub{font-size:.78rem;color:#777;margin:0;}
.notif-item .nti-time{font-size:.7rem;color:#aaa;margin-top:3px;}
.notif-empty{text-align:center;color:#999;padding:40px 20px;font-size:.9rem;}

/* ===== Membership: app-only trims (website keeps the full copy) ===== */
html.is-app #membership .clarity-note,
html.is-app #membership .mem-faq{ display:none !important; }

/* ===== APP Account: grouped layout + light palette (image spec) — app-only.
   The .acct-app block is hidden everywhere and only shown inside the app, so
   the website account page is untouched. First screen of the palette rollout. ===== */
.acct-app{ display:none; }
html.is-app .acct-app{ display:block; }
html.is-app #account .acct-web-only{ display:none !important; }

html.is-app #account{ background:var(--ec-bg); color:var(--ec-navy); }
html.is-app #account .category-section-title{ color:var(--ec-navy); }
html.is-app #account .acct-head-btn{ background:#fff; border-color:transparent; box-shadow:0 2px 10px rgba(191,199,206,.5); }
html.is-app #account .acct-head-btn h2,
html.is-app #account .acct-email{ color:var(--ec-navy); }

.acct-cta-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0 6px; }
.acct-cta{ display:flex; align-items:center; justify-content:center; gap:8px; background:#fff; color:var(--ec-navy); border:none; border-radius:14px; padding:14px; font-weight:700; font-size:.92rem; cursor:pointer; box-shadow:0 2px 10px rgba(191,199,206,.5); }
.acct-cta .acta-ico{ font-size:1.15rem; }

.acct-group-label{ font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ec-blue); margin:18px 4px 8px; }
.acct-group{ background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 2px 10px rgba(191,199,206,.5); }
.acct-row{ display:flex; align-items:center; gap:13px; width:100%; background:none; border:none; border-bottom:1px solid #eef0f2; padding:14px 16px; cursor:pointer; text-align:left; font-size:.95rem; font-weight:600; color:var(--ec-navy); }
.acct-group .acct-row:last-child{ border-bottom:none; }
.acct-row .ar-txt{ flex:1 1 auto; min-width:0; }
.acct-row .ar-val{ color:var(--ec-blue); font-weight:800; margin-right:6px; }
.acct-row .acct-chevron{ color:#bcc4cc; font-size:1.5rem; }
.acct-row-logout{ color:#c0392b; }
.ar-ico{ width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:1.15rem; flex:0 0 auto; color:#fff; }
.ar-ico.ic-blue{ background:var(--ic-blue); }
.ar-ico.ic-mint{ background:var(--ic-mint); }
.ar-ico.ic-pink{ background:var(--ic-pink); }
.ar-ico.ic-lav{ background:var(--ic-lav); }
.ar-ico.ic-sky{ background:var(--ic-sky); }
.ar-ico.ic-gold{ background:var(--ec-gold2); }
.ar-ico.ic-peach{ background:var(--ic-peach); }
.acct-row-logout .ar-ico{ background:#f3d7d4; color:#c0392b; }

/* Product mini-grid (My Viewed / My Shared) */
html.is-app #shared-products, html.is-app #viewed-products, html.is-app #payments{ background:var(--ec-bg); }
html.is-app #payments .od-title, html.is-app #shared-products .od-title, html.is-app #viewed-products .od-title{ color:var(--ec-navy); }
.pmini-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.pmini{ background:#fff; border:none; border-radius:14px; overflow:hidden; text-align:left; cursor:pointer; box-shadow:0 2px 10px rgba(191,199,206,.4); padding-bottom:8px; }
.pmini-thumb{ width:100%; aspect-ratio:1/1; background:#f4f4f4; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.pmini-thumb img{ width:100%; height:100%; object-fit:cover; }
.pmini-noimg{ font-size:1.8rem; }
.pmini-name{ font-size:.82rem; font-weight:600; color:var(--ec-navy); padding:8px 10px 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pmini-price{ font-size:.9rem; font-weight:800; color:var(--ec-navy); padding:2px 10px 0; }

/* Payment & Refund */
.pay-tabs{ display:flex; gap:8px; margin:4px 0 14px; overflow-x:auto; }
.pay-tab{ flex:0 0 auto; background:#fff; border:1px solid #e3e6e9; color:var(--ec-blue); border-radius:999px; padding:7px 16px; font-weight:700; font-size:.85rem; cursor:pointer; }
.pay-tab.active{ background:var(--ec-navy); color:#fff; border-color:var(--ec-navy); }
.pay-item{ display:flex; align-items:center; gap:12px; background:#fff; border-radius:14px; padding:13px 14px; margin-bottom:10px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.pay-ico{ width:38px; height:38px; border-radius:10px; background:var(--ec-bg); display:flex; align-items:center; justify-content:center; font-size:1.15rem; flex:0 0 auto; }
.pay-body{ flex:1 1 auto; min-width:0; }
.pay-title{ font-size:.9rem; font-weight:700; color:var(--ec-navy); }
.pay-sub{ font-size:.78rem; color:var(--ec-blue); }
.pay-date{ font-size:.72rem; color:#9aa4ad; margin-top:2px; }
.pay-right{ text-align:right; flex:0 0 auto; }
.pay-amt{ font-size:.95rem; font-weight:800; color:var(--ec-navy); }
.pay-amt-in{ color:#1e9e5a; }
.pay-amt-out{ color:#c0392b; }
.pay-badge{ display:inline-block; font-size:.64rem; font-weight:700; text-transform:uppercase; padding:2px 7px; border-radius:999px; margin-top:3px; }
.pay-paid{ background:#e5f4ec; color:#1e9e5a; }
.pay-refunded, .pay-refund{ background:#fdeceb; color:#c0392b; }
.pay-credit{ background:#e5f4ec; color:#1e9e5a; }
.pay-debit{ background:#fdeceb; color:#c0392b; }

/* ===== Become a Seller — entry link on login pages + seller-page base ===== */
.seller-cta-note{ display:none; }                 /* app-only, website untouched */
html.is-app .seller-cta-note{ display:block; margin-top:6px; }
.seller-cta-link{ display:inline-block; font-weight:800; color:var(--gold-light); text-decoration:none; border:1px dashed var(--gold); border-radius:10px; padding:9px 16px; }
.seller-login-hint{ background:rgba(244,183,63,.14); border:1px solid var(--gold); color:var(--gold-light); border-radius:10px; padding:10px 12px; font-size:.85rem; line-height:1.5; margin:0 0 12px; }

/* ===== Admin: Website/App top switch — matches the existing admin tabs
   (white box, slate text, dark-navy active). Not yellow, not white-on-white. ===== */
.admin-switch{ display:flex; gap:8px; margin:0 0 16px; }
.admin-switch-btn{ flex:1; padding:12px; border:1px solid rgba(15,23,42,.1); border-radius:10px; background:#fff; color:#475569; font-weight:800; font-size:.95rem; cursor:pointer; box-shadow:0 4px 12px rgba(15,23,42,.05); }
.admin-switch-btn:hover{ background:#f1f5f9; color:#172337; }
.admin-switch-btn.active{ background:linear-gradient(135deg,#172337,#2c3e63); color:#fff; border-color:#172337; box-shadow:0 5px 14px rgba(23,35,55,.28); }

/* ===== Admin · App section cards — light admin theme (matches the panel) ===== */
.aa-hint{ font-size:.8rem; color:#64748b; margin:0 0 12px; }
.aa-card{ display:flex; gap:12px; align-items:flex-start; background:#fff; border:1px solid rgba(15,23,42,.1); border-radius:12px; padding:12px 14px; margin-bottom:10px; box-shadow:0 4px 12px rgba(15,23,42,.05); }
.aa-thumb{ width:52px; height:52px; border-radius:10px; overflow:hidden; background:#f1f5f9; display:flex; align-items:center; justify-content:center; font-size:1.4rem; flex:0 0 auto; }
.aa-thumb img{ width:100%; height:100%; object-fit:cover; }
.aa-info{ flex:1; min-width:0; }
.aa-info b{ color:#172337; font-size:.92rem; }
.aa-sub{ color:#64748b; font-size:.78rem; margin-top:2px; word-break:break-word; }
.aa-actions{ display:flex; gap:8px; margin-top:9px; }
.aa-btn{ border:0; border-radius:8px; padding:7px 15px; font-weight:800; font-size:.78rem; cursor:pointer; }
.aa-btn.ok{ background:#16a34a; color:#fff; } .aa-btn.rej{ background:#dc2626; color:#fff; }
.aa-badge{ display:inline-block; font-size:.62rem; font-weight:800; text-transform:uppercase; padding:2px 8px; border-radius:999px; margin-top:7px; }
.aa-badge.warn{ background:#fef3c7; color:#b45309; } .aa-badge.ok{ background:#dcfce7; color:#15803d; } .aa-badge.err{ background:#fee2e2; color:#b91c1c; }
.aa-empty{ text-align:center; color:#94a3b8; padding:40px 20px; }
/* Volume 6 · 6A — AI QC pre-review chip + reasons (advice only) */
.aa-ai{ margin-top:8px; border-radius:10px; padding:8px 10px; font-size:.76rem; }
.aa-ai.good{ background:#f0fdf4; border:1px solid #bbf7d0; }
.aa-ai.check{ background:#fffbeb; border:1px solid #fde68a; }
.aa-ai.risky{ background:#fef2f2; border:1px solid #fecaca; }
.aa-ai-chip{ display:inline-block; font-size:.64rem; font-weight:800; text-transform:uppercase; padding:2px 9px; border-radius:999px; }
.aa-ai.good .aa-ai-chip{ background:#dcfce7; color:#15803d; }
.aa-ai.check .aa-ai-chip{ background:#fef3c7; color:#b45309; }
.aa-ai.risky .aa-ai-chip{ background:#fee2e2; color:#b91c1c; }
.aa-ai-reasons{ margin:6px 0 0; padding-left:16px; color:#475569; }
.aa-ai-reasons li{ margin:2px 0; line-height:1.35; word-break:break-word; }
.aa-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.aa-tile{ background:#fff; border:1px solid rgba(15,23,42,.1); border-radius:12px; padding:18px; text-align:center; box-shadow:0 4px 12px rgba(15,23,42,.05); }
.aa-tile b{ display:block; font-size:1.55rem; color:#172337; } .aa-tile span{ font-size:.74rem; color:#64748b; }
.aa-sec-title{ font-weight:800; color:#172337; font-size:.95rem; }
.aa-toolbar{ display:flex; justify-content:flex-end; margin:0 0 12px; }
.aa-toolbar label{ font-size:.78rem; color:#64748b; font-weight:700; display:flex; align-items:center; gap:8px; }
.aa-sort{ border:1px solid rgba(15,23,42,.15); border-radius:8px; padding:7px 10px; font-weight:700; font-size:.8rem; color:#172337; background:#fff; cursor:pointer; }
.seller-cta-link:hover{ background:rgba(244,183,63,.12); }
html.is-app .seller-page{ background:var(--ec-bg); }
html.is-app .seller-page .od-title{ color:var(--ec-navy); }

/* ===== Become a Seller — full screen styles (TESTING build, app-only) ===== */
.seller-wrap{ padding:16px 16px 96px; }
.seller-page .od-title{ margin:4px 0 12px; font-size:1.3rem; }

/* shared inputs / buttons */
.seller-inp{ width:100%; box-sizing:border-box; margin:6px 0 12px; padding:12px 14px; border:1px solid #dbe0e6; border-radius:12px; font-size:.95rem; color:var(--ec-navy); background:#fff; font-family:inherit; }
.seller-ta{ min-height:80px; resize:vertical; }
.seller-lbl{ display:block; font-size:.8rem; font-weight:700; color:var(--ec-blue); margin:6px 2px 0; }
.seller-primary{ width:100%; padding:14px; border:none; border-radius:12px; background:var(--ec-navy); color:#fff; font-weight:800; font-size:.98rem; cursor:pointer; }
.seller-primary:disabled{ opacity:.45; }
.seller-ghost-btn{ width:100%; padding:12px; border:1px solid var(--ec-navy); border-radius:12px; background:#fff; color:var(--ec-navy); font-weight:700; cursor:pointer; margin-bottom:12px; }
/* Onboarding payout-method switch (Volume 2 · 2A) */
.seller-pm-switch{ display:flex; gap:10px; }
.seller-pm-switch .seller-ghost-btn{ flex:1; }
.seller-pm-switch .seller-ghost-btn.active{ background:var(--ec-navy); color:#fff; }
.seller-note{ font-size:.82rem; margin:2px 0 10px; }
.seller-note.ok{ color:#1e9e5a; } .seller-note.warn{ color:#c98a00; }

/* onboarding */
.seller-onb{ padding:14px 16px 40px; background:var(--ec-bg); min-height:100vh; }
.seller-onb-top{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.seller-onb-back{ background:none; border:0; font-size:1.9rem; line-height:1; color:var(--ec-navy); cursor:pointer; }
.seller-progress{ flex:1; height:6px; background:#e3e8ee; border-radius:999px; overflow:hidden; }
.seller-progress-bar{ height:100%; width:20%; background:var(--ec-gold2); transition:width .25s; }
.seller-onb-step{ font-size:.8rem; font-weight:700; color:var(--ec-blue); }
.onb-h{ font-size:1.25rem; color:var(--ec-navy); margin:4px 0 6px; }
.onb-p{ font-size:.88rem; color:var(--ec-blue); margin:0 0 16px; line-height:1.5; }

/* seller home = INSIGHTS */
.seller-home-head h2{ font-size:1.4rem; color:var(--ec-navy); margin:0; }
.seller-sub{ color:var(--ec-blue); font-size:.9rem; margin:2px 0 16px; }

/* ---- redirect cards into the seller WEBSITE ------------------------------
   The app can't change store data, so these two cards are the bridge. They're
   the first thing on Insights and the top of the seller Menu. */
.seller-web-cards{ display:grid; gap:10px; margin:0 0 18px; }
.swc-card{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  background:#fff; border:1px solid #e6eaee; border-radius:16px; padding:14px;
  cursor:pointer; box-shadow:0 2px 10px rgba(191,199,206,.45); font-family:inherit;
}
.swc-card:active{ transform:scale(.99); }
.swc-card.primary{ background:var(--ec-navy); border-color:var(--ec-navy); }
.swc-card.primary .swc-body b{ color:#fff; }
.swc-card.primary .swc-body small{ color:rgba(255,255,255,.78); }
.swc-card.primary .swc-go{ background:var(--ec-gold2); color:#3a2c14; }
.swc-ico{ font-size:1.5rem; flex-shrink:0; }
.swc-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.swc-body b{ font-size:.92rem; color:var(--ec-navy); line-height:1.25; }
.swc-body small{ font-size:.74rem; color:var(--ec-blue); line-height:1.4; }
.swc-go{
  flex-shrink:0; font-size:.72rem; font-weight:800; border-radius:999px;
  padding:6px 12px; background:#f1f4f7; color:var(--ec-navy);
}
.seller-web-hint{ font-size:.72rem; color:var(--ec-blue); text-align:center; margin:2px 0 0; }
.seller-menu-web{ margin-bottom:6px; }

/* Slim inline "do this on the website" bar, used above read-only lists. */
.seller-inline-cta{
  display:flex; align-items:center; gap:8px; width:100%; text-align:left;
  background:rgba(31,59,92,.06); border:1px dashed rgba(31,59,92,.28);
  border-radius:12px; padding:11px 13px; margin:0 0 14px; cursor:pointer;
  font-family:inherit; font-size:.8rem; font-weight:700; color:var(--ec-navy);
}
.seller-inline-cta span{ margin-left:auto; font-size:.72rem; font-weight:800; color:var(--ec-blue); }

/* ---- KPI tile deltas ---- */
.sdt-sub{ display:block; font-size:.68rem; font-weight:800; margin-top:3px; color:var(--ec-blue); }
.sdt-sub.up{ color:#1e9e5a; }
.sdt-sub.warn{ color:#c0392b; }

/* ---- AI business coach ---- */
.seller-ai{
  background:linear-gradient(135deg,rgba(244,183,63,.14),#fff 62%);
  border:1px solid rgba(205,168,126,.5); border-radius:16px;
  padding:15px; margin:4px 0 18px; box-shadow:0 2px 10px rgba(191,199,206,.4);
}
.sai-head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.sai-head b{ font-size:.9rem; color:var(--ec-navy); }
.sai-ico{ font-size:1.1rem; }
.sai-lead{ font-size:.88rem; color:var(--ec-navy); font-weight:600; line-height:1.5; margin:0 0 10px; }
.sai-tip{ background:#fff; border-radius:12px; padding:11px 12px; margin-bottom:8px; box-shadow:0 1px 5px rgba(191,199,206,.4); }
.sai-tip b{ font-size:.83rem; color:var(--ec-navy); display:block; }
.sai-tip p{ font-size:.78rem; color:var(--ec-blue); line-height:1.45; margin:3px 0 0; }
.sai-foot{ font-size:.68rem; color:#9aa4ad; margin:2px 0 0; }

/* ---- rule-based suggestions ---- */
.seller-sug-list{ display:grid; gap:9px; margin-bottom:18px; }
.seller-sug{
  display:flex; gap:11px; background:#fff; border-radius:13px; padding:12px;
  border-left:4px solid #dbe0e6; box-shadow:0 2px 8px rgba(191,199,206,.4);
}
.seller-sug.warn{ border-left-color:#e07a5f; }
.seller-sug.good{ border-left-color:#1e9e5a; }
.seller-sug.tip{ border-left-color:var(--ec-gold2); }
.ssg-ico{ font-size:1.15rem; line-height:1.3; flex-shrink:0; }
.ssg-body{ min-width:0; }
.ssg-body b{ font-size:.85rem; color:var(--ec-navy); display:block; line-height:1.3; }
.ssg-body p{ font-size:.78rem; color:var(--ec-blue); line-height:1.45; margin:3px 0 0; }

/* ---- weekday chart ---- */
.seller-wchart{
  display:flex; align-items:flex-end; gap:6px; height:120px;
  background:#fff; border-radius:14px; padding:12px 10px 8px;
  box-shadow:0 2px 10px rgba(191,199,206,.45); margin-bottom:6px;
}
.wc-col{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; height:100%; }
.wc-track{ flex:1; width:100%; display:flex; align-items:flex-end; }
.wc-bar{ width:100%; border-radius:6px 6px 2px 2px; background:#c9d3de; min-height:2px; }
.wc-bar.best{ background:var(--ec-navy); }
.wc-lbl{ font-size:.64rem; font-weight:800; color:var(--ec-blue); }

/* ---- best sellers ---- */
.seller-top-list{ display:grid; gap:10px; margin-bottom:6px; }
.stp{ display:flex; gap:11px; align-items:center; background:#fff; border-radius:13px; padding:12px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.stp-rank{
  width:24px; height:24px; border-radius:50%; flex-shrink:0;
  background:var(--ec-navy); color:#fff; font-size:.72rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
}
.stp-body{ flex:1; min-width:0; }
.stp-body b{ font-size:.83rem; color:var(--ec-navy); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stp-bar{ height:6px; border-radius:4px; background:#eef1f4; margin:6px 0 4px; overflow:hidden; }
.stp-bar > div{ height:100%; border-radius:4px; background:var(--ec-gold2); }
.stp-body small{ font-size:.72rem; color:var(--ec-blue); font-weight:700; }

/* ---- health check ---- */
.seller-health{ background:#fff; border-radius:14px; padding:4px 14px; box-shadow:0 2px 10px rgba(191,199,206,.45); margin-bottom:6px; }
.shl-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid #f0f2f5; font-size:.83rem; color:var(--ec-blue); }
.shl-row:last-child{ border-bottom:none; }
.shl-row b{ color:var(--ec-navy); font-weight:800; }
.shl-row b.good{ color:#1e9e5a; }
.shl-row b.bad{ color:#c0392b; }

/* read-only warning line on a product card */
.seller-prod-info .seller-card-sub.warn{ color:#c0392b; font-weight:700; }

/* ============================================================================
   DESKTOP (>1024px): the SAME app design, scaled up to a desktop width.
   Center content in a container, widen product grids, float the bottom nav.
   ========================================================================== */
@media (min-width: 1025px){
  /* top nav content centered */
  html.is-app nav .nav-row-1,
  html.is-app nav .nav-row-2,
  html.is-app nav .nav-row-3{ max-width:1200px; margin-left:auto; margin-right:auto; width:100%; }
  html.is-app .nav-cat-strip{ justify-content:space-between !important; max-width:1200px; margin:0 auto; }

  /* main page content centered in a desktop container */
  html.is-app .app-page{ padding-left:32px; padding-right:32px; }
  html.is-app .shop-content,
  html.is-app .ec-store,
  html.is-app .category-wrap,
  html.is-app .seller-wrap,
  html.is-app .seller-onb,
  html.is-app #membership > *,
  html.is-app #policies .policy-panel,
  html.is-app .login-box{ max-width:1200px; margin-left:auto; margin-right:auto; }

  /* product grids -> 5 columns; small 2-col grids -> 4 */
  html.is-app .ec-grid,
  html.is-app .catp-grid,
  html.is-app #catProducts .ec-grid,
  html.is-app #catProducts .catp-grid,
  html.is-app .pmini-grid{ grid-template-columns:repeat(5,1fr) !important; }
  html.is-app .membership-grid,
  html.is-app #membership .proof-strip{ grid-template-columns:repeat(4,1fr) !important; }
  /* seller insights: KPI tiles + suggestions spread out on a wide screen */
  html.is-app .seller-dash-grid{ grid-template-columns:repeat(4,1fr) !important; }
  html.is-app .seller-web-cards,
  html.is-app .seller-sug-list{ grid-template-columns:1fr 1fr; }
  html.is-app #membership .proof-strip .proof-card:last-child{ grid-column:auto; }

  /* bottom navs -> centered floating bar (not a full-width strip) */
  html.is-app .app-tabbar,
  html.is-app body[data-page^="seller-"] .seller-tabbar{
    max-width:600px !important; left:50% !important; right:auto !important;
    transform:translateX(-50%); border-radius:22px 22px 0 0;
    box-shadow:0 -8px 30px rgba(15,23,42,.14);
  }

  /* a touch more breathing room on big screens */
  html.is-app .seller-wrap{ padding:22px 22px 96px; }

  /* ---- desktop header: profile LEFT · EarnCart CENTER · icons RIGHT ---- */
  html.is-app nav .nav-row-1{ position:relative; min-height:56px; }
  html.is-app nav #navProfile,
  html.is-app nav #signInBtn{ position:absolute !important; left:0; top:50%; transform:translateY(-50%); order:0 !important; margin:0 !important; }
  html.is-app nav .nav-row-1 > .nav-logo{ display:inline-flex !important; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin:0; }
  html.is-app nav .nav-logo .ec-brand-text{ display:inline !important; background:none !important; -webkit-text-fill-color:var(--ec-navy) !important; color:var(--ec-navy) !important; font-size:1.3rem; }
  html.is-app nav .nav-actions{ margin-left:auto; }

  /* ---- search bar: make it clearly visible ---- */
  html.is-app nav .nav-search input{ border:1.5px solid #c3ccd6 !important; background:#fff !important; box-shadow:0 1px 4px rgba(15,23,42,.06); }
  html.is-app nav .nav-search input::placeholder{ color:#647084; }

  /* ---- bottom nav: much more visible (solid, bordered, strong shadow) ---- */
  html.is-app .app-tabbar,
  html.is-app body[data-page^="seller-"] .seller-tabbar{ background:#fff !important; border:1px solid #d5dde6; border-bottom:0; box-shadow:0 10px 44px rgba(15,23,42,.32) !important; }
  html.is-app .app-tab{ color:#48566b; }
  html.is-app .app-tab.active{ color:#d4a017; }
}

/* sub-tabs */
.seller-subtabs{ display:flex; gap:8px; overflow-x:auto; margin:2px 0 14px; -ms-overflow-style:none; scrollbar-width:none; }
.seller-subtabs::-webkit-scrollbar{ display:none; }
.seller-subtab{ flex:0 0 auto; background:#fff; border:1px solid #dbe0e6; color:var(--ec-blue); border-radius:999px; padding:7px 15px; font-weight:700; font-size:.82rem; cursor:pointer; }
.seller-subtab.active{ background:var(--ec-navy); color:#fff; border-color:var(--ec-navy); }

/* cards / lists / empty */
.seller-card{ display:flex; align-items:center; gap:12px; background:#fff; border-radius:12px; padding:13px 14px; margin-bottom:10px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.seller-card-main{ flex:1; min-width:0; }
.seller-card-main b{ color:var(--ec-navy); font-size:.92rem; }
.seller-card-sub{ font-size:.76rem; color:var(--ec-blue); margin-top:2px; }
.seller-card-amt{ font-weight:800; color:var(--ec-navy); }
.seller-empty{ text-align:center; color:#9aa4ad; padding:44px 20px; }
.seller-empty-ico{ font-size:2rem; display:block; margin-bottom:8px; }
/* seller orders (Slice 2C) */
.seller-ord-card{ align-items:flex-start; }
.seller-ord-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.seller-ord-chip{ display:inline-block; font-size:.64rem; font-weight:800; text-transform:uppercase; padding:2px 8px; border-radius:999px; background:#eef1f4; color:#647d97; }
.seller-ord-chip.st-ordered{ background:#e7effc; color:#2b6cb0; }
.seller-ord-chip.st-shipped, .seller-ord-chip.st-out_for_delivery{ background:#fff4e0; color:#c98a00; }
.seller-ord-chip.st-delivered{ background:#e5f4ec; color:#1e9e5a; }
.seller-ord-chip.st-cancelled, .seller-ord-chip.ret{ background:#fdeceb; color:#c0392b; }
.seller-ord-chip.cod{ background:#f3e8fd; color:#7d3cc9; }
.seller-ord-actions{ margin-top:9px; }
.seller-ord-btn{ background:var(--ec-navy); color:#fff; border:none; border-radius:9px; padding:8px 14px; font-size:.78rem; font-weight:700; cursor:pointer; }
.seller-ord-btn:disabled{ opacity:.6; }
/* seller finance + dashboard (Slice 2D) */
.seller-fin-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.seller-fin-tile{ background:#fff; border-radius:12px; padding:14px; box-shadow:0 2px 8px rgba(191,199,206,.4); display:flex; flex-direction:column; gap:4px; }
.seller-fin-tile b{ color:var(--ec-navy); font-size:1.05rem; }
.seller-fin-tile span{ font-size:.7rem; color:var(--ec-blue); font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.seller-fin-tile.ok b{ color:#1e9e5a; }
.seller-chart{ background:#fff; border-radius:12px; padding:16px 14px 10px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.sc-plot{ display:flex; align-items:flex-end; gap:2px; height:120px; border-bottom:1px solid #eef0f2; }
.sc-col{ flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; position:relative; }
.sc-bar{ width:100%; max-width:10px; background:var(--ec-navy); border-radius:4px 4px 0 0; }
.sc-peak{ position:absolute; top:-4px; font-size:.6rem; font-weight:800; color:var(--ec-navy); white-space:nowrap; z-index:1; }
.sc-x{ display:flex; justify-content:space-between; font-size:.68rem; color:var(--ec-blue); padding-top:6px; }
.seller-dash-break{ background:#fff; border-radius:12px; padding:6px 14px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.seller-dash-row{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid #f2f4f6; }
.seller-dash-row:last-child{ border-bottom:none; }
.seller-dash-row b{ color:var(--ec-navy); }
.seller-prod{ display:flex; gap:12px; background:#fff; border-radius:12px; padding:12px; margin-bottom:10px; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.seller-prod-img{ width:60px; height:60px; border-radius:10px; overflow:hidden; background:#f1f4f7; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.seller-prod-img img{ width:100%; height:100%; object-fit:cover; }
.seller-noimg{ font-size:1.4rem; }
.seller-prod-info{ flex:1; min-width:0; }
.seller-prod-info b{ color:var(--ec-navy); font-size:.9rem; }
.seller-badge{ display:inline-block; margin-top:6px; font-size:.64rem; font-weight:800; text-transform:uppercase; padding:2px 8px; border-radius:999px; }
.seller-badge.ok{ background:#e5f4ec; color:#1e9e5a; } .seller-badge.warn{ background:#fff4e0; color:#c98a00; }
.seller-badge.err{ background:#fdeceb; color:#c0392b; } .seller-badge.mut{ background:#eef1f4; color:#647d97; }
/* menu */
.seller-menu-head{ display:flex; align-items:center; gap:14px; background:#fff; border-radius:14px; padding:16px; box-shadow:0 2px 10px rgba(191,199,206,.5); margin-bottom:16px; }
.seller-store-avatar{ width:52px; height:52px; border-radius:50%; background:var(--ec-bg); display:flex; align-items:center; justify-content:center; font-size:1.6rem; flex:0 0 auto; }
.seller-store-id b{ color:var(--ec-navy); font-size:1.05rem; }
.seller-store-stats{ font-size:.76rem; color:var(--ec-blue); margin-top:3px; }
.seller-menu-lbl{ font-size:.76rem; font-weight:800; text-transform:uppercase; color:var(--ec-blue); margin:16px 4px 8px; letter-spacing:.04em; }
.seller-menu-grp{ background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.seller-menu-row{ display:flex; align-items:center; justify-content:space-between; width:100%; background:none; border:0; border-bottom:1px solid #eef0f2; padding:14px 16px; font-size:.92rem; font-weight:600; color:var(--ec-navy); cursor:pointer; text-align:left; }
.seller-menu-grp .seller-menu-row:last-child{ border-bottom:0; }
.seller-menu-row .acct-chevron{ color:#bcc4cc; font-size:1.4rem; }
.seller-soon{ font-size:.68rem; font-weight:700; color:#aeb6bf; }
.seller-logout{ width:100%; margin-top:18px; padding:14px; border:1px solid #e5b3ae; border-radius:12px; background:#fff; color:#c0392b; font-weight:800; cursor:pointer; }

/* screen headers (back chevron + title) */
.seller-cat-top{ display:flex; align-items:center; gap:8px; }
.seller-cat-top .od-title{ margin:0; }

/* KPI tiles */
.seller-dash-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:18px; }
.seller-dash-tile{ background:#fff; border-radius:14px; padding:18px; text-align:center; box-shadow:0 2px 8px rgba(191,199,206,.4); }
.seller-dash-tile b{ display:block; font-size:1.4rem; color:var(--ec-navy); }
.seller-dash-tile span{ font-size:.76rem; color:var(--ec-blue); }

/* seller bottom nav — PURE CSS visibility via body[data-page], mirroring the
   proven buyer .app-tabbar (no JS, no [hidden]; !important so it can't collapse
   to a vertical list). Shows only on seller-* pages, hidden during onboarding. */
.seller-tabbar{ display:none !important; }
.is-app body[data-page^="seller-"] .seller-tabbar{
  display:flex !important; flex-direction:row !important; align-items:stretch;
  position:fixed !important; left:0; right:0; bottom:0; width:100%; z-index:2000;
  background:#fff; border-top:1px solid rgba(15,23,42,.08);
  padding:7px 4px calc(7px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -6px 20px rgba(15,23,42,.09);
}
.is-app body[data-page="seller-onboarding"] .seller-tabbar{ display:none !important; }
.seller-tab{ flex:1 1 0 !important; min-width:0; display:flex !important; flex-direction:column !important; align-items:center; justify-content:center; gap:3px; background:none; border:0; color:#8a94a0; font-size:.64rem; font-weight:700; cursor:pointer; padding:4px 0; }
.seller-tab .st-ico{ font-size:1.2rem; }
.seller-tab.active{ color:var(--ec-navy); }

/* ===== Membership (app-only): STAT cards ("Saved By Members" etc.) go 2-per-row;
   plan cards stay 1-per-row (the default). Website unchanged. ===== */
html.is-app #membership .proof-strip{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
html.is-app #membership .proof-strip .proof-card{ margin:0; }
html.is-app #membership .proof-strip .proof-card:last-child{ grid-column:1 / -1; }

/* ===== Membership: app LIGHT palette (match the rest of the app) ===== */
html.is-app #membership{ background:var(--ec-bg); }
html.is-app #membership .membership-heading h2{ color:var(--ec-navy) !important; -webkit-text-fill-color:var(--ec-navy); background:none; }
html.is-app #membership .membership-heading p{ color:var(--ec-blue); }
html.is-app #membership .proof-card{ background:#fff; border:1px solid #e6eaee; box-shadow:0 2px 10px rgba(191,199,206,.5); }
html.is-app #membership .proof-num{ color:var(--ec-navy) !important; -webkit-text-fill-color:var(--ec-navy); background:none; }
html.is-app #membership .proof-label{ color:var(--ec-blue); }
html.is-app #membership .plan-card{ background:#fff !important; border:1px solid #e6eaee; box-shadow:0 3px 12px rgba(191,199,206,.5); }
html.is-app #membership .plan-card .price,
html.is-app #membership .plan-card .per,
html.is-app #membership .plan-card .plan-tag,
html.is-app #membership .plan-card ul li{ color:var(--ec-navy) !important; }
html.is-app #membership .plan-card ul li b{ color:var(--ec-gold2) !important; }
html.is-app #membership .best-card{ border-color:var(--ec-gold2) !important; }
html.is-app #membership .trust-item{ background:#fff; color:var(--ec-navy); box-shadow:0 2px 8px rgba(191,199,206,.4); }
html.is-app #membership .trust-item strong{ color:var(--ec-navy); }
html.is-app #membership .trust-item small{ color:var(--ec-blue); }
html.is-app #membership .mem-block-title{ color:var(--ec-navy); }

/* ===== Wallet: locked overlay for non-members (app-only) ===== */
html.is-app #wallet.is-wallet-locked > .category-wrap,
html.is-app #wallet.is-wallet-locked > *:not(.wallet-lock){ filter:blur(3px); opacity:.45; pointer-events:none; }
.wallet-lock{ position:fixed; left:0; right:0; top:0; bottom:0; z-index:1500; display:flex; align-items:center; justify-content:center; padding:24px; background:rgba(244,244,244,.55); }
.wallet-lock[hidden]{ display:none !important; }
.wallet-lock-card{ background:#fff; border-radius:18px; padding:26px 22px; text-align:center; max-width:340px; box-shadow:0 12px 34px rgba(15,23,42,.18); }
.wallet-lock-card .wl-ico{ font-size:2.4rem; }
.wallet-lock-card h3{ color:var(--ec-navy); margin:10px 0 6px; font-size:1.15rem; }
.wallet-lock-card p{ color:var(--ec-blue); font-size:.9rem; line-height:1.5; margin:0 0 18px; }
.wallet-lock-cta{ background:var(--ec-navy); color:#fff; border:0; border-radius:12px; padding:13px 28px; font-weight:800; cursor:pointer; }

/* ===== App palette: remaining dark screens -> light (login, policies, help) ===== */
html.is-app .login-section{ background:var(--ec-bg); }
html.is-app .login-box{ background:#fff; border:1px solid #e6eaee; box-shadow:0 12px 34px rgba(15,23,42,.12); color:var(--ec-navy); }
html.is-app .login-box .login-logo{ color:var(--ec-navy) !important; -webkit-text-fill-color:var(--ec-navy); background:none; }
html.is-app .login-box .login-sub,
html.is-app .login-box .form-note{ color:var(--ec-blue); }
html.is-app .login-box .form-note a{ color:var(--ec-gold2); }
html.is-app .login-box input{ background:#fff; border:1px solid #dbe0e6; color:var(--ec-navy); }
html.is-app .login-box input::placeholder{ color:#9aa4ad; }
html.is-app .login-box .tnc-check span{ color:var(--ec-blue); }

html.is-app #policies{ background:var(--ec-bg); }
html.is-app #policies .policy-panel{ background:#fff; border:1px solid #e6eaee; box-shadow:0 4px 16px rgba(191,199,206,.4); color:#475569; }
html.is-app #policies .policy-panel h2,
html.is-app #policies .policy-panel h3,
html.is-app #policies .policy-panel h4{ color:var(--ec-navy); }
html.is-app #policies .policy-panel p,
html.is-app #policies .policy-panel li{ color:#475569; }

html.is-app #help{ background:var(--ec-bg); }
html.is-app #help h2, html.is-app #help h3, html.is-app #help .category-section-title{ color:var(--ec-navy); }
html.is-app #help p, html.is-app #help label, html.is-app #help small{ color:var(--ec-blue); }
html.is-app #help input, html.is-app #help textarea, html.is-app #help select{ background:#fff; border:1px solid #dbe0e6; color:var(--ec-navy); }

/* ===== My Orders: app-only search + filters + delivered tag + star rating ===== */
html.is-app #orders{ background:var(--ec-bg); }
html.is-app #orders .od-title{ color:var(--ec-navy); }
html.is-app #orders .acct-order-wrap{ margin-bottom:12px; }
html.is-app #orders .acct-order{ background:#fff; box-shadow:0 2px 8px rgba(191,199,206,.4); }
html.is-app #orders .acct-order-name{ color:var(--ec-navy); }

.ord-tools{ display:none; }
html.is-app .ord-tools{ display:block; margin-bottom:14px; }
.ord-search{ display:flex; align-items:center; gap:8px; background:#fff; border:1px solid #e3e6e9; border-radius:12px; padding:10px 14px; margin-bottom:10px; }
.ord-search-ico{ font-size:1rem; }
.ord-search input{ flex:1; border:none; outline:none; background:none; font-size:.92rem; color:var(--ec-navy); }
.ord-filters{ display:flex; gap:8px; overflow-x:auto; }
.ord-filter{ flex:0 0 auto; background:#fff; border:1px solid #e3e6e9; color:var(--ec-blue); border-radius:999px; padding:7px 15px; font-weight:700; font-size:.82rem; cursor:pointer; }
.ord-filter.active{ background:var(--ec-navy); color:#fff; border-color:var(--ec-navy); }

.ord-tag{ display:none; margin-top:7px; font-size:.76rem; font-weight:700; color:#1e9e5a; background:#e5f4ec; border-radius:8px; padding:5px 9px; }
.ord-tag-cancel{ color:#c0392b; background:#fdeceb; }
html.is-app .ord-tag{ display:inline-block; }

.ord-rate{ display:none; }
html.is-app .ord-rate{ display:flex; flex-direction:column; gap:5px; background:#fff; border-radius:0 0 14px 14px; margin-top:-8px; padding:12px 14px 14px; box-shadow:0 2px 8px rgba(191,199,206,.35); }
.ord-rate-q{ font-size:.82rem; font-weight:700; color:var(--ec-navy); }
.ord-stars{ display:flex; gap:8px; }
.ord-star{ background:none; border:none; font-size:1.6rem; line-height:1; color:#d9dee3; cursor:pointer; padding:0; }
.ord-star.on{ color:var(--ec-gold2); }
.ord-rate-scale{ display:flex; justify-content:space-between; font-size:.68rem; color:#9aa4ad; max-width:180px; }

/* ===== Compact saved-address strip on My Orders (moved from Profile) ===== */
.ord-addr{ margin-bottom:14px; }
.ord-addr-head{ font-size:.82rem; font-weight:700; color:var(--ec-navy); margin:0 2px 8px; }
html.is-app #orders .addr-grid{ display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; -ms-overflow-style:none; scrollbar-width:none; }
html.is-app #orders .addr-grid::-webkit-scrollbar{ display:none; }
html.is-app #orders .addr-card{ flex:0 0 auto; width:210px; margin:0; padding:11px 12px; border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(191,199,206,.4); cursor:pointer; }
html.is-app #orders .addr-card .addr-card-head{ display:flex; align-items:center; gap:6px; }
html.is-app #orders .addr-card .addr-name{ color:var(--ec-navy); font-weight:700; font-size:.85rem; }
html.is-app #orders .addr-card .addr-card-phone,
html.is-app #orders .addr-card .addr-card-line{ font-size:.74rem; color:var(--ec-blue); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
html.is-app #orders .addr-add-tile{ flex:0 0 auto; width:150px; min-height:auto; align-self:stretch; }
html.is-app #orders .addr-form{ background:#fff; border-radius:14px; }
.addr-edit-hint{ margin-left:auto; font-size:.64rem; font-weight:800; color:var(--ec-gold2); text-transform:uppercase; }

/* ===== Slim "deliver to" location bar, just below the search bar ===== */
.nav-row-3{display:flex;flex-direction:column;gap:8px;}
/* Full-width "Add delivery location" band, like Meesho (pin · text · chevron) */
.nav-loc-bar{display:flex;align-items:center;gap:9px;width:100%;background:rgba(244,183,63,.10);border:1px solid var(--line);color:var(--gold-light);border-radius:8px;padding:10px 14px;cursor:pointer;font-weight:600;line-height:1;text-align:left;}
.nav-loc-bar:hover{background:rgba(244,183,63,.16);}
.nav-loc-bar .nav-loc-ico{font-size:1.02rem;flex-shrink:0;}
.nav-loc-bar .nav-loc-col{display:inline-flex;align-items:baseline;gap:6px;min-width:0;flex:1;}
.nav-loc-bar .nav-loc-col small{font-size:.68rem;opacity:.8;}
.nav-loc-bar .nav-loc-col small:empty{display:none;}
.nav-loc-bar .nav-loc-col b{font-size:.8rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nav-loc-arrow{margin-left:auto;font-size:1.05rem;opacity:.7;flex-shrink:0;font-weight:700;}

/* ===== Remove lift/hover from product cards (also fixes sticky hover on touch) ===== */
.product-card:hover,.subcategory-card:hover,.ec-card:hover{transform:none!important;box-shadow:none!important;}
.product-card:hover .product-image,.ec-card:hover .product-image{transform:none!important;}
/* ===== Membership plan cards: no lift hover (fixes the stuck Rs 199 hover) ===== */
.plan-card:hover,.shine-card:hover{transform:none!important;box-shadow:none!important;}

/* ===== Heart placement on featured (Today's Deal) + product detail image ===== */
.ecf-img{position:relative;}
.ec-main-img{position:relative;}

/* ===== Wallet page: logo LEFT, profile RIGHT (override phone centered-logo grid) ===== */
body[data-page="wallet"] .menu-toggle{display:none!important;}
body[data-page="wallet"] .nav-row-1{display:flex!important;align-items:center;}
body[data-page="wallet"] .nav-logo.ec-brand{justify-self:start!important;margin:0!important;}
body[data-page="wallet"] .nav-actions{grid-column:auto!important;width:auto!important;margin-left:auto!important;justify-content:flex-end!important;}

/* ===== Admin: gift membership + featured toggle ===== */
.adm-gift-note{font-size:.82rem;color:#666;line-height:1.5;margin:0 0 12px;}
.adm-featured{display:flex;align-items:center;gap:8px;margin:10px 0;font-size:.88rem;color:#172337;}

/* ===================== ANIMATED SPLASH SCREEN =====================
   One splash, two surfaces. In the app the native Android splash
   (mobile/brand/android/res/drawable/ic_splash_icon.xml) runs first, so this
   screen copies it exactly — flat #0A0A0F, same mark, same 192dp size — and the
   handover is invisible: the user sees a single splash that then animates the
   wordmark in. The website shows the same thing from the first frame.
   Nothing else on top (no tagline, no loading bar) — the mark and the name. */
.ec-splash{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  background:#0A0A0F;opacity:1;transition:opacity .55s ease;overflow:hidden;}
.ec-splash.is-hiding{opacity:0;pointer-events:none;}
.ec-splash-inner{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 24px;}

/* 192px is the 192dp Android renders the system splash icon at, so the mark
   does not change size across the handover. Capped by vw so it still breathes
   on narrow phones.
   Deliberately NO entry animation: the native splash has already been showing
   this mark at full size, so fading or scaling it in here would make the logo
   visibly flicker/shrink at the exact moment the WebView takes over. All the
   motion is carried by the ring and the wordmark, which have nothing to clash
   with because the native splash never drew them. */
.ec-splash-mark{position:relative;width:min(192px,50vw);height:min(192px,50vw);}
.ec-splash-mark svg{display:block;width:100%;height:100%;
  filter:drop-shadow(0 14px 44px rgba(254,192,13,.22));}
/* A ring that swells out of the disc once it has landed — reads as a heartbeat
   rather than a spinner, so it never looks like the app is stuck loading. */
.ec-splash-mark::after{content:"";position:absolute;inset:0;border-radius:50%;
  border:2px solid rgba(254,192,13,.55);animation:ecRing 2.4s cubic-bezier(.2,.6,.3,1) .75s infinite;}

.ec-splash-word{margin-top:28px;font-family:var(--display,'Poppins'),sans-serif;font-weight:800;
  font-size:clamp(1.9rem,8vw,2.6rem);letter-spacing:.5px;color:#fff;
  animation:ecWordIn .75s cubic-bezier(.2,.8,.25,1) .4s both;}
.ec-splash-word span{background:linear-gradient(90deg,#FEC00D 0%,#FFE9A3 42%,#FFFFFF 52%,#FFE9A3 62%,#FEC00D 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  background-size:220% auto;animation:ecShimmer 2.6s linear 1.15s infinite;}

@keyframes ecWordIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@keyframes ecRing{0%{transform:scale(1);opacity:.6;}75%{opacity:0;}100%{transform:scale(1.38);opacity:0;}}
@keyframes ecShimmer{to{background-position:220% center;}}
/* Keyframes carry the from-state (not the base rule), so killing the animations
   leaves everything at its final, visible state. */
@media (prefers-reduced-motion: reduce){.ec-splash *,.ec-splash *::after{animation:none !important;}}

/* App-only "load more" sentinel (infinite scroll) */
.ec-more-sentinel{height:48px;display:flex;align-items:center;justify-content:center;}
.ec-more-sentinel::after{content:"";width:22px;height:22px;border-radius:50%;border:3px solid rgba(212,160,23,.25);border-top-color:#d4a017;animation:ecSpin .7s linear infinite;}
@keyframes ecSpin{to{transform:rotate(360deg);}}

/* OTP "check spam" attention note (login + signup) */
.otp-spam-note{background:#fff8e1;border:1px solid #f5d77a;color:#7a5b00;border-radius:10px;padding:10px 12px;margin:8px 0 4px;font-size:.82rem;line-height:1.5;text-align:left;animation:otpSpamIn .3s ease;}
.otp-spam-note strong{color:#5a4400;}
@keyframes otpSpamIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}

/* ============ APP-ONLY UI (Capacitor) — website unaffected ============ */
.app-tabbar{display:none;}
.is-app .app-tabbar{
  display:flex !important; flex-direction:row !important; align-items:stretch;
  position:fixed !important; left:0; right:0; bottom:0; width:100%; z-index:2000;
  background:#fff; border-top:1px solid rgba(15,23,42,.08);
  padding:7px 4px calc(7px + env(safe-area-inset-bottom, 0px));
  box-shadow:0 -6px 20px rgba(15,23,42,.09);
  animation:tabbarUp .38s cubic-bezier(.2,.9,.3,1.1);
}
.is-app .app-tab{flex:1 1 0;min-width:0;display:flex !important;flex-direction:column !important;align-items:center;justify-content:center;gap:3px;background:none;border:0;cursor:pointer;font-family:inherit;padding:3px 0;color:#9aa3b2;transition:color .15s;-webkit-tap-highlight-color:transparent;}
.is-app .app-tab-ico{font-size:1.4rem;line-height:1;transition:transform .2s cubic-bezier(.2,.9,.3,1.4);}
.is-app .app-tab-lbl{font-size:.66rem;font-weight:700;letter-spacing:.2px;}
.is-app .app-tab.active{color:var(--gold,#d4a017);}
.is-app .app-tab.active .app-tab-ico{transform:translateY(-3px) scale(1.18);}
.is-app .app-tab:active .app-tab-ico{transform:scale(.82);}
@keyframes tabbarUp{from{transform:translateY(110%);}to{transform:translateY(0);}}
/* leave room so the fixed bar never covers content */
.is-app .app-page{padding-bottom:78px;}
/* hide the bar on full-screen flows (checkout, detail, login, admin) */
.is-app body[data-page="cart"] .app-tabbar,
.is-app body[data-page="checkout"] .app-tabbar,
.is-app body[data-page="order-detail"] .app-tabbar,
.is-app body[data-page="review"] .app-tabbar,
.is-app body[data-page="login"] .app-tabbar,
.is-app body[data-page="login-credentials"] .app-tabbar,
.is-app body[data-page="edit-profile"] .app-tabbar,
.is-app body[data-page="admin"] .app-tabbar{display:none !important;}
.is-app body[data-page^="seller-"] .app-tabbar{display:none !important;}   /* seller screens use their own nav */

/* Top category row as circular emoji tiles (like popular apps) — app only */
.is-app .ncat{flex-direction:column !important;gap:6px !important;width:72px;min-width:72px;border:0 !important;background:none !important;padding:4px 2px !important;font-size:.68rem !important;color:#475569 !important;font-weight:600;white-space:normal !important;text-align:center;line-height:1.15;word-break:break-word;}
.is-app .ncat-ico{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.55rem;background:linear-gradient(135deg,#f6efff,#eef3ff);box-shadow:inset 0 0 0 1px rgba(15,23,42,.05);transition:transform .18s;}
.is-app .ncat.active{color:var(--gold,#d4a017) !important;}
.is-app .ncat.active .ncat-ico{background:linear-gradient(135deg,#fff2cf,#ffe08a);box-shadow:0 6px 16px rgba(212,160,23,.3);transform:translateY(-2px);}
.is-app .ncat:active .ncat-ico{transform:scale(.9);}

/* ============ APP THEME (Capacitor only) — Meesho-style polish ============ */
.is-app body{background:#f3f4f6;}
.is-app footer{display:none !important;}                 /* web footer hidden in app */
.is-app .category-wrap{padding-left:12px;padding-right:12px;}

/* Account: profile header + quick tiles + list rows as clean white cards */
.is-app #account .acct-head{background:#fff;border-radius:16px;padding:14px 16px;box-shadow:0 4px 16px rgba(15,23,42,.06);margin-bottom:12px;}
.is-app #account .acct-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:#fff;border-radius:16px;padding:14px 8px;box-shadow:0 4px 16px rgba(15,23,42,.06);margin-bottom:14px;}
.is-app #account .acct-quick-btn{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:.7rem;font-weight:600;color:#334155;background:none;border:0;}
.is-app #account .acct-quick-btn .aq-ico{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.35rem;background:linear-gradient(135deg,#f6efff,#eef3ff);}
.is-app #account .acct-links{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 16px rgba(15,23,42,.06);}
.is-app #account .acct-link-row{padding:15px 16px;border-bottom:1px solid #f1f5f9;}
.is-app #account .acct-logout{margin-top:16px;border-radius:12px;}

/* Cards across app pages: softer, rounder */
.is-app .od-card,.is-app .help-q-card,.is-app .wish-item{border-radius:16px;box-shadow:0 4px 16px rgba(15,23,42,.05);}
.is-app .od-head{background:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 4px 16px rgba(15,23,42,.05);}

/* Sticky page CTAs (cart/checkout) sit flush; tab bar is hidden on those pages */
.is-app .checkout-btn.full{border-radius:12px;}

/* Product cards a touch rounder in app */
.is-app .ec-card{border-radius:14px;}

/* App-only: Meesho-style step bar (Cart -> Review -> Payment) */
.app-steps{display:none;}
.is-app .app-steps{display:flex;align-items:center;justify-content:center;gap:0;padding:14px 28px 12px;background:#fff;border-radius:14px;margin:8px auto 14px;max-width:520px;box-shadow:0 3px 12px rgba(15,23,42,.05);}
.is-app .app-step{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:.72rem;font-weight:700;color:#9aa3b2;flex:0 0 auto;}
.is-app .app-step-n{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.78rem;border:2px solid #cbd5e1;color:#9aa3b2;background:#fff;}
.is-app .app-step.active{color:#d4a017;}
.is-app .app-step.active .app-step-n{border-color:#d4a017;background:#d4a017;color:#fff;}
.is-app .app-step.done{color:#16a34a;}
.is-app .app-step.done .app-step-n{border-color:#16a34a;background:#16a34a;color:#fff;}
.is-app .app-step-line{flex:1;height:2px;background:#e2e8f0;margin:0 6px;margin-bottom:20px;min-width:28px;}
.is-app .app-step-line.done{background:#16a34a;}

/* App-only: cleaner cart/checkout (hide the web hero, tighten layout) */
.is-app #cart .category-hero,.is-app #checkout .category-hero{display:none;}
.is-app #cart .cart-grid,.is-app #checkout .checkout-grid{display:block;}
.is-app #cart .cart-panel h2,.is-app #cart .summary-panel h3{font-size:1rem;}
.is-app #cart .cart-item{background:#fff;border-radius:14px;padding:12px;margin-bottom:10px;box-shadow:0 3px 12px rgba(15,23,42,.05);}
.is-app #cart .summary-panel{background:#fff;border-radius:16px;padding:14px;box-shadow:0 4px 16px rgba(15,23,42,.05);margin-top:8px;}
.is-app #cart .checkout-btn,.is-app #checkout .checkout-btn{border-radius:12px;}

/* Member (Gold) price hint under the product price */
.product-member-price{display:block;font-size:.72rem;font-weight:700;color:#b8893a;margin:2px 0 4px;}
.ec-member-price{font-size:.85rem;font-weight:700;color:#b8893a;margin:2px 0 6px;}

/* ===== APP HOME (Capacitor only) — reference-style front page ===== */
.app-only{display:none !important;}
.is-app .app-only{display:inline !important;}
.is-app .web-only{display:none !important;}

/* Hide the big website hero on the app home; show a compact member banner */
.is-app #store .shop-hero{display:none !important;}
.app-member-banner{display:none;}
.is-app .app-member-banner{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;margin:6px 0 14px;padding:14px 16px;border:0;border-radius:14px;background:linear-gradient(135deg,#5b7cae,#3f5f8f);color:#fff;font-family:inherit;font-weight:800;font-size:.95rem;letter-spacing:.3px;cursor:pointer;box-shadow:0 6px 18px rgba(63,95,143,.3);}
.is-app .app-member-banner .amb-arrow{font-size:1.5rem;line-height:1;}
.is-app .app-member-banner:active{transform:scale(.99);}

/* Colourful category tiles (rainbow, like the reference) */
.is-app .ncat:nth-child(6n+1) .ncat-ico{background:linear-gradient(135deg,#e0f2fe,#bae6fd);}
.is-app .ncat:nth-child(6n+2) .ncat-ico{background:linear-gradient(135deg,#fce7f3,#fbcfe8);}
.is-app .ncat:nth-child(6n+3) .ncat-ico{background:linear-gradient(135deg,#dcfce7,#bbf7d0);}
.is-app .ncat:nth-child(6n+4) .ncat-ico{background:linear-gradient(135deg,#ffedd5,#fed7aa);}
.is-app .ncat:nth-child(6n+5) .ncat-ico{background:linear-gradient(135deg,#ede9fe,#ddd6fe);}
.is-app .ncat:nth-child(6n+6) .ncat-ico{background:linear-gradient(135deg,#fef9c3,#fde68a);}
.is-app .ncat.active .ncat-ico{background:linear-gradient(135deg,#fff2cf,#ffe08a) !important;box-shadow:0 6px 16px rgba(212,160,23,.3);}

/* "SELL OR OFFER" heading a touch bolder in app */
.is-app .ec-featured-head h3{font-size:1rem;color:#334155;}

/* ===== APP TOP BAR (Capacitor only) — minimal, profile left, icons right ===== */
.is-app nav{background:linear-gradient(180deg,#e9eff6,#eef1f5) !important;box-shadow:0 2px 10px rgba(15,23,42,.05);}
.is-app nav .menu-toggle{display:none !important;}
.is-app nav .nav-row-1 > .nav-logo{display:none !important;}
.is-app nav #navMembership{display:none !important;}          /* membership lives in the bottom nav (Earn) */
.is-app nav .nav-row-1{justify-content:flex-end;gap:16px;align-items:center;}
.is-app nav .nav-item{color:#3f4b5b;}
.is-app nav .nav-item .ni-lbl{display:none !important;}        /* icon-only top bar */
/* profile / login avatar on the LEFT (like the reference) */
.is-app nav #navProfile,.is-app nav #signInBtn{order:-1;margin-right:auto;}
.is-app nav #navProfile .ni-ico,.is-app nav #signInBtn .ni-ico{width:40px;height:40px;border-radius:50%;background:#dbe3ec;display:flex;align-items:center;justify-content:center;font-size:1.25rem;overflow:hidden;color:#3f4b5b;}
.is-app nav .nav-search input{background:#fff;}
.is-app nav .nav-loc-bar{background:#fff;color:#334155;border:1px solid #dbe3ec;}
.is-app nav .nav-loc-bar #navLocText{color:#334155;}

/* Category strip: 2-row horizontally-scrolling grid (like the reference) */
.is-app .nav-cat-wrap .ncat-arrow{display:none !important;}
.is-app .nav-cat-strip{display:grid !important;grid-auto-flow:column;grid-template-rows:repeat(2,auto);gap:14px 12px;overflow-x:auto;padding:8px 2px;scrollbar-width:none;-ms-overflow-style:none;}
.is-app .nav-cat-strip::-webkit-scrollbar{display:none;}

/* ===== APP CATEGORIES PAGE (Capacitor only) — soft light palette ===== */
.is-app #categories{background:#eef2f7;padding:0;}
.is-app #categories .catpage-head{padding:14px 16px 6px;}
.is-app #categories .catpage-head h2{margin:0;font-size:1.15rem;font-weight:800;color:#2b2f3a;letter-spacing:.5px;text-transform:uppercase;}
.is-app #categories .catpage-body{display:flex;gap:0;align-items:flex-start;}
.is-app #categories .catpage-side{flex:0 0 92px;max-height:calc(100vh - 200px);overflow-y:auto;background:#e4eaf1;border-radius:0 16px 16px 0;padding:6px 0;scrollbar-width:none;}
.is-app #categories .catpage-side::-webkit-scrollbar{display:none;}
.is-app .catg-side-item{width:100%;display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 4px;background:none;border:0;border-left:3px solid transparent;cursor:pointer;font-family:inherit;color:#57606f;transition:.15s;}
.is-app .catg-side-item .catg-side-ico{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem;background:#f4f7fb;box-shadow:inset 0 0 0 1px rgba(15,23,42,.05);}
.is-app .catg-side-item .catg-side-lbl{font-size:.62rem;font-weight:700;text-align:center;line-height:1.15;}
.is-app .catg-side-item.active{background:#f4f7fb;border-left-color:#2b2f3a;color:#2b2f3a;}
.is-app .catg-side-item.active .catg-side-ico{background:#fff;box-shadow:0 4px 12px rgba(43,47,58,.12);}

.is-app #categories .catpage-main{flex:1;min-width:0;padding:12px 14px 24px;}
.is-app .catg-eyebrow{font-size:.66rem;font-weight:800;letter-spacing:.08em;color:#8a93a3;margin-bottom:4px;}
.is-app .catg-h{font-size:1rem;font-weight:800;color:#2b2f3a;margin:14px 0 10px;}
.is-app .catg-featured{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;}
.is-app .catg-featured::-webkit-scrollbar{display:none;}
.is-app .catg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 8px;}
.is-app .catg-tile{display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:0;cursor:pointer;font-family:inherit;}
.is-app .catg-featured .catg-tile{flex:0 0 84px;}
.is-app .catg-ico{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.9rem;box-shadow:0 4px 14px rgba(15,23,42,.08);}
.is-app .catg-lbl{font-size:.72rem;font-weight:600;color:#2b2f3a;text-align:center;line-height:1.2;max-width:88px;}
.is-app .catg-tile:active .catg-ico{transform:scale(.92);}
.is-app .catg-ico.c-blue{background:linear-gradient(135deg,#dbeafe,#bfdbfe);}
.is-app .catg-ico.c-pink{background:linear-gradient(135deg,#fce7f3,#fbcfe8);}
.is-app .catg-ico.c-purple{background:linear-gradient(135deg,#ede9fe,#ddd6fe);}
.is-app .catg-ico.c-orange{background:linear-gradient(135deg,#ffedd5,#fed7aa);}
.is-app .catg-ico.c-green{background:linear-gradient(135deg,#dcfce7,#bbf7d0);}

/* Issue 2a: app top-bar wishlist + cart icons navy (not yellow) */
.is-app nav #navWishIcon,.is-app nav #navCartIcon,.is-app nav #navNotif,
.is-app nav #navWishIcon .ni-ico,.is-app nav #navCartIcon .ni-ico,.is-app nav #navNotif .ni-ico,
.is-app nav #navWishIcon svg,.is-app nav #navCartIcon svg,.is-app nav #navNotif svg{color:#2b2f3a !important;stroke:#2b2f3a !important;}
/* Active-member banner turns green */
.is-app .app-member-banner.is-active-member{background:linear-gradient(135deg,#16a34a,#0f8a3d);box-shadow:0 6px 18px rgba(22,163,74,.28);}

/* ===== STEP 2: Review Your Order (Capacitor only) ===== */
.is-app #review{background:#f3f4f6;padding-bottom:96px;}
.is-app #review .review-head h2{font-size:1.05rem;font-weight:800;color:#2b2f3a;text-transform:uppercase;letter-spacing:.5px;margin:6px 4px 12px;}
.is-app .review-items{background:#fff;border-radius:14px;padding:2px 14px;margin:0 4px 12px;box-shadow:0 3px 12px rgba(15,23,42,.05);}
.is-app .rv-item{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid #f1f3f6;}
.is-app .rv-item:last-child{border-bottom:0;}
.is-app .rv-img{flex:0 0 76px;height:90px;border-radius:10px;overflow:hidden;background:#f4f6f8;display:flex;align-items:center;justify-content:center;}
.is-app .rv-img img{width:100%;height:100%;object-fit:cover;}
.is-app .rv-ph{font-size:1.6rem;}
.is-app .rv-info{flex:1;min-width:0;}
.is-app .rv-name{font-size:.86rem;color:#2b2f3a;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.is-app .rv-price{display:flex;align-items:center;gap:8px;margin:6px 0;}
.is-app .rv-price b{font-size:1rem;color:#2b2f3a;}
.is-app .rv-price del{font-size:.82rem;color:#98a1ad;}
.is-app .rv-off{font-size:.78rem;font-weight:700;color:#16a34a;}
.is-app .rv-chips{display:flex;gap:8px;margin:6px 0;flex-wrap:wrap;}
.is-app .rv-chip{font-size:.74rem;font-weight:600;color:#3f4b5b;background:#f1f4f8;border:1px solid #e2e8f0;border-radius:8px;padding:5px 10px;}
.is-app .rv-eta{font-size:.74rem;color:#64748b;margin-top:4px;}
.is-app .review-price{background:#fff;border-radius:14px;padding:14px 16px;margin:0 4px;box-shadow:0 3px 12px rgba(15,23,42,.05);}
.is-app .rv-pd-title{font-size:.95rem;font-weight:800;color:#2b2f3a;margin:0 0 10px;}
.is-app .rv-pd-row{display:flex;justify-content:space-between;font-size:.86rem;color:#3f4b5b;padding:5px 0;}
.is-app .rv-green{color:#16a34a;font-weight:700;}
.is-app .rv-pd-div{height:1px;background:#eef0f3;margin:8px 0;}
.is-app .rv-pd-total{font-size:1.05rem;font-weight:800;color:#2b2f3a;}
.is-app .rv-pd-banner{margin-top:12px;background:#eafaf0;border:1px solid #b7ebc9;color:#15803d;border-radius:10px;padding:10px 12px;font-size:.84rem;font-weight:700;}
.is-app .review-bottombar{display:none;}
.is-app #review .review-bottombar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1600;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid #eef0f3;box-shadow:0 -4px 16px rgba(15,23,42,.08);}
.is-app .review-bb-left{display:flex;flex-direction:column;line-height:1.2;}
.is-app .review-bb-left strong{font-size:1.05rem;color:#2b2f3a;}
.is-app .review-vpd{background:none;border:0;padding:0;font-family:inherit;font-size:.72rem;font-weight:800;color:#c2410c;text-align:left;cursor:pointer;letter-spacing:.03em;}
.is-app .review-continue{border:0;border-radius:12px;padding:13px 34px;font-family:inherit;font-weight:800;font-size:.95rem;color:#fff;background:linear-gradient(135deg,#f2843c,#ef6c2e);cursor:pointer;box-shadow:0 6px 16px rgba(239,108,46,.3);}
.is-app .review-continue:active{transform:scale(.98);}

/* ===== Categories page: top grid (half, scrollable) + bottom products ===== */
.is-app #categories{padding-bottom:0 !important;}
.is-app #categories .catpage{display:flex;flex-direction:column;}
.is-app #categories .catpage-head{flex:0 0 auto;padding:12px 14px 4px;}
.is-app #categories #catMain{flex:0 0 auto;max-height:44vh;overflow-y:auto;background:#e9eef4;border-radius:0 0 16px 16px;padding:10px 12px 8px;scrollbar-width:none;}
.is-app #categories #catMain::-webkit-scrollbar{display:none;}
.is-app #categories #catMain .catg-eyebrow{margin:2px 2px 8px;}
.is-app #categories #catMain .catg-grid{grid-template-columns:repeat(4,1fr);gap:14px 6px;}
.is-app #categories #catMain .catg-ico{width:54px;height:54px;font-size:1.5rem;}
.is-app #categories #catMain .catg-lbl{font-size:.62rem;max-width:72px;}
.is-app .catg-tile.sel .catg-ico{outline:2.5px solid #2b2f3a;outline-offset:2px;box-shadow:0 4px 12px rgba(43,47,58,.22);}
.is-app .catg-tile.sel .catg-lbl{color:#2b2f3a;font-weight:800;}
.is-app #categories #catProducts{flex:1 1 auto;padding:10px 10px 92px;}
.is-app .catp-head{font-size:.92rem;font-weight:800;color:#2b2f3a;margin:6px 4px 12px;}
.is-app .catp-head span{color:#8a93a3;font-weight:600;font-size:.8rem;}
/* sub-category chips (category drill-down) */
.catp-subs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;scrollbar-width:none;-ms-overflow-style:none;}
.catp-subs::-webkit-scrollbar{display:none;}
.catp-sub{flex:0 0 auto;background:#fff;border:1px solid #dbe0e6;color:#57606f;border-radius:999px;padding:6px 13px;font-size:.74rem;font-weight:700;cursor:pointer;}
.catp-sub.active{background:#2b2f3a;color:#fff;border-color:#2b2f3a;}
.is-app #catProducts .ec-grid,.is-app #catProducts .catp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}

/* Hide the floating "Cart" pill in the APP — the top-bar cart icon already
   covers it, and it overlapped/clipped behind the bottom nav. (Web keeps it.) */
.is-app .floating-cart{display:none !important;}

/* ===== Categories page: SIDE-BY-SIDE (sidebar left, products right) ===== */
.is-app body[data-page="categories"] .nav-row-2,
.is-app body[data-page="categories"] .nav-row-3{display:none !important;}
.is-app #categories{padding-bottom:0 !important;}
.is-app #categories .catpage{display:flex;flex-direction:column;}
.is-app #categories .catpage-head{flex:0 0 auto;padding:12px 14px 8px;}
.is-app #categories .catpage-body{display:flex !important;flex-direction:row !important;align-items:stretch !important;gap:0;height:calc(100dvh - 185px);min-height:380px;}
.is-app #categories .catpage-side{flex:0 0 86px !important;max-height:none !important;height:100%;overflow-y:auto;background:#e9eef4;border-radius:0;padding:6px 0;scrollbar-width:none;}
.is-app #categories .catpage-side::-webkit-scrollbar{display:none;}
.is-app #categories .catpage-main{flex:1 1 auto !important;min-width:0;height:100%;overflow-y:auto;padding:12px 10px 22px !important;background:#f6f8fb;}
.is-app #catProducts .ec-grid,.is-app #catProducts .catp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}

/* Reinforce the wishlist heart everywhere (defeat any stale/overriding rule) */
.wish-btn{position:absolute !important;top:9px !important;right:9px !important;left:auto !important;bottom:auto !important;width:38px !important;height:38px !important;border-radius:50% !important;background:rgba(255,255,255,.92) !important;box-shadow:0 2px 8px rgba(15,23,42,.18) !important;}
.wish-btn svg path{stroke:#2b2f3a !important;fill:none !important;}
.wish-btn.is-wished svg path{fill:#ef4444 !important;stroke:#ef4444 !important;}

/* ===== PRODUCT DETAIL as a clean full page in the app (Capacitor) ===== */
.nav-back-btn{display:none;}
.is-app.detail-open .nav-back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;background:none;font-size:2.1rem;line-height:1;color:#2b2f3a;cursor:pointer;order:-2;margin-right:0;padding:0 6px 0 0;}
/* The phone layout (line ~3973) makes .nav-actions full-width + centered; undo
   that in the detail view so bell/wishlist/cart pin to the right corner (same
   override the wallet page uses). Back button stays left. */
.is-app.detail-open .nav-actions{grid-column:auto !important;width:auto !important;margin-left:auto !important;justify-content:flex-end !important;}
/* hide ALL the store/home chrome while viewing a product */
.is-app.detail-open .nav-row-2,
.is-app.detail-open .nav-row-3{display:none !important;}
.is-app.detail-open nav #navProfile,
.is-app.detail-open nav #signInBtn,
.is-app.detail-open nav #navMembership,
.is-app.detail-open nav .menu-toggle,
.is-app.detail-open nav .nav-logo{display:none !important;}
.is-app.detail-open #ecBack{display:none !important;}      /* remove the in-band "Back to store" */
.is-app.detail-open .app-tabbar{display:none !important;}   /* no bottom nav on the detail */
/* Add To Cart / Buy Now / Share & Earn render INLINE (stacked, full-width) like
   the website — a fixed bottom bar was swallowing the taps. */
.is-app.detail-open .ec-detail{padding-bottom:24px;}
.is-app.detail-open .ec-detail-actions{position:static;z-index:auto;display:flex;flex-direction:column;gap:10px;padding:0;margin:14px 0 0;background:none;border-top:0;box-shadow:none;}
.is-app.detail-open .ec-detail-actions .cart-btn{flex:none;width:100%;}

/* ===== V7 · 7A — Seller storefronts + product→store chain ===== */
.ec-storefront{max-width:1100px;margin:0 auto;}
.ec-store-head{display:flex;align-items:center;gap:16px;padding:16px;background:#fff;border:1px solid var(--ec-shadow,#d8dde2);border-radius:16px;margin-bottom:8px;}
.ec-store-logo{width:72px;height:72px;flex:0 0 72px;border-radius:16px;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--ec-bg,#f4f4f4);}
.ec-store-logo.sm{width:48px;height:48px;flex-basis:48px;font-size:1.4rem;border-radius:12px;}
.ec-store-logo img{width:100%;height:100%;object-fit:cover;}
.ec-store-meta{min-width:0;}
.ec-store-meta h2{margin:0 0 4px;font-size:1.25rem;color:var(--ec-navy,#28354d);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ec-store-sub{font-size:.85rem;color:var(--ec-blue,#647d97);display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.ec-store-about{margin:10px 0 0;font-size:.9rem;line-height:1.5;color:#475569;}
.ec-store-rate{color:#e6a817;font-weight:700;}
.ec-verified{display:inline-flex;align-items:center;gap:3px;font-size:.72rem;font-weight:700;color:#0a7a2f;background:rgba(10,122,47,.1);padding:2px 8px;border-radius:999px;}
.ec-plan-badge{font-size:.68rem;font-weight:800;letter-spacing:.5px;color:#7a5a12;background:var(--gold-light,#ffe3a3);padding:2px 8px;border-radius:999px;}
.ec-store-grid{margin-top:4px;}
.ec-store-more-wrap{text-align:center;margin:18px 0;}
.ec-loadmore-btn,.ec-visit-btn{font-family:var(--display,'Poppins',sans-serif);cursor:pointer;border-radius:12px;font-weight:700;}
.ec-loadmore-btn{padding:11px 30px;border:1px solid var(--ec-navy,#28354d);background:#fff;color:var(--ec-navy,#28354d);}
.ec-loadmore-btn:disabled{opacity:.6;cursor:default;}
/* Product-page seller strip (store profile + "Visit store") */
.ec-seller-strip{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border:1px solid var(--ec-shadow,#d8dde2);border-radius:14px;margin:14px 0;}
.ec-seller-info{min-width:0;flex:1;}
.ec-seller-info strong{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--ec-navy,#28354d);font-size:.98rem;}
.ec-seller-info small{display:block;color:var(--ec-blue,#647d97);font-size:.8rem;margin-top:2px;}
.ec-visit-btn{flex:0 0 auto;padding:9px 18px;border:0;background:var(--ec-navy,#28354d);color:#fff;font-size:.85rem;}
/* LOCKED footer — every storefront, never removable */
.ec-store-foot{margin-top:34px;padding:22px 16px;border-top:1px solid var(--ec-shadow,#d8dde2);text-align:center;}
.ec-foot-brand{font-size:.92rem;color:#475569;margin-bottom:10px;}
.ec-foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 4px;}
.ec-foot-link{background:none;border:0;cursor:pointer;font-family:var(--display,'Poppins',sans-serif);font-size:.82rem;color:var(--ec-blue,#647d97);padding:4px 10px;position:relative;}
.ec-foot-link:not(:last-child)::after{content:"·";position:absolute;right:-3px;color:#c3cbd2;}
.ec-foot-brandlink{color:var(--ec-navy,#28354d);font-weight:800;padding:0 2px;}
.ec-foot-brandlink::after{content:none;}
@media (max-width:560px){
  .ec-store-head{flex-direction:column;text-align:center;}
  .ec-store-sub{justify-content:center;}
  .ec-seller-strip{flex-wrap:wrap;}
  .ec-visit-btn{width:100%;order:3;}
}

/* ===== V7 · 7C — storefront theme (accent/template/banner) ===== */
.ec-storefront{--acc:#28354D;}
.ec-storefront .ec-store-head{border-top:3px solid var(--acc);}
.ec-storefront .ec-section-title{color:var(--acc);}
.ec-store-banner{margin-bottom:10px;border-radius:16px;overflow:hidden;max-height:220px;}
.ec-store-banner img{width:100%;height:100%;max-height:220px;object-fit:cover;display:block;}
.ec-store-tagline{margin:8px 0 0;font-size:.92rem;color:var(--acc);font-weight:600;}

/* ===== V7 · 7C-2 — template GALLERY (4 free + 6 Pro), fonts, card styles =====
   Every rule below is keyed off an id the server validated against the store's
   plan, so nothing here can be driven by raw seller input. A store that drops
   from Pro to Free simply stops matching the Pro selectors. */

/* Seller-chosen font (allowlisted stack, set as --ec-store-font inline). */
.ec-storefront{font-family:var(--ec-store-font,inherit);}
.ec-storefront .ec-store-meta h2,
.ec-storefront .ec-section-title{font-family:inherit;}

/* Pro announcement bar — full-bleed strip above the banner. */
.ec-store-announce{background:var(--acc);color:#fff;text-align:center;font-size:.82rem;font-weight:700;
  letter-spacing:.2px;padding:9px 14px;border-radius:12px;margin-bottom:10px;}

/* ---- FREE templates ---- */
.ec-tpl-bold .ec-store-head{background:var(--acc);border-top:0;color:#fff;}
.ec-tpl-bold .ec-store-head .ec-store-meta h2,
.ec-tpl-bold .ec-store-head .ec-store-sub,
.ec-tpl-bold .ec-store-tagline{color:#fff;}
.ec-tpl-minimal .ec-store-head{border-top:0;border:1px solid var(--ec-shadow,#d8dde2);flex-direction:column;text-align:center;}
.ec-tpl-minimal .ec-store-sub{justify-content:center;}
.ec-tpl-compact .ec-store-head{padding:10px 12px;gap:12px;}
.ec-tpl-compact .ec-store-logo{width:52px;height:52px;flex-basis:52px;font-size:1.5rem;}
.ec-tpl-compact .ec-store-meta h2{font-size:1.05rem;}
.ec-tpl-compact .ec-store-grid{gap:8px;}
.ec-tpl-compact .ec-store-grid .product-card h3{font-size:.82rem;}

/* ---- PRO templates ---- */
.ec-tpl-magazine .ec-store-head{border-top:0;border-bottom:3px solid var(--acc);border-radius:0;background:transparent;
  border-left:0;border-right:0;padding-left:0;padding-right:0;}
.ec-tpl-magazine .ec-store-meta h2{font-size:1.6rem;letter-spacing:-.4px;}
.ec-tpl-magazine .ec-section-title{text-transform:uppercase;letter-spacing:2px;font-size:.8rem;}
.ec-tpl-magazine .ec-store-grid{gap:18px;}
.ec-tpl-magazine .ec-store-grid .product-card:first-child{grid-column:1 / -1;}

.ec-tpl-showcase .ec-store-head{flex-direction:column;text-align:center;border-top:0;
  background:linear-gradient(180deg,color-mix(in srgb,var(--acc) 12%,#fff),#fff);}
.ec-tpl-showcase .ec-store-sub{justify-content:center;}
.ec-tpl-showcase .ec-store-banner{max-height:300px;border-radius:20px;}
.ec-tpl-showcase .ec-store-banner img{max-height:300px;}
.ec-tpl-showcase .ec-store-grid .product-image{aspect-ratio:1;}

.ec-tpl-boutique .ec-store-head{border-top:0;border-radius:22px;padding:26px;flex-direction:column;text-align:center;}
.ec-tpl-boutique .ec-store-meta h2{font-family:Georgia,'Times New Roman',serif;font-size:1.5rem;}
.ec-tpl-boutique .ec-store-sub{justify-content:center;}
.ec-tpl-boutique .ec-store-tagline{font-style:italic;font-weight:500;}
.ec-tpl-boutique .ec-store-grid{gap:20px;}

.ec-tpl-market .ec-store-head{padding:10px 12px;border-top-width:2px;}
.ec-tpl-market .ec-store-grid{gap:6px;}
.ec-tpl-market .ec-store-grid .product-card{padding:8px;}
.ec-tpl-market .ec-store-grid .product-price{font-size:1.02rem;color:var(--acc);}
.ec-tpl-market .ec-store-grid .product-member-price{display:none;}

.ec-tpl-lookbook .ec-store-head{border-top:0;border-bottom:1px solid var(--ec-shadow,#d8dde2);border-radius:0;
  border-left:0;border-right:0;background:transparent;}
.ec-tpl-lookbook .ec-store-grid .product-image{aspect-ratio:3/4;}
.ec-tpl-lookbook .ec-store-grid .rating,
.ec-tpl-lookbook .ec-store-grid .product-offer{display:none;}

.ec-tpl-spotlight .ec-store-grid{grid-template-columns:1fr;gap:14px;}
.ec-tpl-spotlight .ec-store-grid .product-image{aspect-ratio:16/9;}
.ec-tpl-spotlight .ec-store-head{border-top-width:5px;}

/* ---- Card treatments (soft/sharp free · raised/outline Pro) ---- */
.ec-card-sharp .ec-store-grid .product-card{border-radius:2px;}
.ec-card-shadow .ec-store-grid .product-card{box-shadow:0 8px 22px rgba(15,23,42,.14);border-color:transparent;}
.ec-card-outline .ec-store-grid .product-card{box-shadow:none;border:2px solid var(--acc);}

@media (min-width:761px){
  .ec-tpl-magazine .ec-store-grid .product-card:first-child .product-image{aspect-ratio:21/9;}
}
@media (max-width:560px){
  .ec-tpl-magazine .ec-store-meta h2{font-size:1.25rem;}
  .ec-tpl-boutique .ec-store-head{padding:18px;}
  .ec-tpl-magazine .ec-store-grid,
  .ec-tpl-boutique .ec-store-grid{gap:10px;}
}

/* ===== V7 — App pull-to-refresh + loading screen (app-only DOM) ===== */
.app-loading-overlay{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.6);}
.app-loading-overlay.show{display:flex;}
.app-loading-spin{width:40px;height:40px;border-radius:50%;border:3px solid rgba(40,53,77,.2);border-top-color:#28354d;animation:ecspin .8s linear infinite;}
.app-ptr{position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:99998;margin-top:-46px;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.18);display:none;align-items:center;justify-content:center;will-change:transform;}
.app-ptr.show{display:flex;}
.app-ptr-spin{width:20px;height:20px;border-radius:50%;border:2px solid rgba(40,53,77,.28);border-top-color:#28354d;transition:transform .1s linear;}
.app-ptr.ready .app-ptr-spin{animation:ecspin .7s linear infinite;}
@keyframes ecspin{to{transform:rotate(360deg);}}

/* The app's seller screens are read-only, so order cards carry no action row —
   see .seller-web-cards / .seller-inline-cta for the links into the website. */

/* ===== V7 · 7D — admin Ranking board (score breakdown bars) ===== */
.aa-signals{ margin:10px 0 4px; display:grid; gap:6px; }
.aa-sig{ display:flex; align-items:center; gap:10px; font-size:.78rem; }
.aa-sig-lbl{ flex:0 0 128px; color:#475569; }
.aa-sig-lbl small{ color:#94a3b8; font-size:.9em; }
.aa-sig-bar{ flex:1; height:7px; background:#eef2f6; border-radius:99px; overflow:hidden; }
.aa-sig-bar i{ display:block; height:100%; background:linear-gradient(90deg,#7db3e8,#28354d); border-radius:99px; }
.aa-sig-val{ flex:0 0 26px; text-align:right; font-weight:700; color:#28354d; }
@media (max-width:560px){
  .aa-sig-lbl{ flex-basis:96px; font-size:.72rem; }
}

/* ===== Glossary tooltips — plain-English hints for admin jargon =============
   A dotted underline marks an explained word; the bubble fades itself out
   after a few seconds (the thin bar along the bottom is the countdown). */
.ec-term{
  border-bottom:1px dashed currentColor; cursor:help; text-underline-offset:2px;
  transition:opacity .15s ease;
}
.ec-term:hover,.ec-term:focus-visible{ opacity:.75; outline:none; }
.ec-term:focus-visible{ border-radius:3px; box-shadow:0 0 0 2px rgba(125,179,232,.55); }

.ec-tipbox{
  position:fixed; z-index:100000; max-width:min(320px,calc(100vw - 24px));
  background:#0f172a; color:#f1f5f9; border-radius:12px; padding:11px 14px 13px;
  box-shadow:0 14px 40px rgba(2,6,23,.34), 0 2px 6px rgba(2,6,23,.22);
  font-family:var(--display,'Poppins',system-ui,sans-serif); pointer-events:none;
  opacity:0; transform:translateY(6px) scale(.97); transform-origin:50% 100%;
  transition:opacity .18s ease, transform .18s cubic-bezier(.2,.9,.3,1.2);
  overflow:hidden;
}
.ec-tipbox.below{ transform:translateY(-6px) scale(.97); transform-origin:50% 0; }
.ec-tipbox.show{ opacity:1; transform:translateY(0) scale(1); }
.ec-tipbox-title{
  font-size:.74rem; font-weight:800; letter-spacing:.6px; text-transform:uppercase;
  color:#7db3e8; margin-bottom:5px;
}
.ec-tipbox-body{ font-size:.82rem; line-height:1.55; color:#e2e8f0; }
.ec-tipbox-arrow{
  position:absolute; bottom:-5px; width:11px; height:11px; background:#0f172a;
  transform:translateX(-50%) rotate(45deg); border-radius:2px;
}
.ec-tipbox.below .ec-tipbox-arrow{ bottom:auto; top:-5px; }
/* Countdown bar — shows the hint is about to close on its own. */
.ec-tipbox-time{
  position:absolute; left:0; bottom:0; height:2px; width:100%;
  background:linear-gradient(90deg,#7db3e8,#38bdf8); transform-origin:0 50%;
}
.ec-tipbox.show .ec-tipbox-time{ animation:ecTipCountdown 5.2s linear forwards; }
@keyframes ecTipCountdown{ from{ transform:scaleX(1); } to{ transform:scaleX(0); } }

@media (prefers-reduced-motion:reduce){
  .ec-tipbox{ transition:opacity .12s linear; transform:none !important; }
  .ec-tipbox.show .ec-tipbox-time{ animation:none; }
}

/* ============================================================
   VOLUME 8 · ADMIN "USERS" TAB (traffic + people + View-more drawer)
   Light admin theme, same tokens as .adm-ov-* / .adm-ana-* above.
   Everything here is prefixed .au- so it can only affect this tab.
   ============================================================ */
.adm-ana-note{font-size:.78rem;color:#64748b;margin:8px 0 0;line-height:1.5;}

/* live strip */
.au-live{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;padding:10px 14px;margin-bottom:10px;font-size:.85rem;color:#334155;box-shadow:0 6px 16px rgba(15,23,42,.05);}
.au-live strong{font-family:var(--display);font-size:1.25rem;font-weight:900;color:#111827;line-height:1;}
.au-dot{width:9px;height:9px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 0 rgba(22,163,74,.6);animation:auPulse 2s infinite;}
@keyframes auPulse{70%{box-shadow:0 0 0 8px rgba(22,163,74,0);}100%{box-shadow:0 0 0 0 rgba(22,163,74,0);}}
.au-live-split{color:#64748b;font-size:.8rem;}
.au-live .adm-ana-chip{margin-left:auto;}
.au-feed{display:flex;flex-direction:column;gap:0;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;margin-bottom:16px;overflow:hidden;}
.au-feed-row{display:grid;grid-template-columns:1.2fr 1.4fr 1fr auto;gap:10px;align-items:center;padding:8px 14px;border-bottom:1px solid rgba(15,23,42,.06);font-size:.8rem;}
.au-feed-row:last-child{border-bottom:0;}
.au-feed-who{font-weight:700;color:#111827;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.au-feed-who.is-guest{color:#64748b;font-weight:600;}
.au-feed-page{color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.au-feed-meta{color:#64748b;font-size:.74rem;white-space:nowrap;}
@media(max-width:720px){.au-feed-row{grid-template-columns:1fr 1fr;}}

/* toolbar + people table */
.au-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.au-search{flex:1 1 220px;min-width:0;padding:9px 13px;border:1px solid rgba(15,23,42,.15);border-radius:10px;font-family:inherit;font-size:.85rem;color:#111827;background:#fff;}
.au-search:focus{outline:none;border-color:#172337;}
.au-sort{padding:9px 12px;border:1px solid rgba(15,23,42,.15);border-radius:10px;background:#fff;font-family:inherit;font-size:.82rem;color:#334155;font-weight:600;}
.au-table td{vertical-align:top;}
.au-table small{color:#64748b;font-size:.76rem;}
.au-tag{display:inline-block;font-size:.66rem;font-weight:800;padding:2px 7px;border-radius:999px;margin-top:4px;text-transform:uppercase;letter-spacing:.02em;}
.au-tag-mem{background:#fef3c7;color:#92400e;}
.au-tag-sell{background:#dbeafe;color:#1e40af;}
.au-tag-early{background:#dcfce7;color:#166534;}
.au-tag-quiet{background:#f1f5f9;color:#64748b;}
.au-more{background:none;border:0;color:#1559b3;font-weight:700;font-size:.8rem;cursor:pointer;text-decoration:underline;white-space:nowrap;padding:0;}

/* View-more drawer */
body.au-noscroll{overflow:hidden;}
.au-drawer{position:fixed;inset:0;z-index:1200;display:none;}
.au-drawer.is-open{display:block;}
.au-drawer-back{position:absolute;inset:0;background:rgba(15,23,42,.45);}
.au-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(560px,100%);background:#f8fafc;box-shadow:-12px 0 32px rgba(15,23,42,.2);overflow-y:auto;animation:auSlide .22s ease;}
@keyframes auSlide{from{transform:translateX(24px);opacity:.4;}to{transform:none;opacity:1;}}
.au-drawer-body{padding:18px;}
.au-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;}
.au-drawer-head h3{font-family:var(--display);font-size:1.1rem;font-weight:900;color:#111827;word-break:break-all;}
.au-drawer-head small{color:#64748b;font-size:.78rem;word-break:break-all;}
.au-drawer-x{background:none;border:0;font-size:1.6rem;line-height:1;color:#64748b;cursor:pointer;padding:0 4px;}
.au-dtabs{position:sticky;top:0;background:#f8fafc;padding:6px 0;z-index:2;}
.au-kvs{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;padding:6px 14px;margin-bottom:12px;}
.au-kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(15,23,42,.06);font-size:.82rem;color:#64748b;}
.au-kv:last-child{border-bottom:0;}
.au-kv b{color:#111827;text-align:right;word-break:break-word;}
.au-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.au-actions .adm-ana-chip{text-decoration:none;display:inline-block;}
.au-visit{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:12px;padding:10px 14px;margin-bottom:8px;}
.au-visit summary{cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;font-size:.8rem;}
.au-visit summary::-webkit-details-marker{display:none;}
.au-visit-when{font-weight:800;color:#111827;}
.au-visit-meta{color:#64748b;}
.au-pages{list-style:none;margin:8px 0 0;padding:0;}
.au-pages li{display:flex;justify-content:space-between;gap:12px;font-size:.78rem;color:#334155;padding:5px 0;border-bottom:1px solid rgba(15,23,42,.06);}
.au-pages li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}