/* ═══════════════════════════════════════════════════════════════════
   themes.css — پوسته‌های آماده هدر و بنر (بخش بالای صفحه اصلی)
   ───────────────────────────────────────────────────────────────────
   پوسته با کلاس روی <body> فعال می‌شود (از پنل مدیریت → لوگوها و پوسته):
     th-classic  — کلاسیک سبز آرام (پیش‌فرض؛ بدون override)
     th-glass    — شیشه‌ای مدرن روی گرادیان رنگی
     th-midnight — شبانه زمردی با درخشش
     th-sunset   — غروب گرم (کهربایی و رز)
     th-emerald  — زمردی سلطنتی با لهجه طلایی
     th-minimal  — مینیمال سفید و مشکی
   فقط هدر چسبان + بنر (هیرو) و اجزای داخلش استایل می‌گیرند؛
   بقیه صفحه (ماشین‌حساب، فوتر و…) با متغیرهای پایه خودش می‌ماند.
   ═══════════════════════════════════════════════════════════════════ */

/* ═════════════════════ ۲) شیشه‌ای مدرن (glass) ═════════════════════ */

/* نوار گرادیان رنگی پشت هدر و بنر — شیشه‌ها روی آن دیده می‌شوند */
body.th-glass::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 720px; z-index: -1;
  background:
    radial-gradient(880px 460px at 88% -12%, hsl(160 62% 82% / .95), transparent 68%),
    radial-gradient(700px 420px at 4% 6%, hsl(46 90% 84% / .75), transparent 66%),
    radial-gradient(620px 380px at 50% 118%, hsl(172 55% 84% / .8), transparent 70%),
    linear-gradient(178deg, hsl(160 45% 92%), hsl(0 0% 100%) 72%);
}
body.th-glass .site-header {
  background: hsl(0 0% 100% / .55);
  backdrop-filter: blur(20px) saturate(1.5);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  border-bottom: 1px solid hsl(0 0% 100% / .85);
  box-shadow: 0 10px 34px hsl(160 50% 30% / .1);
}
body.th-glass .hero {
  background: hsl(0 0% 100% / .44);
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  border: 1px solid hsl(0 0% 100% / .95);
  box-shadow: 0 30px 80px -28px hsl(160 55% 25% / .4);
}
/* حلقه‌های نرم شناور داخل بنر */
body.th-glass .hero-bg {
  background:
    radial-gradient(340px 220px at 92% 8%, hsl(160 70% 60% / .16), transparent 70%),
    radial-gradient(300px 200px at 6% 88%, hsl(42 90% 62% / .14), transparent 70%),
    radial-gradient(240px 160px at 55% -10%, hsl(172 70% 55% / .12), transparent 70%);
}
body.th-glass .hero-bg::after { background-image: radial-gradient(hsl(160 45% 25% / .06) 1px, transparent 1.4px); }
body.th-glass .hero-badge {
  background: hsl(0 0% 100% / .65); border-color: hsl(160 40% 78% / .9); color: hsl(163 62% 24%);
}
body.th-glass .hero-side {
  background: hsl(0 0% 100% / .5); border-color: hsl(0 0% 100% / .95);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
body.th-glass a.hero-chip:hover { background: hsl(0 0% 100% / .7); }
body.th-glass .btn-hero-secondary { background: hsl(0 0% 100% / .6); }

[data-theme="dark"] body.th-glass::before {
  background:
    radial-gradient(880px 460px at 88% -12%, hsl(160 45% 16% / .9), transparent 68%),
    radial-gradient(700px 420px at 4% 6%, hsl(42 45% 14% / .75), transparent 66%),
    linear-gradient(178deg, hsl(162 35% 10%), hsl(var(--bg)) 72%);
}
[data-theme="dark"] body.th-glass .site-header {
  background: hsl(161 30% 9% / .6); border-bottom-color: hsl(160 20% 22% / .8);
  box-shadow: none;
}
[data-theme="dark"] body.th-glass .hero { background: hsl(161 28% 11% / .5); border-color: hsl(160 22% 26%); }

/* ═════════════════════ ۳) شبانه زمردی (midnight) ═════════════════════ */

body.th-midnight .site-header {
  background: hsl(172 34% 7% / .94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid hsl(167 32% 17%);
}
body.th-midnight .brand-text strong { color: hsl(160 30% 96%); }
body.th-midnight .brand-text small { color: hsl(165 16% 62%); }
body.th-midnight .nav-desktop a { color: hsl(165 18% 74%); }
body.th-midnight .nav-desktop a:hover { color: hsl(0 0% 100%); background: hsl(165 22% 15%); }
body.th-midnight .header-actions .btn-ghost { color: hsl(165 20% 82%); }
body.th-midnight .header-actions .btn-ghost:hover { background: hsl(165 22% 15%); }
body.th-midnight .header-shop {
  background: hsl(165 24% 12%); border-color: hsl(163 30% 26%); color: hsl(160 35% 80%);
}
body.th-midnight .header-shop:hover { border-color: hsl(160 45% 42%); background: hsl(165 28% 15%); color: hsl(0 0% 100%); }
body.th-midnight .hero {
  border-color: hsl(167 30% 19%);
  background:
    radial-gradient(720px 400px at 90% -18%, hsl(160 62% 24% / .55), transparent 66%),
    radial-gradient(540px 320px at 2% 112%, hsl(168 55% 18% / .5), transparent 62%),
    linear-gradient(166deg, hsl(173 36% 9%) 0%, hsl(170 40% 12%) 55%, hsl(168 45% 8%) 100%);
  box-shadow: 0 1px 2px hsl(0 0% 0% / .5), 0 30px 70px -22px hsl(0 0% 0% / .65);
}
/* درخشش‌های سبز و ستاره‌های ریز */
body.th-midnight .hero-bg {
  background:
    radial-gradient(420px 260px at 85% 0%, hsl(152 70% 45% / .18), transparent 70%),
    radial-gradient(300px 200px at 8% 100%, hsl(160 65% 40% / .14), transparent 68%);
}
body.th-midnight .hero-bg::after {
  background-image:
    radial-gradient(hsl(152 60% 70% / .16) 1px, transparent 1.4px),
    radial-gradient(hsl(152 60% 70% / .08) 1px, transparent 1.4px);
  background-size: 26px 26px, 13px 13px;
  background-position: 0 0, 9px 7px;
  -webkit-mask-image: linear-gradient(to bottom, rgb(0 0 0 / .9), transparent 92%);
  mask-image: linear-gradient(to bottom, rgb(0 0 0 / .9), transparent 92%);
}
body.th-midnight .hero h1 { color: hsl(160 35% 96%); }
body.th-midnight .hero-subtitle { color: hsl(158 45% 74%); }
body.th-midnight .hero-desc { color: hsl(165 14% 70%); }
body.th-midnight .hero-badge {
  background: hsl(164 28% 13% / .85); border-color: hsl(162 34% 28%); color: hsl(158 40% 80%);
}
body.th-midnight .hero-badge .icon { color: hsl(152 60% 62%); }
body.th-midnight .hero-side {
  background: hsl(168 30% 10% / .72); border-color: hsl(166 26% 20%);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 hsl(0 0% 100% / .05);
}
body.th-midnight .hero-chip { border-bottom-color: hsl(166 22% 18%); }
body.th-midnight a.hero-chip:hover { background: hsl(165 26% 14% / .7); }
body.th-midnight .hero-chip-ico { background: hsl(162 30% 16%); color: hsl(152 55% 64%); }
body.th-midnight .hero-chip-title { color: hsl(160 25% 92%); }
body.th-midnight .hero-chip-desc { color: hsl(165 12% 62%); }
body.th-midnight .hero-trust { border-top-color: hsl(166 22% 19%); color: hsl(165 12% 72%); }
body.th-midnight .hero-trust .icon { background: hsl(152 60% 45% / .18); color: hsl(152 60% 66%); }
body.th-midnight .btn-hero-primary {
  background: linear-gradient(155deg, hsl(152 62% 42%), hsl(160 72% 26%));
  box-shadow: 0 12px 34px hsl(155 70% 22% / .55), 0 0 0 1px hsl(152 60% 45% / .5);
}
body.th-midnight .btn-hero-primary:hover { box-shadow: 0 16px 42px hsl(155 75% 26% / .7), 0 0 0 1px hsl(152 65% 55% / .6); }
body.th-midnight .btn-hero-secondary {
  background: hsl(0 0% 100% / .08); color: hsl(160 30% 88%); border-color: hsl(163 26% 30%);
}
body.th-midnight .btn-hero-secondary:hover { border-color: hsl(152 55% 50%); color: hsl(0 0% 100%); }
/* در دارک‌مد هم همان شبانه می‌ماند (فقط سایه‌ها نرم‌تر) */
[data-theme="dark"] body.th-midnight .site-header { background: hsl(172 34% 6% / .96); }

/* ═════════════════════ ۴) غروب گرم (sunset) ═════════════════════ */

body.th-sunset::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 720px; z-index: -1;
  background:
    radial-gradient(900px 460px at 86% -14%, hsl(28 95% 86% / .95), transparent 68%),
    radial-gradient(720px 420px at 6% 8%, hsl(350 80% 88% / .7), transparent 66%),
    linear-gradient(178deg, hsl(32 70% 94%), hsl(0 0% 100%) 74%);
}
body.th-sunset .site-header {
  background: hsl(30 65% 99% / .82);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid hsl(30 55% 88%);
}
/* دکمه «شروع محاسبه» هدر هم کهربایی می‌شود */
body.th-sunset .header-cta {
  background: linear-gradient(155deg, hsl(16 86% 52%), hsl(30 92% 46%));
  box-shadow: 0 8px 20px hsl(22 85% 40% / .32);
}
body.th-sunset .hero {
  border-color: hsl(28 60% 86%);
  background:
    radial-gradient(640px 340px at 92% -16%, hsl(18 92% 62% / .2), transparent 64%),
    radial-gradient(520px 300px at -4% 114%, hsl(350 75% 58% / .14), transparent 60%),
    linear-gradient(170deg, hsl(33 82% 96%) 0%, hsl(0 0% 100%) 55%, hsl(22 72% 95%) 100%);
  box-shadow: 0 1px 2px hsl(25 70% 40% / .06), 0 26px 60px -20px hsl(20 75% 40% / .22);
}
body.th-sunset .hero-bg {
  background:
    radial-gradient(380px 240px at 90% 4%, hsl(32 95% 60% / .16), transparent 70%),
    radial-gradient(300px 190px at 4% 92%, hsl(350 85% 62% / .1), transparent 70%);
}
body.th-sunset .hero-bg::after { background-image: radial-gradient(hsl(25 60% 30% / .05) 1px, transparent 1.4px); }
body.th-sunset .hero h1 { color: hsl(18 68% 16%); }
body.th-sunset .hero-subtitle { color: hsl(16 62% 32%); }
body.th-sunset .hero-desc { color: hsl(20 22% 38%); }
body.th-sunset .hero-badge {
  background: hsl(26 78% 93%); border-color: hsl(26 65% 82%); color: hsl(18 58% 30%);
}
body.th-sunset .hero-badge .icon { color: hsl(22 80% 45%); }
body.th-sunset .hero-side { background: hsl(0 0% 100% / .62); border-color: hsl(28 50% 88%); }
body.th-sunset .hero-chip-ico { background: hsl(25 75% 93%); color: hsl(20 75% 38%); }
body.th-sunset a.hero-chip:hover { background: hsl(25 65% 95% / .8); }
body.th-sunset .hero-chip-title { color: hsl(18 50% 20%); }
body.th-sunset .hero-trust { border-top-color: hsl(28 45% 88%); }
body.th-sunset .hero-trust .icon { background: hsl(25 80% 50% / .14); color: hsl(21 75% 42%); }
body.th-sunset .btn-hero-primary {
  background: linear-gradient(155deg, hsl(14 88% 50%), hsl(29 94% 44%));
  box-shadow: 0 10px 26px hsl(22 85% 40% / .45), inset 0 1px 0 hsl(0 0% 100% / .35), 0 0 0 1px hsl(20 85% 42% / .55);
}
body.th-sunset .btn-hero-primary:hover { box-shadow: 0 14px 34px hsl(22 90% 42% / .55), inset 0 1px 0 hsl(0 0% 100% / .4), 0 0 0 1px hsl(20 85% 50% / .65); }
body.th-sunset .btn-hero-secondary { color: hsl(18 58% 28%); border-color: hsl(27 55% 82%); }
body.th-sunset .btn-hero-secondary:hover { border-color: hsl(16 85% 55%); color: hsl(16 78% 44%); }

[data-theme="dark"] body.th-sunset::before {
  background:
    radial-gradient(900px 460px at 86% -14%, hsl(18 40% 14% / .9), transparent 68%),
    radial-gradient(720px 420px at 6% 8%, hsl(350 32% 14% / .7), transparent 66%),
    linear-gradient(178deg, hsl(20 30% 9%), hsl(var(--bg)) 74%);
}
[data-theme="dark"] body.th-sunset .site-header { background: hsl(20 28% 8% / .9); border-bottom-color: hsl(20 22% 18%); }
[data-theme="dark"] body.th-sunset .hero {
  border-color: hsl(20 26% 18%);
  background:
    radial-gradient(640px 340px at 92% -16%, hsl(16 60% 28% / .4), transparent 64%),
    radial-gradient(520px 300px at -4% 114%, hsl(350 50% 24% / .28), transparent 60%),
    linear-gradient(170deg, hsl(20 32% 11%) 0%, hsl(18 30% 10%) 55%, hsl(22 34% 9%) 100%);
}
[data-theme="dark"] body.th-sunset .hero h1 { color: hsl(25 45% 94%); }
[data-theme="dark"] body.th-sunset .hero-subtitle { color: hsl(22 55% 76%); }
[data-theme="dark"] body.th-sunset .hero-desc { color: hsl(22 14% 68%); }
[data-theme="dark"] body.th-sunset .hero-badge { background: hsl(22 28% 14% / .85); border-color: hsl(22 30% 26%); color: hsl(25 45% 80%); }
[data-theme="dark"] body.th-sunset .hero-badge .icon { color: hsl(25 70% 60%); }
[data-theme="dark"] body.th-sunset .hero-chip-ico { background: hsl(20 26% 16%); color: hsl(24 60% 64%); }
[data-theme="dark"] body.th-sunset .hero-chip-title { color: hsl(24 30% 90%); }
[data-theme="dark"] body.th-sunset .hero-side { background: hsl(20 26% 10% / .6); border-color: hsl(20 22% 19%); }
[data-theme="dark"] body.th-sunset .hero-trust { border-top-color: hsl(20 22% 19%); color: hsl(22 12% 68%); }
[data-theme="dark"] body.th-sunset .hero-trust .icon { background: hsl(22 60% 45% / .2); color: hsl(24 65% 64%); }
[data-theme="dark"] body.th-sunset .btn-hero-secondary { background: hsl(20 24% 13% / .7); color: hsl(24 35% 84%); border-color: hsl(20 24% 26%); }
[data-theme="dark"] body.th-sunset .btn-hero-secondary:hover { border-color: hsl(22 70% 55%); color: hsl(24 75% 70%); }

/* ═════════════════════ ۵) زمردی سلطنتی (emerald) ═════════════════════ */

body.th-emerald .site-header {
  background: linear-gradient(94deg, hsl(161 68% 15%), hsl(158 62% 20%));
  border-bottom: 1px solid hsl(157 55% 26%);
  box-shadow: 0 10px 30px hsl(160 65% 15% / .35);
}
body.th-emerald .brand-text strong { color: hsl(0 0% 100%); }
body.th-emerald .brand-text small { color: hsl(48 45% 78%); }
body.th-emerald .nav-desktop a { color: hsl(155 25% 82%); }
body.th-emerald .nav-desktop a:hover { color: hsl(0 0% 100%); background: hsl(157 40% 22%); }
body.th-emerald .header-actions .btn-ghost { color: hsl(155 30% 85%); }
body.th-emerald .header-actions .btn-ghost:hover { background: hsl(157 40% 22%); }
body.th-emerald .header-shop {
  background: hsl(157 45% 18%); border-color: hsl(155 40% 32%); color: hsl(48 50% 82%);
}
body.th-emerald .header-shop:hover { border-color: hsl(45 60% 55%); background: hsl(157 50% 22%); color: hsl(48 70% 88%); }
body.th-emerald .hero {
  border-color: hsl(157 50% 24%);
  background:
    radial-gradient(700px 380px at 90% -20%, hsl(150 55% 30% / .55), transparent 64%),
    radial-gradient(520px 320px at 0% 116%, hsl(45 65% 40% / .12), transparent 60%),
    linear-gradient(164deg, hsl(160 62% 14%) 0%, hsl(157 56% 19%) 58%, hsl(160 66% 12%) 100%);
  box-shadow: 0 1px 2px hsl(0 0% 0% / .4), 0 30px 70px -22px hsl(158 60% 12% / .7);
}
/* خطوط طلایی ظریف و درخشش */
body.th-emerald .hero-bg {
  background:
    radial-gradient(420px 260px at 88% -4%, hsl(45 80% 60% / .14), transparent 70%),
    radial-gradient(320px 210px at 6% 104%, hsl(152 60% 40% / .18), transparent 68%);
}
body.th-emerald .hero-bg::after {
  background-image:
    linear-gradient(hsl(45 60% 70% / .05) 1px, transparent 1px),
    linear-gradient(90deg, hsl(45 60% 70% / .05) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(720px 400px at 50% 0%, rgb(0 0 0 / .8), transparent 85%);
  mask-image: radial-gradient(720px 400px at 50% 0%, rgb(0 0 0 / .8), transparent 85%);
}
body.th-emerald .hero h1 { color: hsl(0 0% 100%); }
body.th-emerald .hero-subtitle { color: hsl(150 35% 80%); }
body.th-emerald .hero-desc { color: hsl(155 14% 74%); }
/* بَج طلایی سلطنتی */
body.th-emerald .hero-badge {
  background: hsl(44 55% 16% / .7); border-color: hsl(44 60% 46%); color: hsl(46 75% 78%);
}
body.th-emerald .hero-badge .icon { color: hsl(46 80% 66%); }
body.th-emerald .hero-side {
  background: hsl(158 45% 12% / .72); border-color: hsl(156 40% 24%);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 hsl(45 60% 70% / .08);
}
body.th-emerald .hero-chip { border-bottom-color: hsl(157 32% 20%); }
body.th-emerald a.hero-chip:hover { background: hsl(157 40% 18% / .7); }
body.th-emerald .hero-chip-ico { background: hsl(157 38% 18%); color: hsl(46 70% 70%); }
body.th-emerald .hero-chip-title { color: hsl(155 25% 93%); }
body.th-emerald .hero-chip-desc { color: hsl(155 12% 66%); }
body.th-emerald .hero-trust { border-top-color: hsl(157 32% 22%); color: hsl(155 14% 74%); }
body.th-emerald .hero-trust .icon { background: hsl(45 70% 55% / .16); color: hsl(46 75% 70%); }
/* دکمه اصلی طلایی */
body.th-emerald .btn-hero-primary {
  background: linear-gradient(155deg, hsl(46 90% 58%), hsl(33 92% 50%));
  color: hsl(160 60% 11%);
  box-shadow: 0 12px 32px hsl(40 80% 35% / .5), inset 0 1px 0 hsl(0 0% 100% / .4);
}
body.th-emerald .btn-hero-primary:hover { box-shadow: 0 16px 40px hsl(40 85% 40% / .6), inset 0 1px 0 hsl(0 0% 100% / .5); }
body.th-emerald .btn-hero-secondary {
  background: hsl(0 0% 100% / .08); color: hsl(150 30% 88%); border-color: hsl(156 35% 32%);
}
body.th-emerald .btn-hero-secondary:hover { border-color: hsl(46 70% 58%); color: hsl(46 85% 82%); }
[data-theme="dark"] body.th-emerald .site-header { background: linear-gradient(94deg, hsl(161 62% 12%), hsl(158 56% 16%)); }

/* ═════════════════════ ۶) مینیمال (minimal) ═════════════════════ */

body.th-minimal .site-header {
  background: hsl(0 0% 100%);
  backdrop-filter: none; -webkit-backdrop-filter: none;
  border-bottom: 1px solid hsl(0 0% 90%);
  box-shadow: none;
}
body.th-minimal .hero {
  background: hsl(0 0% 100%);
  border: 1px solid hsl(0 0% 87%);
  border-radius: 20px;
  box-shadow: 0 1px 2px hsl(0 0% 0% / .04), 0 18px 40px -30px hsl(0 0% 0% / .18);
}
body.th-minimal .hero-bg, body.th-minimal .hero-bg::after { background: none; }
body.th-minimal .hero-badge {
  background: hsl(0 0% 96%); border-color: hsl(0 0% 88%); color: hsl(0 0% 42%);
}
body.th-minimal .hero-badge .icon { color: hsl(0 0% 38%); }
body.th-minimal .hero h1 { color: hsl(0 0% 9%); }
body.th-minimal .hero-subtitle { color: hsl(0 0% 34%); }
body.th-minimal .hero-desc { color: hsl(0 0% 42%); }
body.th-minimal .hero-side { background: hsl(0 0% 99%); border-color: hsl(0 0% 91%); box-shadow: none; backdrop-filter: none; }
body.th-minimal .hero-chip { border-bottom-color: hsl(0 0% 92%); }
body.th-minimal a.hero-chip:hover { background: hsl(0 0% 96%); }
body.th-minimal .hero-chip-ico { background: hsl(0 0% 94%); color: hsl(0 0% 30%); }
body.th-minimal .hero-chip-title { color: hsl(0 0% 15%); }
body.th-minimal .hero-chip-desc { color: hsl(0 0% 48%); }
body.th-minimal .hero-trust { border-top-color: hsl(0 0% 91%); color: hsl(0 0% 40%); }
body.th-minimal .hero-trust .icon { background: hsl(0 0% 93%); color: hsl(0 0% 32%); }
body.th-minimal .btn-hero-primary {
  background: hsl(0 0% 11%);
  box-shadow: none;
}
body.th-minimal .btn-hero-primary:hover { background: hsl(0 0% 22%); box-shadow: none; }
body.th-minimal .btn-hero-secondary { background: hsl(0 0% 100%); color: hsl(0 0% 25%); border-color: hsl(0 0% 86%); }
body.th-minimal .btn-hero-secondary:hover { border-color: hsl(0 0% 40%); color: hsl(0 0% 10%); }

[data-theme="dark"] body.th-minimal .hero { background: hsl(var(--card)); border-color: hsl(var(--border)); }
[data-theme="dark"] body.th-minimal .site-header { background: hsl(var(--bg)); }

/* ═══════════════ حالت چاپ — پوسته‌ها بی‌اثر ═══════════════ */
@media print {
  body.th-glass::before, body.th-sunset::before { display: none; }
}