[data-color="green"] {
    --p: #1a7a3c;
    --pd: #125529;
    --pl: rgba(26, 122, 60, .10);
    --plm: rgba(26, 122, 60, .22);
    --psh: rgba(26, 122, 60, .35);
}

[data-color="red"] {
    --p: #d42020;
    --pd: #a01818;
    --pl: rgba(212, 32, 32, .10);
    --plm: rgba(212, 32, 32, .22);
    --psh: rgba(212, 32, 32, .35);
}

[data-color="blue"] {
    --p: #1565c0;
    --pd: #0d47a1;
    --pl: rgba(21, 101, 192, .10);
    --plm: rgba(21, 101, 192, .22);
    --psh: rgba(21, 101, 192, .35);
}

[data-color="purple"] {
    --p: #6a4c93;
    --pd: #4e3570;
    --pl: rgba(106, 76, 147, .10);
    --plm: rgba(106, 76, 147, .22);
    --psh: rgba(106, 76, 147, .35);
}

[data-color="orange"] {
    --p: #e76f51;
    --pd: #c45a3e;
    --pl: rgba(231, 111, 81, .10);
    --plm: rgba(231, 111, 81, .22);
    --psh: rgba(231, 111, 81, .35);
}

[data-color="teal"] {
    --p: #2a9d8f;
    --pd: #1d7a6e;
    --pl: rgba(42, 157, 143, .10);
    --plm: rgba(42, 157, 143, .22);
    --psh: rgba(42, 157, 143, .35);
}

[data-color="navy"] {
    --p: #2c708b;
    --pd: #1a303a;
    --pl: rgba(38, 70, 83, .10);
    --plm: rgba(38, 70, 83, .22);
    --psh: rgba(38, 70, 83, .35);
}

[data-color="gold"] {
    --p: #c77a00;
    --pd: #9a5f00;
    --pl: rgba(199, 122, 0, .10);
    --plm: rgba(199, 122, 0, .22);
    --psh: rgba(199, 122, 0, .35);
}

[data-color="white"] {
    --p: #292929;
    --pd: #333333;
    --pl: rgba(0, 0, 0, .05);
    --plm: rgba(0, 0, 0, .12);
    --psh: rgba(0, 0, 0, .15);
    --hdr-bg: #ffffff;
    --hdr-brd: rgba(0, 0, 0, 0.12);
    --hdr-sh: 0 2px 10px rgba(0, 0, 0, 0.08);
    --hdr-txt: #292929;
    --hdr-txt-em: #292929;
    --hdr-ico-bg: rgba(0, 0, 0, 0.05);
    --hdr-ico-brd: rgba(0, 0, 0, 0.12);
    --hdr-btn-bg: #292929;
    --hdr-btn-txt: #ffffff;
}

[data-color="black"] {
    --p: #292929;
    --pd: #000000;
    --pl: rgba(0, 0, 0, .08);
    --plm: rgba(0, 0, 0, .18);
    --psh: rgba(0, 0, 0, .35);
    --hdr-bg: #292929;
    --hdr-brd: transparent;
    --hdr-sh: 0 2px 14px rgba(0, 0, 0, 0.40);
    --hdr-txt: #ffffff;
    --hdr-txt-em: #e0e0e0;
    --hdr-ico-bg: rgba(255, 255, 255, 0.12);
    --hdr-ico-brd: rgba(255, 255, 255, 0.20);
    --hdr-btn-bg: #ffffff;
    --hdr-btn-txt: #292929;
}

:not([data-color="white"]):not([data-color="black"]) {
    --hdr-bg: var(--p);
    --hdr-brd: transparent;
    --hdr-txt: #ffffff;
    --hdr-txt-em: #ffe033;
    --hdr-ico-bg: rgba(255, 255, 255, 0.18);
    --hdr-ico-brd: rgba(255, 255, 255, 0.28);
    --hdr-btn-bg: #ffffff;
    --hdr-btn-txt: var(--pd);
}

[data-theme="light"] {
    --bg: #f0f2f5;
    --sur: #fff;
    --sur2: #f6f7fa;
    --sur3: #ecedf2;
    --txt: #0f1117;
    --txt2: #4a5068;
    --txt3: #9098b1;
    --brd: #e3e5ed;
    --red: #d42020;
    --ylw: #f5c800;
    --grn: #1a8040;
    --sh: 0 1px 8px rgba(0, 0, 0, .06);
    --sh2: 0 6px 24px rgba(0, 0, 0, .12);
    --nav: #111827;
}

[data-theme="dark"] {
    --bg: #292929;
    --sur: #242424;
    --sur2: #2c2c2c;
    --sur3: #323232;
    --txt: #f0f0f0;
    --txt2: #b0b0b0;
    --txt3: #d5d5d5;
    --brd: #3a3a3a;
    --red: #e05555;
    --ylw: #f5c800;
    --grn: #2ab55a;
    --sh: 0 1px 8px rgba(0, 0, 0, .5);
    --sh2: 0 6px 24px rgba(0, 0, 0, .7);
    --nav: #111111;
}

.hdr {
    background: var(--hdr-bg) !important;
    border-bottom: 1px solid var(--hdr-brd) !important;
    box-shadow: var(--hdr-sh) !important;
}
.logo-name { color: var(--hdr-txt) !important; }
.logo-name em { color: var(--hdr-txt-em) !important; }
.hdr .ico-btn {
    background: var(--hdr-ico-bg) !important;
    border-color: var(--hdr-ico-brd) !important;
    color: var(--hdr-txt) !important;
}
.hdr .ico-btn:hover {
    background: rgba(128, 128, 128, .20) !important;
    border-color: rgba(128, 128, 128, .40) !important;
}
.hdr .login-btn {
    background: var(--hdr-btn-bg) !important;
    color: var(--hdr-btn-txt) !important;
}
.hdr .login-btn:hover { opacity: .85; }
.hdr .u-name { color: var(--hdr-txt) !important; }
.ico-badge { border-color: var(--hdr-bg) !important; }

[data-color="white"],[data-color="black"] .ann { background: #292929 !important; color: #fff !important; }
[data-color="white"],[data-color="black"] .c-tab.on .c-tab-img { border-color: #292929 !important; box-shadow: 0 0 0 3px rgba(0,0,0,.08) !important; }
[data-color="white"],[data-color="black"] .c-tab.on .c-tab-lbl { color: #292929 !important; }
[data-color="white"],[data-color="black"] .cat-arr:hover { background: #292929 !important; border-color: #292929 !important; color: #fff !important; }
[data-color="white"],[data-color="black"] .nav-a:hover,
[data-color="white"],[data-color="black"] .nav-a.on { color: #292929 !important; border-bottom-color: #292929 !important; }
[data-color="white"] .discover-banner { background: linear-gradient(135deg, #d0d0d0, #e8e8e8 65%, #f5f5f5) !important; box-shadow: 0 8px 28px rgba(0,0,0,.10) !important; }
[data-color="white"],[data-color="black"] .discover-ttl { color: #292929 !important; }
[data-color="white"] .discover-sub { color: rgba(0,0,0,.55) !important; }
[data-color="black"] .discover-sub { color: rgba(255,255,255,.75) !important; }
[data-color="white"],[data-color="black"] .discover-btn { background: #292929 !important; color: #fff !important; }
[data-color="white"],[data-color="black"] .discover-btn:hover { background: #333 !important; }
[data-color="white"],[data-color="black"] .b3h2__ico-new { background: linear-gradient(135deg, #555, #292929) !important; box-shadow: 0 4px 14px rgba(0,0,0,.20) !important; }

.cat-bar-sticky { border-bottom: 2.5px solid var(--plm) !important; }
.c-tab.on .c-tab-img { border-color: var(--p) !important; box-shadow: 0 0 0 3px var(--pl) !important; transform: scale(1.07) !important; }
.c-tab.on .c-tab-lbl { color: var(--p) !important; font-weight: 900 !important; }
@media(min-width:900px) {
    .c-tab.on .c-tab-img { border-color: var(--p) !important; box-shadow: 0 0 0 3px var(--pl) !important; transform: scale(1.07) !important; }
    .c-tab.on .c-tab-lbl { color: var(--p) !important; font-weight: 900 !important; }
}
.cat-arr:hover { background: var(--p) !important; border-color: var(--p) !important; color: #fff !important; }
.sec-ttl { color: var(--p) !important; }
.sec-hdr { border-bottom-color: var(--plm) !important; }
.pcard { border-top: 3px solid var(--plm) !important; }
.pcard:hover { border-top-color: var(--p) !important; }
.p-price { color: var(--p) !important; font-weight: 900 !important; }
.p-rib { background: var(--p) !important; }

/* cart button — light theme normal shadow, dark theme softer */
.p-cart-btn.add {
    background: var(--p) !important;
    color: #ffffff !important;
    border-color: var(--bg) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.30) !important;
}
[data-theme="dark"] .p-cart-btn.add {
    box-shadow: 0 2px 6px rgba(0,0,0,.20) !important;
}
.p-cart-btn.add:hover { background: var(--pd) !important; transform: scale(1.1) !important; }

.bn-cart-btn { background: var(--p) !important; }
.bn-cart-btn:hover { background: var(--pd) !important; }
.bn.on,.bn:hover { color: var(--p) !important; }
.dw-price { color: var(--p) !important; }
.dqb.p { background: var(--p) !important; }
.dw-ckout { background: var(--p) !important; }
.dw-ckout:hover { background: var(--pd) !important; }
.s-inp:focus { border-color: var(--p) !important; }
.s-price { color: var(--p) !important; }
.s-add { background: var(--p) !important; }
.notif-item.unread { background: var(--pl) !important; }
.n-dot { background: var(--p) !important; }
.b3h2__dot.on { background: var(--p) !important; }
.b3h2__btn:hover { background: var(--p) !important; border-color: var(--p) !important; color: #ffffff !important; }
.pcard-more { border-color: var(--plm) !important; background: var(--pl) !important; }
.pcard-more:hover { border-color: var(--p) !important; }
.pcard-more-ring { border-color: var(--p) !important; color: var(--p) !important; }
.pcard-more:hover .pcard-more-ring { background: var(--p) !important; color: #fff !important; }
.pcard-more-lbl { color: var(--p) !important; }
.discover-banner { background: linear-gradient(135deg, var(--pd), var(--p) 100%, rgba(255,255,255,.15)) !important; box-shadow: 0 8px 28px var(--psh) !important; }
.auth-tab.on { color: var(--p) !important; border-bottom-color: var(--p) !important; }
.a-inp:focus { border-color: var(--p) !important; }
.a-btn { background: var(--p) !important; }
.a-btn:hover { background: var(--pd) !important; }
.login-btn { background: var(--p) !important; }
.login-btn:hover { background: var(--pd) !important; }
.nav-a:hover,.nav-a.on { color: var(--p) !important; border-bottom-color: var(--p) !important; background: var(--pl) !important; }
.nav-a:hover .nav-ico,.nav-a.on .nav-ico { background: var(--plm) !important; }
.sec-all { color: var(--p) !important; background: var(--pl) !important; border-color: var(--plm) !important; }
.sec-all:hover { background: var(--p) !important; color: #fff !important; border-color: var(--p) !important; }
.sec-all-cnt { background: var(--p) !important; }

/* footer */
.ft-col ul li a:hover { color: var(--p) !important; }
.ft-social a:hover { background: var(--pl) !important; border-color: var(--p) !important; transform: translateY(-2px); }
.ft-lang-btn:hover { border-color: var(--p) !important; color: var(--p) !important; }
.ft-lang-opt:hover { color: var(--p) !important; background: var(--pl) !important; }
.ft-bottom { background: var(--sur3) !important; border-top: 1px solid var(--brd) !important; }
[data-color="white"] .ft-col ul li a:hover,[data-color="black"] .ft-col ul li a:hover { color: #292929 !important; }
[data-color="white"] .ft-social a:hover,[data-color="black"] .ft-social a:hover { background: rgba(0,0,0,.08) !important; border-color: #292929 !important; }
[data-color="white"] .ft-lang-btn:hover,[data-color="black"] .ft-lang-btn:hover { border-color: #292929 !important; color: #292929 !important; }