/*
 * ===========================================================================
 * VIZITLINK3D — DEGISKENLER (degiskenler.css) — Industrial Luxury Paleti
 * ===========================================================================
 * Sistem geneli renkler, fontlar, golgeler, yuvarlaklik, bosluk ve gecis
 * degerleri. Tum bilesenler hardcoded renk yerine bu degiskenleri kullanir.
 * Anayasa §12.3, §46 — CSS token merkezi zorunlu.
 * ===========================================================================
 */
@import '/css/temalar/zendoor/tokens.css';

:root {
    /* ═══════════════════════════════════════════════════════════════
     * ANA RENK PALETI — Industrial Luxury (Siyah / Bronze / Beyaz)
     * Referans: 3dvizitlink.com.tr
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-primary: #0a0a0a;          /* Endüstriyel Siyah */
    --vizit-primary-light: #1a1a1a;
    --vizit-primary-dark: #000000;
    --vizit-secondary: #1C1C1C;
    --vizit-accent: #c19b76;           /* Bronze (anayasa standardi) */
    --vizit-accent-light: #d4a574;
    --vizit-accent-dark: #a0784c;
    --vizit-gold: #C5A059;             /* VizitLink3D Gold (admin) */

    /* ═══════════════════════════════════════════════════════════════
     * ARKAPLAN VE YUZEY
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-bg-base: #ffffff;
    --vizit-bg-alt: #F8F8F8;
    --vizit-bg-dark: #0a0a0a;
    --vizit-bg-section: #F5F5F0;
    --vizit-surface: #ffffff;
    --vizit-surface-hover: #FAFAFA;
    --vizit-border: #E8E8E8;
    --vizit-border-light: #F0F0F0;

    /* ═══════════════════════════════════════════════════════════════
     * METIN
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-text: #1A1A1A;
    --vizit-text-secondary: #4A4A4A;
    --vizit-text-muted: #888888;
    --vizit-text-light: #AAAAAA;
    --vizit-text-inverse: #FFFFFF;

    /* ═══════════════════════════════════════════════════════════════
     * TIPOGRAFI (Noto Serif baslik + Manrope govde)
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-font-serif: 'Noto Serif', 'Playfair Display', 'Cormorant Garamond', serif;
    --vizit-font-sans: 'Manrope', 'Inter', 'Segoe UI', system-ui, sans-serif;
    --vizit-font-mono: 'JetBrains Mono', 'Consolas', monospace;

    /* ═══════════════════════════════════════════════════════════════
     * GOLGE
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
    --vizit-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.06);
    --vizit-shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.10);
    --vizit-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.15);
    --vizit-shadow-lux: 0 20px 60px rgba(193, 155, 118, 0.12);
    --vizit-shadow-hover: 0 10px 30px rgba(0, 0, 0, 0.1);

    /* ═══════════════════════════════════════════════════════════════
     * KENAR YARICAPI (Keskin — Industrial)
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-radius-none: 0px;
    --vizit-radius-sm: 2px;
    --vizit-radius-md: 4px;
    --vizit-radius-lg: 0px;  /* Sharp corners — VizitLink3D imza */

    /* ═══════════════════════════════════════════════════════════════
     * BOSLUK
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-space-xs: 0.25rem;
    --vizit-space-sm: 0.5rem;
    --vizit-space-md: 1rem;
    --vizit-space-lg: 1.5rem;
    --vizit-space-xl: 2.5rem;
    --vizit-space-2xl: 4rem;
    --vizit-space-3xl: 6rem;

    /* ═══════════════════════════════════════════════════════════════
     * GECIS VE ANIMASYON
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-transition-fast: 0.15s ease;
    --vizit-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --vizit-transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    --vizit-transition-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ═══════════════════════════════════════════════════════════════
     * RESPONSIVE BREAKPOINT
     * ═══════════════════════════════════════════════════════════════ */
    --vizit-screen-mobile: 480px;
    --vizit-screen-tablet: 768px;
    --vizit-screen-desktop: 1280px;

    /* ═══════════════════════════════════════════════════════════════
      * ADMIN PANEL — ENDÜSTRİYEL KARANLIK TEMA (VizitLink3D v2)
      * Tüm admin sayfaları bu token'ları kullanır — TEK KAYNAK.
      * ═══════════════════════════════════════════════════════════════ */
    --admin-bg: #0a0a0a;
    --admin-surface: #111111;
    --admin-surface-hover: #1a1a1a;
    --admin-surface-raised: #161616;
    --admin-border: rgba(255,255,255,0.06);
    --admin-border-light: rgba(255,255,255,0.04);
    --admin-border-focus: rgba(197,160,89,0.25);
    --admin-primary: #0a0a0a;
    --admin-primary-light: #151515;
    --admin-secondary: #1C1C1C;
    --admin-accent: #C5A059;
    --admin-accent-light: #d4a574;
    --admin-text: #ffffff;
    --admin-text-secondary: rgba(255,255,255,0.70);
    --admin-text-muted: rgba(255,255,255,0.40);
    --admin-text-dim: rgba(255,255,255,0.20);
    --admin-danger: #DC2626;
    --admin-success: #22C55E;
    --admin-warning: #F59E0B;
    --admin-info: #3B82F6;
    --admin-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    --admin-shadow-hover: 0 8px 32px rgba(0, 0, 0, 0.5);
    --admin-shadow-glow: 0 0 20px rgba(197,160,89,0.08);
    --admin-radius: 0px;
    --admin-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --admin-font: 'Manrope', system-ui, sans-serif;
    --admin-font-mono: 'JetBrains Mono', monospace;

    /* Admin panel eksik tokenlar — dashboard / banner */
    --admin-divider: rgba(255,255,255,0.06);
    --admin-text-primary: #ffffff;
    --admin-text-disabled: rgba(255,255,255,0.30);

    /* Genel bosluk tokenlari */
    --bosluk-sm: 8px;
    --bosluk-md: 16px;
    --bosluk-lg: 24px;

    /* Geriye uyumlu ortak token adlari */
    --ana-renk: var(--vizit-primary);
    --ana-renk-koyu: var(--vizit-primary-dark);
    --ikincil-renk: var(--vizit-secondary);
    --vurgu-renk: var(--vizit-accent);
    --metin-ana: var(--vizit-text);
    --metin-ikincil: var(--vizit-text-secondary);
    --metin-soluk: var(--vizit-text-muted);
    --metin-ters: var(--vizit-text-inverse);
    --zemin-ana: var(--vizit-bg-base);
    --zemin-hafif: var(--vizit-bg-alt);
    --zemin-kart: var(--vizit-surface);
    --cizgi-rengi: var(--vizit-border);
    --boyut-xs: var(--vizit-space-xs);
    --boyut-sm: var(--vizit-space-sm);
    --boyut-md: var(--vizit-space-md);
    --boyut-lg: var(--vizit-space-lg);
    --boyut-xl: var(--vizit-space-xl);
    --kose-sm: var(--vizit-radius-sm);
    --kose-md: var(--vizit-radius-md);
    --kose-lg: var(--vizit-radius-lg);
    --golge-sm: var(--vizit-shadow-sm);
    --golge-md: var(--vizit-shadow-md);
    --golge-lg: var(--vizit-shadow-lg);
    --gecis-hizli: var(--vizit-transition-fast);
    --gecis-normal: var(--vizit-transition);
    --gecis-yavas: var(--vizit-transition-slow);
    --vizit-radius: var(--vizit-radius-md);
    --vizit-gallery-shadow: var(--vizit-shadow-lg);

    /* 3D endustriyel viewer tokenlari */
    --vizit-3d-bg: #1a1a1a;
    --vizit-3d-bg-dark: #111111;
    --vizit-3d-panel: rgba(10, 10, 10, 0.74);
    --vizit-3d-panel-soft: rgba(255, 255, 255, 0.82);
    --vizit-3d-border: rgba(26, 26, 26, 0.12);
    --vizit-3d-grid: rgba(26, 26, 26, 0.16);
    --vizit-3d-grid-soft: rgba(197, 160, 89, 0.22);
    --vizit-3d-accent: var(--vizit-gold);
    --vizit-3d-metal: #73706a;
    --vizit-3d-shadow: 0 20px 60px rgba(10, 10, 10, 0.18);

    /* Konfigurator Studio tokenlari */
    --konfigurator-secili-arka-plan: rgba(200, 149, 42, 0.06);
    --konfigurator-hover-arka-plan: rgba(212, 165, 116, 0.08);
    --konfigurator-overlay-arka-plan: rgba(26, 26, 39, 0.4);
    --konfigurator-cizgi: rgba(0, 0, 0, 0.04);
    --konfigurator-cizgi-orta: rgba(0, 0, 0, 0.06);
    --konfigurator-cizgi-kalin: rgba(0, 0, 0, 0.08);

    /* Konfigurator Studio fallback tokenlari — tanimsiz token'lara karsı guvenlik */
    --arkaplan-yumusak: var(--vizit-bg-alt);
    --metin-acik: var(--vizit-text-muted);
    --metin: var(--vizit-text);
}

/* ═══════════════════════════════════════════════════════════════
 * ZENDOOR KARANLIK TEMA OVERRIDES
 * ═══════════════════════════════════════════════════════════════ */
:root[data-site-tema="gold"] {
    /* Ana Palet - Dark Luxury */
    --vizit-primary: #121212;
    --vizit-primary-light: #1E1E1E;
    --vizit-primary-dark: #000000;
    --vizit-secondary: #1a1a1a;
    --vizit-accent: #C5A059;
    --vizit-accent-light: #d4a574;
    --vizit-accent-dark: #a0784c;

    /* Arkaplan ve Yüzey */
    --vizit-bg-base: #121212;
    --vizit-bg-alt: #161616;
    --vizit-bg-dark: #0a0a0a;
    --vizit-bg-section: #1a1a1a;
    --vizit-surface: #1E1E1E;
    --vizit-surface-hover: #252525;
    --vizit-border: rgba(255,255,255,0.08);
    --vizit-border-light: rgba(255,255,255,0.04);

    /* Metin */
    --vizit-text: #FFFFFF;
    --vizit-text-secondary: rgba(255, 255, 255, 0.70);
    --vizit-text-muted: rgba(255, 255, 255, 0.40);
    --vizit-text-light: rgba(255, 255, 255, 0.20);
    --vizit-text-inverse: #121212;

    /* Gölge (Altın Glow efekti) */
    --vizit-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
    --vizit-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.5);
    --vizit-shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.6);
    --vizit-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.7);
    --vizit-shadow-lux: 0 20px 60px rgba(197, 160, 89, 0.08);
    --vizit-shadow-hover: 0 10px 30px rgba(197, 160, 89, 0.15);

    /* Ekstra Tokenlar */
    --metin-ters: var(--vizit-text-inverse);

    /* Konfigurator Studio fallback tokenlari */
    --arkaplan-yumusak: var(--vizit-bg-alt);
    --metin-acik: var(--vizit-text-muted);
    --metin: var(--vizit-text);
}

/* ═══════════════════════════════════════════════════════════════
 * AURELIAN ONYX TEMA OVERRIDES
 * Stitch AI tarafindan uretilen ikinci tema
 * Derin onyx siyah, glowing gold vurgu, glassmorphism
 * ═══════════════════════════════════════════════════════════════ */
:root[data-site-tema="aurelian-onyx"] {
    /* Ana Palet - Derin Onyx Siyah */
    --vizit-primary: #050505;
    --vizit-primary-light: #121414;
    --vizit-primary-dark: #000000;
    --vizit-secondary: #1C3A33;
    --vizit-accent: #d4af37;
    --vizit-accent-light: #e9c349;
    --vizit-accent-dark: #a07020;
    --vizit-gold: #d4af37;

    /* Arkaplan ve Yuzey */
    --vizit-bg-base: #121414;
    --vizit-bg-alt: #1a1c1c;
    --vizit-bg-dark: #050505;
    --vizit-bg-section: #161818;
    --vizit-surface: #1C3A33;
    --vizit-surface-hover: #252828;
    --vizit-border: rgba(255,255,255,0.1);
    --vizit-border-light: rgba(255,255,255,0.04);

    /* Metin */
    --vizit-text: #e2e2e2;
    --vizit-text-secondary: rgba(255, 255, 255, 0.70);
    --vizit-text-muted: rgba(255, 255, 255, 0.40);
    --vizit-text-light: rgba(255, 255, 255, 0.20);
    --vizit-text-inverse: #121414;

    /* Golge (Altin Glow efekti) */
    --vizit-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
    --vizit-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.6);
    --vizit-shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.7);
    --vizit-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.8);
    --vizit-shadow-lux: 0 0 15px rgba(212, 175, 55, 0.25);
    --vizit-shadow-hover: 0 10px 30px rgba(212, 175, 55, 0.15);

    /* Tipografi - Playfair Display + Space Grotesk */
    --vizit-font-serif: 'Playfair Display', 'Noto Serif', 'Cormorant Garamond', serif;
    --vizit-font-sans: 'Space Grotesk', 'Manrope', 'Inter', 'Segoe UI', system-ui, sans-serif;

    /* Kenar Yaricapli - Keskin Onyx */
    --vizit-radius-none: 0px;
    --vizit-radius-sm: 2px;
    --vizit-radius-md: 4px;
    --vizit-radius-lg: 4px;

    /* 3D viewer overrides */
    --vizit-3d-bg: #050505;
    --vizit-3d-bg-dark: #000000;
    --vizit-3d-panel: rgba(18, 20, 20, 0.85);
    --vizit-3d-accent: #d4af37;

    /* Aurelian-specific glassmorphism tokenlari */
    --aureli-glass-bg: rgba(18, 20, 20, 0.75);
    --aureli-glass-border: rgba(212, 175, 55, 0.15);
    --aureli-glow: 0 0 15px rgba(212, 175, 55, 0.25);
    --aureli-blur: 20px;

    /* Geriye uyumlu override */
    --metin-ters: var(--vizit-text-inverse);

    /* Konfigurator Studio fallback tokenlari */
    --arkaplan-yumusak: var(--vizit-bg-alt);
    --metin-acik: var(--vizit-text-muted);
    --metin: var(--vizit-text);
}

/* Notr tonlar - inline style donusumunden gelen siniflar icin */
:root {
    --tema-notr-000: #ffffff;
    --tema-notr-050: #fafafa;
    --tema-notr-100: #f8f8f8;
    --tema-notr-150: #f6f3ed;
    --tema-notr-200: #f5f5f5;
    --tema-notr-250: #f9f9f9;
    --tema-notr-300: #eeeeee;
    --tema-notr-350: #dddddd;
    --tema-notr-400: #cccccc;
    --tema-notr-500: #aaaaaa;
    --tema-notr-600: #999999;
    --tema-notr-700: #888888;
    --tema-notr-800: #666666;
    --tema-notr-900: #333333;
    --tema-notr-950: #1a1c1c;
    --tema-notr-1000: #111111;
    --tema-notr-1100: #000000;
    --tema-altin-koyu: #c8952a;
}

/* Perde / overlay tonlari */
:root {
    --tema-perde-koyu-30: rgba(0,0,0,0.3);
    --tema-perde-koyu-40: rgba(0,0,0,0.4);
    --tema-perde-koyu-50: rgba(0,0,0,0.5);
    --tema-perde-koyu-70: rgba(0,0,0,0.7);
    --tema-perde-acik-08: rgba(255,255,255,.08);
    --tema-perde-acik-50: rgba(255,255,255,0.5);
    --tema-perde-acik-80: rgba(255,255,255,0.8);
    --tema-perde-kahve-60: rgba(64,46,24,0.6);
    --tema-perde-siyah-90: rgba(12,12,12,0.9);
}