/* ============================================================================
 * Studio OS — Console Design Tokens (AdminPanel mirror)
 * Linear issue: TECH-5495 (F9.1)
 *
 * Bu dosya WebApp'teki studio-tokens.css'in birebir kopyasidir; iki shell
 * (WebApp + AdminPanel) tek bir Studio OS palettini paylasir. Drift olusmamasi
 * icin degerleri WebApp ile senkron tut — yalniz iki dosyayi birlikte guncelle.
 *
 * Yuklenme sirasi (App.razor head'inde):
 *   1) MudBlazor.min.css         (framework)
 *   2) TechLiberty.AdminPanel.styles.css (scoped CSS)
 *   3) console-tokens.css         (bu dosya — Studio OS kok degiskenleri)
 *   4) console-mud-override.css   (MudBlazor palette + class override)
 *
 * Kaynak: TechLiberty.WebApp/wwwroot/css/studio-tokens.css (TECH-5461)
 * ========================================================================== */

:root {
    /* Zemin & metin — sicak krem palette */
    --studio-cream: #F4F1EA;
    --studio-cream-2: #EAE6DC;
    --studio-cream-3: #DDD7C7;
    --studio-cream-soft: #FAF8F2;     /* admin/light sections */

    --studio-ink: #0B0B0F;             /* ana metin / kontrast bantlari */
    --studio-ink-2: #1A1A1F;
    --studio-ink-3: #26262E;

    --studio-line: rgba(11, 11, 15, 0.08);
    --studio-line-2: rgba(11, 11, 15, 0.14);
    --studio-line-dark: rgba(255, 255, 255, 0.08);

    --studio-muted: #6B6961;
    --studio-muted-2: #9A988E;

    /* Urun renkleri — her urun kendi DNA'si */
    --studio-product-muh: #2E5BFF;     /* Muhasebecin — elektrik mavi */
    --studio-product-rate: #FF3D8B;    /* RateTheWork — magenta */
    --studio-product-gof: #7B3FF2;     /* Gof Games — mor */
    --studio-product-san: #FF7A1A;     /* Santiye Bul — kehribar */
    --studio-product-ai: #00C28E;      /* Studio AI / yesil */

    /* Aurora gradient (hero + dikkat noktalari) */
    --studio-aurora: linear-gradient(115deg,
        var(--studio-product-muh) 0%,
        var(--studio-product-gof) 45%,
        var(--studio-product-rate) 80%,
        var(--studio-product-san) 100%);

    /* Tipografi aileleri */
    --studio-font-display: 'Russo One', 'Jost', system-ui, sans-serif;
    --studio-font-body: 'Jost', system-ui, sans-serif;
    --studio-font-mono: 'Geist Mono', 'JetBrains Mono', ui-monospace, monospace;
    /* Alias: issue spec'inde --studio-font-ui adi gectigi icin alias birakiyoruz */
    --studio-font-ui: var(--studio-font-body);

    /* Display font variation defaults */
    --studio-display-wdth: 100;
    --studio-display-opsz: 96;

    /* Spacing scale */
    --studio-space-1: 4px;
    --studio-space-2: 8px;
    --studio-space-3: 12px;
    --studio-space-4: 16px;
    --studio-space-5: 24px;
    --studio-space-6: 32px;
    --studio-space-7: 48px;
    --studio-space-8: 64px;
    --studio-space-9: 96px;
    --studio-space-10: 128px;

    /* Radius */
    --studio-radius-sm: 8px;
    --studio-radius-md: 14px;
    --studio-radius-lg: 20px;
    --studio-radius-xl: 24px;
    --studio-radius-pill: 100px;

    /* Shadows */
    --studio-shadow-card: 0 24px 60px -28px rgba(11, 11, 15, 0.18);
    --studio-shadow-frame: 0 60px 120px -50px rgba(11, 11, 15, 0.25);
    --studio-shadow-soft: 0 2px 6px rgba(11, 11, 15, 0.04);

    /* Z-index scale */
    --studio-z-topbar: 100;
    --studio-z-overlay: 1000;
    --studio-z-modal: 1100;
}

/* ----------------------------------------------------------------------------
 * Console arka plan — admin panelinin govde rengi
 * MainLayout ana icerik alaninda bu degiskeni referans alir
 * -------------------------------------------------------------------------- */
.console-shell {
    background: var(--studio-cream-soft);
    color: var(--studio-ink);
    font-family: var(--studio-font-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ----------------------------------------------------------------------------
 * Reduced motion: kullanici hareket azaltma istedi ise animasyonlari durdur
 * -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
}