/**
 * Ysg Bilişim — Signal Forge Design System
 * Benzersiz token katmanı: dark / light
 */

:root {
    /* Marka çekirdeği */
    --forge: #e85d2a;
    --forge-bright: #ff7a45;
    --forge-deep: #c44a18;
    --signal: #2fd4a7;
    --signal-dim: #1fa882;
    --plasma: #9b7fd4;
    --ember-glow: #ff9f5a;

    --gradient: linear-gradient(118deg, var(--forge-deep) 0%, var(--forge) 42%, var(--ember-glow) 100%);
    --gradient-signal: linear-gradient(135deg, var(--signal-dim) 0%, var(--signal) 100%);
    --gradient-danger: linear-gradient(118deg, #991b1b 0%, #dc2626 42%, #ef4444 100%);
    --gradient-text: linear-gradient(105deg, var(--forge-bright) 0%, var(--ember-glow) 55%, var(--signal) 100%);

    --radius: 4px;
    --radius-sm: 2px;
    --radius-lg: 6px;
    --chamfer: 14px;

    --font-display: 'Syne', system-ui, sans-serif;
    --font: 'DM Sans', system-ui, sans-serif;
    --mono: 'Space Mono', 'JetBrains Mono', monospace;

    --header-h: 76px;
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-snap: cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition: 0.28s var(--ease);
}

/* ── Dark — Signal Forge (varsayılan) ── */
[data-theme="dark"] {
    color-scheme: dark;

    --bg: #0a0908;
    --bg-elevated: #121110;
    --bg-card: rgba(22, 20, 18, 0.82);
    --bg-card-solid: #161412;

    --text: #f5f0ea;
    --text-muted: #a89f94;
    --text-dim: #6f6760;

    --border: rgba(245, 240, 234, 0.07);
    --border-hover: rgba(232, 93, 42, 0.55);
    --border-strong: rgba(245, 240, 234, 0.12);

    --header-bg: rgba(10, 9, 8, 0.72);
    --header-bg-scrolled: rgba(10, 9, 8, 0.94);
    --header-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
    --header-accent: linear-gradient(90deg, transparent, var(--forge) 30%, var(--signal) 70%, transparent);

    --overlay-02: rgba(245, 240, 234, 0.02);
    --overlay-03: rgba(245, 240, 234, 0.03);
    --overlay-04: rgba(245, 240, 234, 0.045);
    --overlay-05: rgba(245, 240, 234, 0.06);
    --overlay-06: rgba(245, 240, 234, 0.075);
    --overlay-08: rgba(245, 240, 234, 0.1);
    --overlay-10: rgba(245, 240, 234, 0.12);

    --input-bg: rgba(245, 240, 234, 0.035);
    --section-alt-bg: rgba(245, 240, 234, 0.018);

    --surface-glass: var(--bg-card);
    --surface-elevated: var(--bg-elevated);
    --border-subtle: var(--border);
    --text-primary: var(--text);
    --font-mono: var(--mono);
    --brand-400: var(--primary-light-text);
    --brand-500: var(--forge);
    --radius-md: var(--radius-lg);
    --shadow-lg: var(--shadow-card);

    --ring-a: rgba(232, 93, 42, 0.07);
    --ring-b: rgba(47, 212, 167, 0.05);
    --scan-line: rgba(245, 240, 234, 0.025);
    --scan-opacity: 0.55;
    --grid-line: rgba(245, 240, 234, 0.035);
    --grid-opacity: 0.35;

    --terminal-bg: rgba(6, 5, 4, 0.92);
    --shadow-glow: 0 0 80px rgba(232, 93, 42, 0.12), 0 24px 60px rgba(0, 0, 0, 0.5);
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.35);
    --addon-block-bg: linear-gradient(165deg, rgba(232, 93, 42, 0.06) 0%, rgba(22, 20, 18, 0.95) 100%);

    --primary: var(--forge);
    --primary-soft: rgba(232, 93, 42, 0.11);
    --primary-soft-hover: rgba(232, 93, 42, 0.17);
    --primary-border: rgba(232, 93, 42, 0.28);
    --primary-ring: rgba(232, 93, 42, 0.22);
    --primary-light-text: var(--forge-bright);

    --green-soft: rgba(47, 212, 167, 0.1);
    --green-border: rgba(47, 212, 167, 0.32);
    --green-text: var(--signal);

    --cyan-soft: rgba(47, 212, 167, 0.08);
    --cyan-border: rgba(47, 212, 167, 0.25);
    --cyan-text: var(--signal);

    --violet-soft: rgba(155, 127, 212, 0.1);
    --violet-text: #b49de8;

    --red-soft: rgba(239, 68, 68, 0.12);
    --red-border: rgba(239, 68, 68, 0.3);
    --red: #f87171;

    --yellow-soft: rgba(255, 159, 90, 0.12);
    --yellow-text: var(--ember-glow);
    --yellow-border: rgba(255, 159, 90, 0.28);

    --btn-glass-bg: rgba(245, 240, 234, 0.04);
    --btn-glass-hover: rgba(245, 240, 234, 0.08);
    --btn-shadow: 0 8px 32px rgba(232, 93, 42, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    --btn-danger-shadow: 0 8px 32px rgba(220, 38, 38, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08);

    --particle: rgba(232, 93, 42, 0.55);
    --particle-line: rgba(232, 93, 42, 0.12);

    --meta-theme: #0a0908;
}

/* ── Light — Forge Paper ── */
[data-theme="light"] {
    color-scheme: light;

    --bg: #f4f0ea;
    --bg-elevated: #faf7f3;
    --bg-card: rgba(255, 252, 248, 0.94);
    --bg-card-solid: #fffcf8;

    --text: #1a1714;
    --text-muted: #5c554d;
    --text-dim: #8a8279;

    --border: rgba(26, 23, 20, 0.09);
    --border-hover: rgba(196, 74, 24, 0.45);
    --border-strong: rgba(26, 23, 20, 0.14);

    --header-bg: rgba(244, 240, 234, 0.85);
    --header-bg-scrolled: rgba(250, 247, 243, 0.97);
    --header-shadow: 0 12px 40px rgba(26, 23, 20, 0.08);
    --header-accent: linear-gradient(90deg, transparent, var(--forge) 30%, var(--signal-dim) 70%, transparent);

    --overlay-02: rgba(26, 23, 20, 0.02);
    --overlay-03: rgba(26, 23, 20, 0.035);
    --overlay-04: rgba(26, 23, 20, 0.05);
    --overlay-05: rgba(26, 23, 20, 0.06);
    --overlay-06: rgba(26, 23, 20, 0.075);
    --overlay-08: rgba(26, 23, 20, 0.09);
    --overlay-10: rgba(26, 23, 20, 0.11);

    --input-bg: rgba(255, 255, 255, 0.95);
    --section-alt-bg: rgba(255, 255, 255, 0.55);

    --surface-glass: var(--bg-card-solid);
    --surface-elevated: var(--bg-elevated);
    --border-subtle: var(--border);
    --text-primary: var(--text);
    --font-mono: var(--mono);
    --brand-400: var(--primary-light-text);
    --brand-500: var(--forge);
    --radius-md: var(--radius-lg);
    --shadow-lg: var(--shadow-card);

    --ring-a: rgba(232, 93, 42, 0.06);
    --ring-b: rgba(31, 168, 130, 0.05);
    --scan-line: rgba(26, 23, 20, 0.04);
    --scan-opacity: 0.4;
    --grid-line: rgba(26, 23, 20, 0.06);
    --grid-opacity: 0.45;

    --terminal-bg: #1a1714;
    --shadow-glow: 0 16px 48px rgba(196, 74, 24, 0.1);
    --shadow-card: 0 4px 20px rgba(26, 23, 20, 0.06);
    --addon-block-bg: linear-gradient(165deg, rgba(232, 93, 42, 0.07) 0%, rgba(255, 252, 248, 0.98) 100%);

    --primary-soft: rgba(232, 93, 42, 0.09);
    --primary-soft-hover: rgba(232, 93, 42, 0.14);
    --primary-border: rgba(196, 74, 24, 0.28);
    --primary-ring: rgba(232, 93, 42, 0.18);
    --primary-light-text: var(--forge-deep);

    --green-soft: rgba(31, 168, 130, 0.1);
    --green-border: rgba(31, 168, 130, 0.28);
    --green-text: var(--signal-dim);

    --cyan-soft: rgba(31, 168, 130, 0.08);
    --cyan-border: rgba(31, 168, 130, 0.22);
    --cyan-text: var(--signal-dim);

    --violet-soft: rgba(155, 127, 212, 0.1);
    --violet-text: #7c5fbd;

    --red-soft: rgba(220, 38, 38, 0.08);
    --red-border: rgba(220, 38, 38, 0.22);
    --red: #dc2626;

    --yellow-soft: rgba(196, 74, 24, 0.1);
    --yellow-text: var(--forge-deep);
    --yellow-border: rgba(196, 74, 24, 0.22);

    --btn-glass-bg: rgba(255, 255, 255, 0.88);
    --btn-glass-hover: #ffffff;
    --btn-shadow: 0 6px 24px rgba(196, 74, 24, 0.22);
    --btn-danger-shadow: 0 6px 24px rgba(220, 38, 38, 0.22);

    --particle: rgba(196, 74, 24, 0.4);
    --particle-line: rgba(196, 74, 24, 0.1);

    --meta-theme: #f4f0ea;
}

/* FOUC önleme — varsayılan açık tema */
html:not([data-theme]) {
    color-scheme: light;
    --bg: #f4f0ea;
    --bg-elevated: #faf7f3;
    --bg-card: rgba(255, 252, 248, 0.94);
    --text: #1a1714;
    --text-muted: #5c554d;
    --text-dim: #8a8279;
    --border: rgba(26, 23, 20, 0.09);
    --border-hover: rgba(196, 74, 24, 0.45);
    --header-bg: rgba(244, 240, 234, 0.85);
    --header-bg-scrolled: rgba(250, 247, 243, 0.97);
    --header-shadow: 0 12px 40px rgba(26, 23, 20, 0.08);
    --overlay-04: rgba(26, 23, 20, 0.05);
    --overlay-05: rgba(26, 23, 20, 0.06);
    --overlay-08: rgba(26, 23, 20, 0.09);
    --input-bg: rgba(255, 255, 255, 0.95);
    --section-alt-bg: rgba(255, 255, 255, 0.55);
    --ring-a: rgba(232, 93, 42, 0.06);
    --ring-b: rgba(31, 168, 130, 0.05);
    --scan-line: rgba(26, 23, 20, 0.04);
    --scan-opacity: 0.4;
    --grid-line: rgba(26, 23, 20, 0.06);
    --grid-opacity: 0.45;
    --terminal-bg: #1a1714;
    --shadow-glow: 0 16px 48px rgba(196, 74, 24, 0.1);
    --primary-soft: rgba(232, 93, 42, 0.09);
    --primary-soft-hover: rgba(232, 93, 42, 0.14);
    --primary-border: rgba(196, 74, 24, 0.28);
    --primary-ring: rgba(232, 93, 42, 0.18);
    --primary-light-text: #c44a18;
    --green-soft: rgba(31, 168, 130, 0.1);
    --green-border: rgba(31, 168, 130, 0.28);
    --green-text: #1fa882;
    --cyan-soft: rgba(31, 168, 130, 0.08);
    --cyan-border: rgba(31, 168, 130, 0.22);
    --cyan-text: #1fa882;
    --violet-soft: rgba(155, 127, 212, 0.1);
    --violet-text: #7c5fbd;
    --red-soft: rgba(220, 38, 38, 0.08);
    --red-border: rgba(220, 38, 38, 0.22);
    --red: #dc2626;
    --yellow-soft: rgba(196, 74, 24, 0.1);
    --yellow-text: #c44a18;
    --btn-glass-bg: rgba(255, 255, 255, 0.88);
    --btn-glass-hover: #ffffff;
    --btn-shadow: 0 6px 24px rgba(196, 74, 24, 0.22);
    --btn-danger-shadow: 0 6px 24px rgba(220, 38, 38, 0.22);
    --gradient: linear-gradient(118deg, #c44a18 0%, #e85d2a 42%, #ff9f5a 100%);
    --gradient-text: linear-gradient(105deg, #c44a18 0%, #e85d2a 55%, #1fa882 100%);
    --meta-theme: #f4f0ea;
}

html.theme-animate,
html.theme-animate *,
html.theme-animate *::before,
html.theme-animate *::after {
    transition:
        background-color 0.32s var(--ease),
        border-color 0.32s var(--ease),
        color 0.22s var(--ease),
        box-shadow 0.32s var(--ease),
        fill 0.22s var(--ease) !important;
}