/* =============================================================
   Jafam Clinical Trust — Design Tokens
   تمام متغیرهای رنگ، تایپوگرافی، فاصله، شکل و سایه
   namespace: --jf-*
   ============================================================= */

/* ---------- Font Faces ---------- */
@font-face {
    font-family: "Yekan";
    src: url("../fonts/Yekan/Yekan.eot");
    src:
        url("../fonts/Yekan/Yekan.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Yekan/Yekan.woff2") format("woff2"),
        url("../fonts/Yekan/Yekan.woff") format("woff"),
        url("../fonts/Yekan/Yekan.otf") format("opentype"),
        url("../fonts/Yekan/Yekan.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "Vazir";
    src: url("../fonts/vazir.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "IRANSansX";
    src: url("../fonts/FontsFree-Net-ir_sans.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "IRANSans";
    src: url("../fonts/FontsFree-Net-ir_sans.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "CenturyGothic";
    src: url("../fonts/CenturyGothic/GOTHIC.TTF") format("truetype");
    font-display: swap;
}

/* ---------- Light Theme (default) ---------- */
:root,
html[data-theme="light"] {
    color-scheme: light;

    /* Brand */
    --jf-primary: #0b5cab;
    --jf-primary-soft: #e3eefb;
    --jf-primary-ink: #ffffff;
    --jf-secondary: #0f9d8a;
    --jf-secondary-soft: #d6f4ee;
    --jf-tertiary: #d97706;
    --jf-tertiary-soft: #fdecd3;

    /* Status (independent from brand) */
    --jf-success: #16a34a;
    --jf-success-soft: #dcfce7;
    --jf-warning: #eab308;
    --jf-warning-soft: #fef9c3;
    --jf-error: #dc2626;
    --jf-error-soft: #fee2e2;
    --jf-info: #0284c7;
    --jf-info-soft: #e0f2fe;

    /* Neutral Scale */
    --jf-neutral-50: #f8fafc;
    --jf-neutral-100: #f1f5f9;
    --jf-neutral-200: #e2e8f0;
    --jf-neutral-300: #cbd5e1;
    --jf-neutral-400: #94a3b8;
    --jf-neutral-500: #64748b;
    --jf-neutral-600: #475569;
    --jf-neutral-700: #334155;
    --jf-neutral-800: #1e293b;
    --jf-neutral-900: #0f172a;

    /* Surface */
    --jf-bg: #edf4fb;
    --jf-bg-deep: #dfeaf5;
    --jf-surface: #ffffff;
    --jf-surface-2: #f5f8fb;
    --jf-surface-strong: #ffffff;
    --jf-surface-muted: #f6fafe;
    --jf-surface-glass: rgba(255, 255, 255, 0.86);
    --jf-surface-float: rgba(255, 255, 255, 0.92);

    /* Text */
    --jf-text: #08111f;
    --jf-text-soft: #5f728c;
    --jf-text-muted: #8fa1b8;

    /* Border / Divider */
    --jf-border: rgba(112, 133, 158, 0.18);
    --jf-border-strong: rgba(102, 124, 149, 0.3);
    --jf-divider: #dbe5f0;
    --jf-grid-line: rgba(120, 142, 166, 0.09);

    /* Hero gradient */
    --jf-hero: linear-gradient(135deg, #0b5cab 0%, #1677b8 42%, #0f9d8a 100%);

    /* Row colors (tables) */
    --jf-row-even: rgba(255, 255, 255, 0.9);
    --jf-row-odd: rgba(246, 250, 254, 0.94);
    --jf-row-hover: rgba(11, 92, 171, 0.08);

    /* Navigation */
    --jf-nav-primary: rgba(255, 255, 255, 0.74);
    --jf-nav-secondary: rgba(242, 247, 252, 0.92);
    --jf-nav-text: #23354e;
    --jf-nav-text-soft: #6d819b;
    --jf-nav-icon: #0b5cab;
    --jf-nav-accent: rgba(11, 92, 171, 0.1);

    /* Elevation */
    --jf-shadow-rest: 0 12px 28px rgba(8, 17, 31, 0.06);
    --jf-shadow-hover: 0 22px 52px rgba(8, 17, 31, 0.08);
    --jf-shadow-overlay: 0 28px 72px rgba(8, 17, 31, 0.12);
    --jf-shadow-card: 0 22px 52px rgba(8, 17, 31, 0.08);

    /* Loader backdrop */
    --jf-loader-backdrop: rgba(248, 251, 255, 0.8);

    /* Typography */
    --jf-font-fa: "IRANSansX", "IRANSans", "Vazir", "Yekan", "Segoe UI", Tahoma, sans-serif;
    --jf-font-fa-display: "Yekan", "IRANSansX", "Vazir", sans-serif;
    --jf-font-en: "CenturyGothic", "Segoe UI", sans-serif;

    /* Shape */
    --jf-radius-sm: 10px;
    --jf-radius-md: 14px;
    --jf-radius-lg: 18px;
    --jf-radius-xl: 24px;

    /* Spacing scale */
    --jf-sp-1: 4px;
    --jf-sp-2: 8px;
    --jf-sp-3: 12px;
    --jf-sp-4: 16px;
    --jf-sp-5: 20px;
    --jf-sp-6: 24px;
    --jf-sp-8: 32px;
    --jf-sp-10: 40px;
    --jf-sp-12: 48px;
}

/* ---------- Dark Theme ---------- */
html[data-theme="dark"] {
    color-scheme: dark;

    /* Brand */
    --jf-primary: #6fb6ff;
    --jf-primary-soft: #15324f;
    --jf-primary-ink: #07111f;
    --jf-secondary: #3bcbb0;
    --jf-secondary-soft: #103832;
    --jf-tertiary: #f4b04f;
    --jf-tertiary-soft: #3a2810;

    /* Status */
    --jf-success: #4ade80;
    --jf-success-soft: #052e1a;
    --jf-warning: #facc15;
    --jf-warning-soft: #3a2e08;
    --jf-error: #f87171;
    --jf-error-soft: #3a0d0d;
    --jf-info: #38bdf8;
    --jf-info-soft: #062a3f;

    /* Neutral Scale (inverted usage) */
    --jf-neutral-50: #0f172a;
    --jf-neutral-100: #1e293b;
    --jf-neutral-200: #334155;
    --jf-neutral-300: #475569;
    --jf-neutral-400: #64748b;
    --jf-neutral-500: #94a3b8;
    --jf-neutral-600: #cbd5e1;
    --jf-neutral-700: #e2e8f0;
    --jf-neutral-800: #f1f5f9;
    --jf-neutral-900: #f8fafc;

    /* Surface */
    --jf-bg: #07111f;
    --jf-bg-deep: #0b1727;
    --jf-surface: #101d2f;
    --jf-surface-2: #132337;
    --jf-surface-strong: #101d2f;
    --jf-surface-muted: #132337;
    --jf-surface-glass: rgba(13, 24, 40, 0.84);
    --jf-surface-float: rgba(16, 29, 47, 0.94);

    /* Text */
    --jf-text: #e7eef8;
    --jf-text-soft: #9fb1c8;
    --jf-text-muted: #6f8199;

    /* Border / Divider */
    --jf-border: rgba(102, 127, 154, 0.22);
    --jf-border-strong: rgba(126, 155, 186, 0.32);
    --jf-divider: #21344d;
    --jf-grid-line: rgba(126, 155, 186, 0.08);

    /* Hero gradient */
    --jf-hero: linear-gradient(135deg, #0d2b52 0%, #0e4f7d 45%, #0f6f66 100%);

    /* Row colors (tables) */
    --jf-row-even: rgba(15, 28, 45, 0.92);
    --jf-row-odd: rgba(11, 23, 38, 0.98);
    --jf-row-hover: rgba(111, 182, 255, 0.08);

    /* Navigation */
    --jf-nav-primary: rgba(10, 20, 34, 0.88);
    --jf-nav-secondary: rgba(14, 27, 44, 0.96);
    --jf-nav-text: #d4e0ee;
    --jf-nav-text-soft: #93a7bf;
    --jf-nav-icon: #6fb6ff;
    --jf-nav-accent: rgba(111, 182, 255, 0.12);

    /* Elevation */
    --jf-shadow-rest: 0 16px 40px rgba(2, 6, 12, 0.34);
    --jf-shadow-hover: 0 28px 70px rgba(2, 6, 12, 0.38);
    --jf-shadow-overlay: 0 34px 84px rgba(2, 6, 12, 0.46);
    --jf-shadow-card: 0 28px 70px rgba(2, 6, 12, 0.38);

    /* Loader backdrop */
    --jf-loader-backdrop: rgba(7, 17, 31, 0.76);
}

/* ---------- RTL utility classes ---------- */
.jf-font-fa {
    font-family: var(--jf-font-fa) !important;
}

.jf-font-en,
.ltr,
.font-gothic {
    font-family: var(--jf-font-en) !important;
}

.jf-tabular-nums {
    font-variant-numeric: tabular-nums;
}

/* ---------- Module Accent helper classes ---------- */
.jf-acc-primary {
    --jf-acc: var(--jf-primary);
    --jf-acc-soft: var(--jf-primary-soft);
}

.jf-acc-secondary {
    --jf-acc: var(--jf-secondary);
    --jf-acc-soft: var(--jf-secondary-soft);
}

.jf-acc-tertiary {
    --jf-acc: var(--jf-tertiary);
    --jf-acc-soft: var(--jf-tertiary-soft);
}

.jf-acc-neutral {
    --jf-acc: var(--jf-neutral-700);
    --jf-acc-soft: var(--jf-neutral-100);
}
