/* ══════════════════════════════════════════
   Theme-colors-fixed.css — WebStore_5
   Design 31-78
   ══════════════════════════════════════════ */

/* ── الألوان الأساسية W5 (31-46) نفس W4 ── */
[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:#264653; --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:#1a1a1a; --pd:#000; --pl:rgba(0,0,0,.05); --plm:rgba(0,0,0,.12); --psh:rgba(0,0,0,.15); }

/* ── ألوان جديدة W5 (47+) ── */

/* 47-48: Pink / Rose */
[data-color="pink"] {
  --p:#e91e8c; --pd:#b5156d;
  --pl:rgba(233,30,140,.10); --plm:rgba(233,30,140,.22); --psh:rgba(233,30,140,.35);
}

/* 49-50: Crimson */
[data-color="crimson"] {
  --p:#b71c1c; --pd:#7f0000;
  --pl:rgba(183,28,28,.10); --plm:rgba(183,28,28,.22); --psh:rgba(183,28,28,.35);
}

/* 51-52: Indigo */
[data-color="indigo"] {
  --p:#3949ab; --pd:#1a237e;
  --pl:rgba(57,73,171,.10); --plm:rgba(57,73,171,.22); --psh:rgba(57,73,171,.35);
}

/* 53-54: Cyan */
[data-color="cyan"] {
  --p:#0097a7; --pd:#006064;
  --pl:rgba(0,151,167,.10); --plm:rgba(0,151,167,.22); --psh:rgba(0,151,167,.35);
}

/* 55-56: Lime */
[data-color="lime"] {
  --p:#558b2f; --pd:#33691e;
  --pl:rgba(85,139,47,.10); --plm:rgba(85,139,47,.22); --psh:rgba(85,139,47,.35);
}

/* 57-58: Brown */
[data-color="brown"] {
  --p:#6d4c41; --pd:#4e342e;
  --pl:rgba(109,76,65,.10); --plm:rgba(109,76,65,.22); --psh:rgba(109,76,65,.35);
}

/* 59-60: Slate */
[data-color="slate"] {
  --p:#455a64; --pd:#263238;
  --pl:rgba(69,90,100,.10); --plm:rgba(69,90,100,.22); --psh:rgba(69,90,100,.35);
}

/* 61-62: Violet */
[data-color="violet"] {
  --p:#7b1fa2; --pd:#4a148c;
  --pl:rgba(123,31,162,.10); --plm:rgba(123,31,162,.22); --psh:rgba(123,31,162,.35);
}

/* 63-64: Amber */
[data-color="amber"] {
  --p:#f57c00; --pd:#bf360c;
  --pl:rgba(245,124,0,.10); --plm:rgba(245,124,0,.22); --psh:rgba(245,124,0,.35);
}

/* 65-66: Emerald */
[data-color="emerald"] {
  --p:#00695c; --pd:#004d40;
  --pl:rgba(0,105,92,.10); --plm:rgba(0,105,92,.22); --psh:rgba(0,105,92,.35);
}

/* 67-68: Rose Gold */
[data-color="rosegold"] {
  --p:#b76e79; --pd:#8b4f58;
  --pl:rgba(183,110,121,.10); --plm:rgba(183,110,121,.22); --psh:rgba(183,110,121,.35);
}

/* 69-70: Midnight */
[data-color="midnight"] {
  --p:#1a1a2e; --pd:#0f0f1a;
  --pl:rgba(26,26,46,.10); --plm:rgba(26,26,46,.22); --psh:rgba(26,26,46,.50);
}

/* 71-72: Coral */
[data-color="coral"] {
  --p:#ff5733; --pd:#c0392b;
  --pl:rgba(255,87,51,.10); --plm:rgba(255,87,51,.22); --psh:rgba(255,87,51,.35);
}

/* 73-74: Forest */
[data-color="forest"] {
  --p:#1b5e20; --pd:#0a3d0a;
  --pl:rgba(27,94,32,.10); --plm:rgba(27,94,32,.22); --psh:rgba(27,94,32,.35);
}

/* 75-76: Steel */
[data-color="steel"] {
  --p:#37474f; --pd:#1c313a;
  --pl:rgba(55,71,79,.10); --plm:rgba(55,71,79,.22); --psh:rgba(55,71,79,.35);
}

/* 77-78: Magenta */
[data-color="magenta"] {
  --p:#ad1457; --pd:#78002e;
  --pl:rgba(173,20,87,.10); --plm:rgba(173,20,87,.22); --psh:rgba(173,20,87,.35);
}

/* ── Themes ── */
[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;
  --hdr-txt:#ffffff; --hdr-txt-em:#ffe033;
  --hdr-ico-bg:rgba(255,255,255,.18); --hdr-ico-brd:rgba(255,255,255,.28);
  --hdr-btn-bg:#ffffff; --hdr-btn-txt:var(--pd);
}
[data-theme="dark"] {
  --bg:#1a1a1a; --sur:#242424; --sur2:#2c2c2c; --sur3:#323232;
  --txt:#f0f0f0; --txt2:#b0b0b0; --txt3:#707070; --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-txt:#ffffff; --hdr-txt-em:#ffe033;
  --hdr-ico-bg:rgba(255,255,255,.15); --hdr-ico-brd:rgba(255,255,255,.22);
  --hdr-btn-bg:#ffffff; --hdr-btn-txt:var(--pd);
}

/* white override */
[data-color="white"] {
  --hdr-txt:#1a1a1a; --hdr-txt-em:#444;
  --hdr-ico-bg:rgba(0,0,0,.06); --hdr-ico-brd:rgba(0,0,0,.14);
  --hdr-btn-bg:#1a1a1a; --hdr-btn-txt:#fff;
}

/* midnight override — النص فاتح دائماً */
[data-color="midnight"] {
  --hdr-txt:#e0e0ff; --hdr-txt-em:#a0a0ff;
  --hdr-ico-bg:rgba(255,255,255,.12); --hdr-ico-brd:rgba(255,255,255,.20);
}

/* ── Header colors ── */
:not([data-color="white"]):not([data-color="midnight"]) {
  --hdr-bg:var(--p);
  --hdr-brd:transparent;
  --hdr-txt:#ffffff;
  --hdr-txt-em:#ffe033;
  --hdr-ico-bg:rgba(255,255,255,.18);
  --hdr-ico-brd:rgba(255,255,255,.28);
  --hdr-btn-bg:#ffffff;
  --hdr-btn-txt:var(--pd);
}
[data-color="white"]   { --hdr-bg:#ffffff; --hdr-brd:rgba(0,0,0,.10); }
[data-color="midnight"]{ --hdr-bg:#1a1a2e; --hdr-brd:rgba(255,255,255,.08); }

.hdr { background:var(--hdr-bg) !important; border-bottom:1px solid var(--hdr-brd) !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 .login-btn { background:var(--hdr-btn-bg) !important; color:var(--hdr-btn-txt) !important; }
.hdr .u-name { color:var(--hdr-txt) !important; }
.ico-badge { border-color:var(--hdr-bg) !important; }

/* ── Accent colors shared ── */
.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; }
.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; }
.w5-sec-all { color:var(--p) !important; background:var(--pl) !important; border-color:var(--plm) !important; }
.w5-sec-all:hover { background:var(--p) !important; color:#fff !important; }
.w5card-price { color:var(--p) !important; }
.w5card-btn { background:var(--p) !important; box-shadow:0 3px 10px var(--psh) !important; }
.w5card-btn:hover { background:var(--pd) !important; }
.bn:hover,.bn.on { color:var(--p) !important; }
.bn.on .bn-ico,.bn:hover .bn-ico { background:var(--pl) !important; }
.bn-cart-btn { background:var(--p) !important; box-shadow:0 3px 12px var(--psh) !important; }
.bn-cart-btn:hover { background:var(--pd) !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; }
.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; }
.nav-a:hover,.nav-a.on { color:var(--p) !important; border-bottom-color:var(--p) !important; background:var(--pl) !important; }
.b3h2__dot.on { background:var(--p) !important; }
.b3h2__btn:hover { background:var(--p) !important; border-color:var(--p) !important; color:#fff !important; }
.hero-dot.on { background:#fff; }
.hdr.scrolled { background:color-mix(in srgb, var(--p) 88%, transparent) !important; }