/* ============================================================
   SIMS Design System — Tokens (النسخة المعتمدة — الفخامة)
   File   : wwwroot/css/sims-tokens.css
   Source : preview-luxury.html المعتمد — القيم منقولة كما هي.
   Layer  : 1 (tokens → components → layout)
   Rules  : الألوان تُستهلك عبر المتغيرات فقط؛ خصائص منطقية دائماً؛
            كل ثيم هوية كاملة (خلفية + جانبية + توهج) لا لوناً أساسياً فقط.
   ============================================================ */

/* ---------------- 1) ثوابت عامة ---------------- */
:root{
    /* الذهبي الفاخر — ثابت عبر الثيمات */
    --lux:#D4AF37;
    --lux-soft:rgba(212,175,55,.16);
    --lux-grad:linear-gradient(135deg,#E9CE6E,#B8912A);

    /* الخطوط: عناوين المسيري / نص ألكسندريا / لاتيني Marcellus + Manrope */
    --font-d-ar:'El Messiri', serif;
    --font-b-ar:'Alexandria', 'Segoe UI', Tahoma, sans-serif;
    --font-d-lt:'Marcellus', serif;
    --font-b-lt:'Manrope', 'Segoe UI', sans-serif;
    --font-display:var(--font-d-ar);
    --font-body:var(--font-b-ar);
    --font-mono:'Consolas','Courier New',monospace;

    --fs-xs:.74rem; --fs-sm:.84rem; --fs-md:.95rem;
    --fs-lg:1.1rem; --fs-xl:1.5rem;  --fs-2xl:2.1rem;

    --radius-sm:10px; --radius:14px; --radius-lg:22px; --full:999px;
    --ease:cubic-bezier(.4,0,.2,1);
    --dur-fast:.15s; --dur:.25s; --dur-slow:.45s;

    --sidebar-w:272px; --topbar-h:70px; --content-max:1320px;

    --z-sidebar:100; --z-topbar:90; --z-dropdown:300; --z-modal:400; --z-toast:500;
}
[dir="ltr"]{ --font-display:var(--font-d-lt); --font-body:var(--font-b-lt); }

/* ---------------- 2) الثيمات: هوية كاملة لكل ثيم ---------------- */
[data-theme="marine"], :root{
    --primary:#0E5AA7; --primary-light:#2E86D9; --primary-dark:#072F58;
    --p-rgb:14,90,167; --glow:46,134,217;
    --side1:#061a33; --side2:#0B4076; --side-glow:rgba(46,134,217,.35);
    --bg:#EFF4FA; --bg2:#E4EDF7;
}
[data-theme="sharjah"]{
    --primary:#B8122F; --primary-light:#E2455C; --primary-dark:#5E0D1B;
    --p-rgb:184,18,47; --glow:226,69,92;
    --side1:#2A060D; --side2:#7E0F22; --side-glow:rgba(226,69,92,.35);
    --bg:#FAF1F2; --bg2:#F5E4E7;
}
[data-theme="gray"]{
    --primary:#404E66; --primary-light:#6E7E9A; --primary-dark:#1E2635;
    --p-rgb:64,78,102; --glow:110,126,154;
    --side1:#12161f; --side2:#333F53; --side-glow:rgba(110,126,154,.35);
    --bg:#F2F4F7; --bg2:#E7EAF0;
}
[data-theme="gold"]{
    --primary:#9C761A; --primary-light:#D4AF37; --primary-dark:#5C450A;
    --p-rgb:156,118,26; --glow:212,175,55;
    --side1:#1d1504; --side2:#6d5308; --side-glow:rgba(212,175,55,.35);
    --bg:#FAF5E9; --bg2:#F3EAD3;
}

/* ---------------- 3) أسطح الوضع الفاتح ---------------- */
:root, [data-mode="light"]{
    --card:#FFFFFF; --elev:#FFFFFF; --inset:rgba(var(--p-rgb),.05);
    --fg:#1A2233; --muted:#5D6B82; --faint:#93A0B4;
    --line:rgba(var(--p-rgb),.14); --line-strong:rgba(var(--p-rgb),.28);
    --on-primary:#fff;

    --sh:0 2px 16px rgba(var(--p-rgb),.08);
    --sh-lg:0 24px 60px rgba(var(--p-rgb),.22);
    --sh-btn:0 10px 24px rgba(var(--p-rgb),.35);

    --success:#157A45; --success-s:rgba(21,122,69,.12);
    --warning:#A85B08; --warning-s:rgba(168,91,8,.13);
    --danger:#B01E30;  --danger-s:rgba(176,30,48,.11);
    --info:#0B6DA8;    --info-s:rgba(11,109,168,.12);

    color-scheme:light;
}

/* ---------------- 4) الوضع الداكن: عمق بلون الثيم ---------------- */
[data-mode="dark"]{
    --bg:color-mix(in srgb,var(--side1) 82%,#000);
    --bg2:var(--side1);
    --card:color-mix(in srgb,var(--side1) 55%,#101724);
    --elev:color-mix(in srgb,var(--side1) 40%,#151d2c);
    --inset:rgba(255,255,255,.04);
    --fg:#EFF3F9; --muted:#9AA8BC; --faint:#66758B;
    --line:rgba(255,255,255,.10); --line-strong:rgba(255,255,255,.22);

    --sh:0 2px 16px rgba(0,0,0,.45);
    --sh-lg:0 24px 60px rgba(0,0,0,.6);
    --sh-btn:0 10px 24px rgba(var(--p-rgb),.45);

    --success:#3ECF7E; --success-s:rgba(62,207,126,.14);
    --warning:#F0A64A; --warning-s:rgba(240,166,74,.15);
    --danger:#F26B7A;  --danger-s:rgba(242,107,122,.13);
    --info:#4FBBF2;    --info-s:rgba(79,187,242,.14);

    color-scheme:dark;
}
[data-mode="dark"][data-theme="marine"], [data-mode="dark"]:not([data-theme]){ --primary:#4AA0E8; }
[data-mode="dark"][data-theme="sharjah"]{ --primary:#F0596E; }
[data-mode="dark"][data-theme="gray"]{ --primary:#A9B8CE; --on-primary:#141a26; }
[data-mode="dark"][data-theme="gold"]{ --primary:#E3C05C; --on-primary:#241a02; }

/* ---------------- 5) حالات المحرك المسمّاة ---------------- */
:root{
    --st-sub:var(--info);        --st-sub-s:var(--info-s);
    --st-insp:#6D4FC4;           --st-insp-s:rgba(109,79,196,.12);
    --st-pass:var(--success);    --st-pass-s:var(--success-s);
    --st-fail:var(--danger);     --st-fail-s:var(--danger-s);
    --st-pay:var(--warning);     --st-pay-s:var(--warning-s);
    --st-paid:#0E7A72;           --st-paid-s:rgba(14,122,114,.12);
    --st-cert:#B08A1E;           --st-cert-s:rgba(176,138,30,.15);
    --st-rej:#8E1B27;            --st-rej-s:rgba(142,27,39,.11);
    --st-re:#B4530F;             --st-re-s:rgba(180,83,15,.13);
    --st-draft:var(--muted);     --st-draft-s:rgba(120,132,150,.13);
}
[data-mode="dark"]{
    --st-insp:#A78BFA; --st-insp-s:rgba(167,139,250,.15);
    --st-paid:#3ED3C4; --st-paid-s:rgba(62,211,196,.14);
    --st-cert:#E3C05C; --st-cert-s:rgba(227,192,92,.16);
    --st-rej:#F26B7A;  --st-rej-s:rgba(242,107,122,.13);
    --st-re:#FB9A55;   --st-re-s:rgba(251,154,85,.14);
}

/* ---------------- 6) الأساس العام ---------------- */
*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }

body{
    margin:0;
    font-family:var(--font-body);
    font-size:var(--fs-md);
    line-height:1.8;
    color:var(--fg);
    background:
        radial-gradient(900px 500px at 85% -5%, rgba(var(--glow),.14), transparent 60%),
        radial-gradient(700px 500px at -10% 100%, rgba(var(--glow),.10), transparent 55%),
        linear-gradient(180deg,var(--bg),var(--bg2));
    background-attachment:fixed;
    min-height:100vh;
    transition:color var(--dur) var(--ease);
}

h1,h2,h3,h4{
    font-family:var(--font-display);
    font-weight:600;
    line-height:1.4;
    margin:0 0 .6rem;
    letter-spacing:.01em;
    color:var(--fg);
}
h1{ font-size:var(--fs-2xl); } h2{ font-size:var(--fs-xl); } h3{ font-size:var(--fs-lg); }
p{ margin:0 0 .8rem; }

a{ color:var(--primary); text-decoration:none; transition:color var(--dur-fast) var(--ease); }
a:hover{ color:var(--primary-light); }

hr{ border:0; border-top:1px solid var(--line); margin:1.2rem 0; }
img,svg{ vertical-align:middle; }
::placeholder{ color:var(--faint); opacity:1; font-weight:300; }
::selection{ background:rgba(var(--p-rgb),.18); }

/* اللاتيني داخل النص العربي */
[dir="rtl"] .latin, [dir="rtl"] input[type="email"], code{ font-family:var(--font-b-lt); }
code,kbd,pre{ font-family:var(--font-mono); font-size:.9em; }

:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(var(--p-rgb),.3); border-radius:8px; }

*{ scrollbar-width:thin; scrollbar-color:var(--line-strong) transparent; }
*::-webkit-scrollbar{ width:8px; height:8px; }
*::-webkit-scrollbar-thumb{ background:var(--line-strong); border-radius:var(--full); }
*::-webkit-scrollbar-track{ background:transparent; }

/* فاصل ذهبي للعناوين: <h2 class="lux-underline"> */
.lux-underline{ display:inline-block; position:relative; padding-block-end:.45rem; }
.lux-underline::after{
    content:""; position:absolute; inset-inline-start:0; bottom:0;
    width:52px; height:3px; border-radius:3px;
    background:linear-gradient(90deg,var(--primary),var(--lux));
}

@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
    }
}