/* ==========================================================================
   Metanoia — theme for the booking app (Site.master) and the admin panel.
   Loaded AFTER each page's own <style>, so it only re-skins: no markup,
   IDs or scripts depend on anything here.

   How it works: the old pages build their accent gradients from
   var(--gold) and var(--uv). Re-mapping --uv to bronze turns every
   gold→pink gradient into the public site's champagne→bronze gradient;
   pink/red is then restored only where it carries meaning
   (errors, warnings, "full" days, negative amounts).
   ========================================================================== */

@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/Vazirmatn-arabic-normal-200-800.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/Vazirmatn-latin-normal-200-800.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root:root{
  --bg:#0D0806;
  --bg-glow:radial-gradient(700px 360px at 85% -12%, rgba(240,164,69,.13), transparent 62%),
            radial-gradient(520px 300px at 8% 0%, rgba(227,192,138,.06), transparent 60%);
  --surface:#170E0A;
  --surface-soft:#22150F;
  --surface-soft-2:#2D1C14;
  --ink:#F3E6D3;
  --ink-soft:#B9A08A;
  --gold:#E3C08A;
  --gold-light:#F2DDB0;
  --gold-dark:#C8913F;
  --uv:#B9813A;            /* bronze: closes every legacy gold→uv gradient */
  --uv-soft:#2B171B;
  --rose:#E0709E;          /* semantic pink: errors, warnings, "full" */
  --info:#6FB4C6;
  --danger:#D9634F;
  --ok:#6FBF8A;
  --line:rgba(227,192,138,.16);
  --radius:18px;
  --shadow:0 18px 40px -22px rgba(0,0,0,.75);
}

/* ---------- type: one family everywhere, numbers aligned ---------- */
html body, html body *{font-family:'Vazirmatn',Tahoma,sans-serif !important;letter-spacing:0 !important;}
html body{-webkit-font-smoothing:antialiased;}
.mono,.inp.mono,.day,.slot,.who .phone,.parts-summary,.cost-line .val,.wallet-pill b,.stat b,.stat .num,.balance-card .num,.tbl td{font-variant-numeric:tabular-nums;}
html body h1,html body h2.page-title,.brand h1{font-weight:800 !important;}
html body h1{font-size:21px;}
h2.page-title{font-size:20px !important;}
.brand h1{font-size:16px !important;}
.welcome-name{font-weight:800;font-size:22px !important;}
.balance-card .num{font-weight:800;font-size:44px !important;}
.stat .num{font-weight:800;font-size:26px !important;}
.who .initial,.avatar,.cust-head .initial{font-weight:800;}

/* ---------- page background: warm glow, no pink ---------- */
html body{background:var(--bg-glow), var(--bg) !important;}

/* ---------- surfaces ---------- */
.card,.modal,.box,.stat,.balance-card{border-color:var(--line) !important;box-shadow:var(--shadow) !important;}
.modal{border-radius:22px;}
.overlay{background:rgba(8,5,4,.72) !important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}

/* ---------- primary actions: the public site's gold button ---------- */
.btn-primary,.btn-gold,.nav a.active,.day.selected,.sun.on,.toast:not(.error){
  background:linear-gradient(135deg,#F6DDA8 0%,#E3C08A 38%,#C8913F 100%) !important;color:#1A0F08 !important;}
.btn-primary,.btn-gold{box-shadow:0 10px 26px -14px rgba(240,164,69,.6),inset 0 1px 0 rgba(255,255,255,.45);}
.btn-primary:hover,.btn-gold:hover{filter:brightness(1.05);}
.sun.on{box-shadow:0 0 0 4px rgba(227,192,138,.14),0 8px 18px -8px rgba(240,164,69,.55) !important;}
.btn-primary:disabled{background:var(--surface-soft-2) !important;color:#7A6656 !important;box-shadow:none;}

/* ---------- semantic colours restored ---------- */
.error,.parts-note,.balance-warning,.cost-line.warn .val,.tx .delta.neg,.wallet-pill.zero{color:var(--rose) !important;}
.day.full .dot{background:var(--rose) !important;}
[style*="color:var(--uv)"]{color:var(--rose) !important;}
[style*="background:var(--uv)"]{background:var(--rose) !important;}
.btn-danger,.toast.error{background:var(--danger) !important;color:#fff !important;}
.btn-danger:hover{filter:brightness(1.08);}
.admin-wrap .btn-danger{background:rgba(217,99,79,.15) !important;color:var(--danger) !important;}
.admin-wrap .btn-danger:hover{background:rgba(217,99,79,.28) !important;}

/* ---------- booking calendar & slots ---------- */
.day{border-radius:12px;}
.day.today{border-color:var(--gold) !important;}
.slot{border-color:var(--line) !important;}
.slot:hover{border-color:var(--gold-dark) !important;}
.slot.taken{background:repeating-linear-gradient(135deg,#1C110C 0 6px,#24160F 6px 12px) !important;color:#7A6656 !important;}
.slot.taken span.tag{color:#8C7664 !important;}
.slot.mine{background:linear-gradient(150deg,#6FB4C6,#3D7E90) !important;}
.wallet-pill{background:linear-gradient(135deg,#F6DDA8,#E3C08A) !important;color:#1A0F08 !important;}
.wallet-pill.zero{background:var(--uv-soft) !important;}

/* ---------- brand marks: the public site's light-tube mark ---------- */
.brand-mark,.mark,.brand .mark{background:linear-gradient(160deg,#2A1A12,#120A07) !important;border:1px solid rgba(227,192,138,.34);
  box-shadow:0 0 0 4px rgba(227,192,138,.05),0 8px 22px -10px rgba(240,164,69,.55) !important;}
.brand-mark svg,.mark svg,.brand .mark svg{filter:drop-shadow(0 0 4px rgba(240,164,69,.6));}
.brand-mark svg circle,.mark svg circle,.brand .mark svg circle{fill:#F0C27B !important;}
.brand-mark svg g,.mark svg g,.brand .mark svg g{stroke:#F0C27B !important;}

/* ---------- inputs ---------- */
.inp,.field input,.field .readonly-box,select.inp,textarea.inp{background:#100A07 !important;border-color:rgba(227,192,138,.2) !important;}
.inp:focus,.field input:focus{border-color:var(--gold) !important;box-shadow:0 0 0 3px rgba(227,192,138,.12);}
.field input::placeholder,.inp::placeholder{color:#6E5B4C !important;}

/* ---------- admin chrome ---------- */
.topbar{background:rgba(13,8,6,.88) !important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
.nav a{border-radius:999px;}
.nav a:hover{background:var(--surface-soft) !important;}
.nav a.logout{color:var(--danger) !important;}
.tbl tr:hover td{background:rgba(227,192,138,.035) !important;}
.badge.Pending{background:rgba(227,192,138,.14) !important;color:var(--gold-light) !important;}
.cms-nav{background:rgba(23,14,10,.7) !important;}

/* ---------- focus ring ---------- */
:focus-visible{outline:2px solid var(--gold) !important;outline-offset:2px;}

/* TinyMCE keeps its own icon and UI fonts */
html body .tox, html body .tox *{font-family:-apple-system,'Vazirmatn',Tahoma,sans-serif !important;}

/* links styled as buttons/pills never show the browser underline */
.link-btn,.wallet-pill,.userbar a,.back-link,.nav a,.btn{text-decoration:none !important;}