/* ==========================================================================
   OkuToon tasarım belirteçleri
   iOS / Android uygulamalarıyla aynı palet: nötr siyah-beyaz yüzeyler,
   tek vurgu rengi (varsayılan yeşil #48BD82; kullanıcı ana rengi seçebilir, docs/theme.md). Durum renkleri yalnızca anlamlarını taşırken
   kullanılır (hata, puan yıldızı, beğeni, premium, yönetici).
   ========================================================================== */

/* ── Koyu tema (varsayılan) ── */
:root {
    color-scheme: dark;

    /* Marka */
    --brand: #48BD82;
    --brand-rgb: 72, 189, 130;
    --on-brand: #000000;
    --brand-ink: #48BD82;            /* küçük metin/bağlantı için marka tonu */
    --brand-soft: rgba(72, 189, 130, 0.14);
    --brand-line: rgba(72, 189, 130, 0.45);

    /* Yüzeyler */
    --bg: #000000;
    --surface-1: #111112;            /* kart, satır vurgusu */
    --surface-2: #1C1C1E;            /* girdi, chip, menü */
    --surface-3: #2C2C2E;            /* hover, ayırıcı dolgu */
    --surface-overlay: #1C1C1E;      /* popover, modal */
    --seg-active: #3A3A3C;           /* segment kontrolünde seçili dilim */
    --elev-2: #2C2C2E;               /* açılır yüzey içindeki dolgu */
    --elev-3: #3A3A3C;
    --header-bg: rgba(0, 0, 0, 0.86);
    --scrim: rgba(0, 0, 0, 0.62);

    /* Metin */
    --fg: #F2F2F7;
    --fg-2: #AEAEB2;
    --fg-3: #8E8E93;
    --fg-4: #636366;

    /* Çizgiler */
    --line: #2C2C2E;
    --line-strong: #38383A;
    --focus-ring: rgba(72, 189, 130, 0.55);

    /* Tersine (siyah/beyaz dolgu butonlar) */
    --invert-bg: #F2F2F7;
    --invert-fg: #000000;

    /* Anlamsal */
    --danger: #FF453A;
    --danger-soft: rgba(255, 69, 58, 0.14);
    --warning: #FF9F0A;
    /* AI çevirisi etiketi (docs/ai-translation.md): marka yeşili, puan sarısı ve uyarı
       turuncusundan ayrışan mor; kapak üstü dolu, listelerde yumuşak zeminli. */
    --ai: #B794F6;
    --ai-soft: rgba(167, 139, 250, 0.16);
    --ai-line: rgba(167, 139, 250, 0.38);
    --ai-solid: #7C3AED;
    --on-ai-solid: #FFFFFF;
    --rating: #FFD60A;
    /* Seri "devam ediyor" durumu: ana renk değişse de yeşil kalır (docs/theme.md). */
    --ongoing: #48BD82;
    --like: #FF375F;
    --premium: #F6C343;
    --premium-soft: rgba(246, 195, 67, 0.14);
    --admin: #FF453A;
    --admin-soft: rgba(255, 69, 58, 0.14);

    --shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);

    /* Tipografi */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --fs-11: 0.6875rem;
    --fs-12: 0.75rem;
    --fs-13: 0.8125rem;
    --fs-14: 0.875rem;
    --fs-15: 0.9375rem;
    --fs-16: 1rem;
    --fs-18: 1.125rem;
    --fs-20: 1.25rem;
    --fs-24: 1.5rem;
    --fs-28: 1.75rem;
    --fs-32: 2rem;

    /* Boşluk (4px ızgara) */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.25rem;
    --sp-6: 1.5rem;
    --sp-8: 2rem;
    --sp-10: 2.5rem;
    --sp-12: 3rem;

    /* Köşe */
    --r-xs: 4px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-xl: 16px;
    --r-full: 999px;

    /* Ölçüler */
    --header-h: 60px;
    --container: 1200px;
    --gutter: 16px;
    --cover-ratio: 3 / 4;
    --ease: cubic-bezier(0.2, 0, 0, 1);
    --dur: 160ms;

    /* ── Geriye dönük takma adlar (yönetim paneli ve satır içi stiller) ── */
    --bg-primary: var(--bg);
    --bg-secondary: var(--surface-1);
    --bg-tertiary: var(--surface-2);
    --bg-elevated: var(--surface-overlay);
    --bg-card: var(--surface-1);
    --text-primary: var(--fg);
    --text-secondary: var(--fg-2);
    --text-tertiary: var(--fg-3);
    --text-muted: var(--fg-4);
    --text-on-accent: var(--on-brand);
    --accent-primary: var(--brand);
    --accent-primary-rgb: var(--brand-rgb);
    --accent: var(--brand);
    --accent-secondary: var(--brand);
    --accent-secondary-rgb: var(--brand-rgb);
    --accent-tertiary: var(--danger);
    --accent-tertiary-rgb: 255, 69, 58;
    --accent-warm: var(--warning);
    --accent-sky: var(--fg-2);
    --accent-muted: var(--brand);
    --border-subtle: var(--line);
    --border-medium: var(--line-strong);
    --border-default: var(--line);
    --border-focus: var(--brand);
    --role-premium: var(--premium);
    --role-admin: var(--admin);
    --avatar-bg: var(--surface-3);
    --avatar-text: var(--fg);
    --avatar-border: var(--line-strong);
    --shadow-lg: var(--shadow-pop);
    --space-xs: var(--sp-1);
    --space-sm: var(--sp-2);
    --space-md: var(--sp-4);
    --space-lg: var(--sp-6);
    --space-xl: var(--sp-8);
    --space-2xl: var(--sp-12);
    --text-xs: var(--fs-12);
    --text-sm: var(--fs-14);
    --text-base: var(--fs-16);
    --text-lg: var(--fs-18);
    --text-xl: var(--fs-20);
    --text-2xl: var(--fs-24);
    --text-3xl: var(--fs-32);
    --radius-sm: var(--r-sm);
    --radius-md: var(--r-md);
    --radius-lg: var(--r-lg);
    --radius-xl: var(--r-xl);
    --cover-aspect-ratio: var(--cover-ratio);
    --headline-aspect-ratio: 16 / 9;
    --transition-fast: var(--dur) var(--ease);
    --transition-base: 200ms var(--ease);
}

/* ── Açık tema ── */
[data-theme="light"] {
    color-scheme: light;

    --brand-ink: #177E4D;
    --brand-soft: rgba(72, 189, 130, 0.14);
    --brand-line: rgba(72, 189, 130, 0.55);

    --bg: #FFFFFF;
    --surface-1: #F9F9FB;
    --surface-2: #F2F2F7;
    --surface-3: #E5E5EA;
    --surface-overlay: #FFFFFF;
    --seg-active: #FFFFFF;
    --elev-2: #F2F2F7;
    --elev-3: #E5E5EA;
    --header-bg: rgba(255, 255, 255, 0.9);
    --scrim: rgba(0, 0, 0, 0.4);

    --fg: #000000;
    --fg-2: #3A3A3C;
    --fg-3: #6C6C70;
    --fg-4: #AEAEB2;

    --line: #E5E5EA;
    --line-strong: #D1D1D6;

    --invert-bg: #000000;
    --invert-fg: #FFFFFF;

    --danger: #D70015;
    --danger-soft: rgba(255, 59, 48, 0.1);
    --warning: #FF9500;
    --ai: #6D28D9;
    --ai-soft: rgba(124, 58, 237, 0.1);
    --ai-line: rgba(124, 58, 237, 0.3);
    --ai-solid: #7C3AED;
    --on-ai-solid: #FFFFFF;
    --rating: #FFB800;
    --ongoing: #177E4D;
    --like: #FF2D55;
    --premium: #9A6A00;
    --premium-soft: rgba(246, 195, 67, 0.18);
    --admin: #D70015;
    --admin-soft: rgba(255, 59, 48, 0.1);
    --accent-tertiary-rgb: 255, 59, 48;

    --shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.06);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
}

/* ── Ana renk (docs/theme.md) ──
   Kullanıcının seçtiği vurgu rengi. Tek kaynak src/Service/ThemePalette.php; yeşil varsayılandır
   (:root ve [data-theme="light"]). tests/theme-palette-contract.php bu blokları denetler. */
[data-accent="green"] {
    --brand: #48BD82;
    --brand-rgb: 72, 189, 130;
    --on-brand: #000000;
    --brand-ink: #48BD82;
    --brand-soft: rgba(72, 189, 130, 0.14);
    --brand-line: rgba(72, 189, 130, 0.45);
    --focus-ring: rgba(72, 189, 130, 0.55);
    --mock-accent-dark: #48BD82;
    --mock-accent-light: #48BD82;
}
[data-accent="teal"] {
    --brand: #2CC5B8;
    --brand-rgb: 44, 197, 184;
    --on-brand: #000000;
    --brand-ink: #2CC5B8;
    --brand-soft: rgba(44, 197, 184, 0.14);
    --brand-line: rgba(44, 197, 184, 0.45);
    --focus-ring: rgba(44, 197, 184, 0.55);
    --mock-accent-dark: #2CC5B8;
    --mock-accent-light: #0A7A72;
}
[data-theme="light"][data-accent="teal"] {
    --brand: #0A7A72;
    --brand-rgb: 10, 122, 114;
    --on-brand: #FFFFFF;
    --brand-ink: #0A7A72;
    --brand-soft: rgba(10, 122, 114, 0.10);
    --brand-line: rgba(10, 122, 114, 0.45);
    --focus-ring: rgba(10, 122, 114, 0.55);
}
[data-accent="blue"] {
    --brand: #5AA2FF;
    --brand-rgb: 90, 162, 255;
    --on-brand: #000000;
    --brand-ink: #5AA2FF;
    --brand-soft: rgba(90, 162, 255, 0.14);
    --brand-line: rgba(90, 162, 255, 0.45);
    --focus-ring: rgba(90, 162, 255, 0.55);
    --mock-accent-dark: #5AA2FF;
    --mock-accent-light: #1D6FE0;
}
[data-theme="light"][data-accent="blue"] {
    --brand: #1D6FE0;
    --brand-rgb: 29, 111, 224;
    --on-brand: #FFFFFF;
    --brand-ink: #1D6FE0;
    --brand-soft: rgba(29, 111, 224, 0.10);
    --brand-line: rgba(29, 111, 224, 0.45);
    --focus-ring: rgba(29, 111, 224, 0.55);
}
[data-accent="indigo"] {
    --brand: #8E8CFF;
    --brand-rgb: 142, 140, 255;
    --on-brand: #000000;
    --brand-ink: #8E8CFF;
    --brand-soft: rgba(142, 140, 255, 0.14);
    --brand-line: rgba(142, 140, 255, 0.45);
    --focus-ring: rgba(142, 140, 255, 0.55);
    --mock-accent-dark: #8E8CFF;
    --mock-accent-light: #5550DD;
}
[data-theme="light"][data-accent="indigo"] {
    --brand: #5550DD;
    --brand-rgb: 85, 80, 221;
    --on-brand: #FFFFFF;
    --brand-ink: #5550DD;
    --brand-soft: rgba(85, 80, 221, 0.10);
    --brand-line: rgba(85, 80, 221, 0.45);
    --focus-ring: rgba(85, 80, 221, 0.55);
}
[data-accent="purple"] {
    --brand: #C084FC;
    --brand-rgb: 192, 132, 252;
    --on-brand: #000000;
    --brand-ink: #C084FC;
    --brand-soft: rgba(192, 132, 252, 0.14);
    --brand-line: rgba(192, 132, 252, 0.45);
    --focus-ring: rgba(192, 132, 252, 0.55);
    --mock-accent-dark: #C084FC;
    --mock-accent-light: #8A3CD6;
}
[data-theme="light"][data-accent="purple"] {
    --brand: #8A3CD6;
    --brand-rgb: 138, 60, 214;
    --on-brand: #FFFFFF;
    --brand-ink: #8A3CD6;
    --brand-soft: rgba(138, 60, 214, 0.10);
    --brand-line: rgba(138, 60, 214, 0.45);
    --focus-ring: rgba(138, 60, 214, 0.55);
}
[data-accent="pink"] {
    --brand: #FF6FB0;
    --brand-rgb: 255, 111, 176;
    --on-brand: #000000;
    --brand-ink: #FF6FB0;
    --brand-soft: rgba(255, 111, 176, 0.14);
    --brand-line: rgba(255, 111, 176, 0.45);
    --focus-ring: rgba(255, 111, 176, 0.55);
    --mock-accent-dark: #FF6FB0;
    --mock-accent-light: #C9287A;
}
[data-theme="light"][data-accent="pink"] {
    --brand: #C9287A;
    --brand-rgb: 201, 40, 122;
    --on-brand: #FFFFFF;
    --brand-ink: #C9287A;
    --brand-soft: rgba(201, 40, 122, 0.10);
    --brand-line: rgba(201, 40, 122, 0.45);
    --focus-ring: rgba(201, 40, 122, 0.55);
}
[data-accent="coral"] {
    --brand: #FF7B6B;
    --brand-rgb: 255, 123, 107;
    --on-brand: #000000;
    --brand-ink: #FF7B6B;
    --brand-soft: rgba(255, 123, 107, 0.14);
    --brand-line: rgba(255, 123, 107, 0.45);
    --focus-ring: rgba(255, 123, 107, 0.55);
    --mock-accent-dark: #FF7B6B;
    --mock-accent-light: #CD3A28;
}
[data-theme="light"][data-accent="coral"] {
    --brand: #CD3A28;
    --brand-rgb: 205, 58, 40;
    --on-brand: #FFFFFF;
    --brand-ink: #CD3A28;
    --brand-soft: rgba(205, 58, 40, 0.10);
    --brand-line: rgba(205, 58, 40, 0.45);
    --focus-ring: rgba(205, 58, 40, 0.55);
}
[data-accent="orange"] {
    --brand: #FFA14A;
    --brand-rgb: 255, 161, 74;
    --on-brand: #000000;
    --brand-ink: #FFA14A;
    --brand-soft: rgba(255, 161, 74, 0.14);
    --brand-line: rgba(255, 161, 74, 0.45);
    --focus-ring: rgba(255, 161, 74, 0.55);
    --mock-accent-dark: #FFA14A;
    --mock-accent-light: #AD5300;
}
[data-theme="light"][data-accent="orange"] {
    --brand: #AD5300;
    --brand-rgb: 173, 83, 0;
    --on-brand: #FFFFFF;
    --brand-ink: #AD5300;
    --brand-soft: rgba(173, 83, 0, 0.10);
    --brand-line: rgba(173, 83, 0, 0.45);
    --focus-ring: rgba(173, 83, 0, 0.55);
}

/* okutoon-asset-complete */
