/*
    AbbTech B2B - Modern Tema (Token Katmani)
    -----------------------------------------
    Velzon'un renk / tipografi / yaricap tokenlarini yeniden tanimlar.
    Tek satir bile markup degistirmeden uygulamanin TAMAMINI donusturur,
    cunku Velzon ve Bootstrap tum renklerini bu --vz-* degiskenlerinden okur.

    Yuklenme sirasi:
      app.min.css -> custom.min.css -> b2b-modern.css -> b2b-theme.css
                                    -> b2b-ui.css     -> b2b-mobile.css

    Eski gorunume donmek icin bu dosyanin <link> satirini kaldirmak yeterlidir.
*/

/* ============================================================
   1. TIPOGRAFI
   ------------------------------------------------------------
   Velzon "Inter" tanimliyor ama fontu HIC YUKLEMIYOR (ne @font-face
   ne de bir webfont linki var), bu yuzden tarayici genel sans-serif'e
   dusuyordu. Once yerelde Inter varsa onu, yoksa Windows 11'in modern
   Segoe UI Variable ailesini kullaniyoruz. Hicbir ag istegi yok.
   ============================================================ */

:root,
:root[data-bs-theme="light"],
:root[data-bs-theme="dark"] {
    --vz-font-sans-serif:
        "Inter",
        "Segoe UI Variable Text", "Segoe UI",
        system-ui, -apple-system,
        "Helvetica Neue", Arial, sans-serif;

    /* 13px -> 14px: ekranlarda ve ozellikle mobilde belirgin okunabilirlik */
    --vz-body-font-size: .875rem;
    --vz-body-line-height: 1.55;

    /* Daha yumusak, guncel yaricaplar */
    --vz-border-radius: .5rem;
    --vz-border-radius-sm: .375rem;
    --vz-border-radius-lg: .75rem;
    --vz-border-radius-xl: 1rem;
    --vz-border-width: 1px;
}

/* ============================================================
   2. ACIK TEMA PALETI
   ------------------------------------------------------------
   Marka kimligi (indigo) korunur, tonlar tazelenir; notr renkler
   Velzon'un morumsu grilerinden serin bir slate skalasina gecer.
   ============================================================ */

:root,
:root[data-bs-theme="light"] {

    /* --- Marka --- */
    --vz-primary: #5a4be1;
    --vz-primary-rgb: 90, 75, 225;
    --vz-primary-text-emphasis: #4032b0;
    --vz-primary-bg-subtle: #eeecfd;
    --vz-primary-border-subtle: #c8c1f5;

    /* --- Ikincil: notr slate (eskiden mavi idi) --- */
    --vz-secondary: #64748b;
    --vz-secondary-rgb: 100, 116, 139;
    --vz-secondary-text-emphasis: #4a5568;
    --vz-secondary-bg-subtle: #f1f3f8;
    --vz-secondary-border-subtle: #dde2ec;

    /* --- Durum renkleri: guncel, daha yuksek kontrast --- */
    --vz-success: #10b981;
    --vz-success-rgb: 16, 185, 129;
    --vz-success-text-emphasis: #0a8f63;
    --vz-success-bg-subtle: #e6f8f1;
    --vz-success-border-subtle: #a6e5cd;

    --vz-info: #3b82f6;
    --vz-info-rgb: 59, 130, 246;
    --vz-info-text-emphasis: #2563eb;
    --vz-info-bg-subtle: #e9f1fe;
    --vz-info-border-subtle: #b7d2fb;

    --vz-warning: #f59e0b;
    --vz-warning-rgb: 245, 158, 11;
    --vz-warning-text-emphasis: #b57409;
    --vz-warning-bg-subtle: #fef5e3;
    --vz-warning-border-subtle: #fbdc9e;

    --vz-danger: #ef4444;
    --vz-danger-rgb: 239, 68, 68;
    --vz-danger-text-emphasis: #c62b2b;
    --vz-danger-bg-subtle: #fdeceb;
    --vz-danger-border-subtle: #f8bab9;

    --vz-light: #f4f6fa;
    --vz-light-rgb: 244, 246, 250;
    --vz-light-bg-subtle: #fafbfd;
    --vz-light-border-subtle: #eef1f6;

    --vz-dark: #141a29;
    --vz-dark-rgb: 20, 26, 41;
    --vz-dark-bg-subtle: #e6e9f0;
    --vz-dark-border-subtle: #aeb6c6;

    /* --- Notr yuzeyler ve metin --- */
    --vz-body-bg: #f6f7fb;
    --vz-body-bg-rgb: 246, 247, 251;
    --vz-body-color: #1e2433;
    --vz-body-color-rgb: 30, 36, 51;
    --vz-emphasis-color: #0f1420;
    --vz-emphasis-color-rgb: 15, 20, 32;
    --vz-heading-color: #141a29;

    --vz-secondary-color: #7b8496;
    --vz-secondary-color-rgb: 123, 132, 150;
    --vz-secondary-bg: #ffffff;
    --vz-secondary-bg-rgb: 255, 255, 255;
    --vz-tertiary-color: rgba(30, 36, 51, .55);
    --vz-tertiary-bg: #f1f3f9;

    --vz-border-color: #e6e9f1;
    --vz-border-color-translucent: rgba(20, 26, 41, .09);

    --vz-link-color: #5a4be1;
    --vz-link-hover-color: #4737c4;

    /* --- Uygulama kabugu --- */
    --vz-header-bg: #ffffff;
    --vz-header-border: #e6e9f1;
    --vz-header-item-color: #3c4459;
    --vz-header-item-sub-color: #7b8496;
    --vz-header-item-bg: rgba(90, 75, 225, .10);
    --vz-topbar-search-bg: #f1f3f9;
    --vz-topbar-search-color: #1e2433;
    --vz-topbar-user-bg: #f1f3f9;

    --vz-page-title-box-shadow: none;
    --vz-page-title-border: #e6e9f1;

    --vz-footer-bg: #ffffff;
    --vz-footer-color: #7b8496;

    --vz-card-bg: #ffffff;
    --vz-dropdown-bg: #ffffff;

    --vz-input-bg-custom: #ffffff;
    --vz-input-border-custom: #dfe3ec;
}

/* ============================================================
   3. KOYU TEMA PALETI
   ------------------------------------------------------------
   Velzon'un sicak grileri yerine derin, notr bir slate.
   ============================================================ */

:root[data-bs-theme="dark"] {
    --vz-primary: #7c6ff0;
    --vz-primary-rgb: 124, 111, 240;
    --vz-primary-text-emphasis: #a99fff;
    --vz-primary-bg-subtle: rgba(124, 111, 240, .16);
    --vz-primary-border-subtle: rgba(124, 111, 240, .35);

    --vz-secondary: #94a3b8;
    --vz-secondary-rgb: 148, 163, 184;
    --vz-secondary-text-emphasis: #b9c3d1;
    --vz-secondary-bg-subtle: #1e242f;
    --vz-secondary-border-subtle: #2c3441;

    --vz-success: #34d399;
    --vz-success-rgb: 52, 211, 153;
    --vz-success-text-emphasis: #6ee7b7;
    --vz-success-bg-subtle: rgba(52, 211, 153, .15);
    --vz-success-border-subtle: rgba(52, 211, 153, .32);

    --vz-info: #60a5fa;
    --vz-info-rgb: 96, 165, 250;
    --vz-info-text-emphasis: #93c5fd;
    --vz-info-bg-subtle: rgba(96, 165, 250, .15);
    --vz-info-border-subtle: rgba(96, 165, 250, .32);

    --vz-warning: #fbbf24;
    --vz-warning-rgb: 251, 191, 36;
    --vz-warning-text-emphasis: #fcd34d;
    --vz-warning-bg-subtle: rgba(251, 191, 36, .15);
    --vz-warning-border-subtle: rgba(251, 191, 36, .32);

    --vz-danger: #f87171;
    --vz-danger-rgb: 248, 113, 113;
    --vz-danger-text-emphasis: #fca5a5;
    --vz-danger-bg-subtle: rgba(248, 113, 113, .15);
    --vz-danger-border-subtle: rgba(248, 113, 113, .32);

    --vz-light: #1b212c;
    --vz-light-rgb: 27, 33, 44;
    --vz-light-bg-subtle: #171c25;
    --vz-light-border-subtle: #262d3a;

    --vz-dark: #e6eaf2;
    --vz-dark-rgb: 230, 234, 242;
    --vz-dark-bg-subtle: #2a323f;
    --vz-dark-border-subtle: #39424f;

    --vz-body-bg: #0e1017;
    --vz-body-bg-rgb: 14, 16, 23;
    --vz-body-color: #c3cad8;
    --vz-body-color-rgb: 195, 202, 216;
    --vz-emphasis-color: #ffffff;
    --vz-heading-color: #e6eaf2;

    --vz-secondary-color: #7e8798;
    --vz-secondary-color-rgb: 126, 135, 152;
    --vz-secondary-bg: #161a23;
    --vz-secondary-bg-rgb: 22, 26, 35;
    --vz-tertiary-color: rgba(195, 202, 216, .72);
    --vz-tertiary-bg: #1a1f29;

    --vz-border-color: #242b37;
    --vz-border-color-translucent: rgba(255, 255, 255, .08);

    --vz-link-color: #a99fff;
    --vz-link-hover-color: #c4bcff;

    --vz-header-bg: #12151d;
    --vz-header-border: #242b37;
    --vz-header-item-color: #c3cad8;
    --vz-header-item-sub-color: #7e8798;
    --vz-header-item-bg: rgba(124, 111, 240, .16);
    --vz-topbar-search-bg: rgba(255, 255, 255, .05);
    --vz-topbar-search-color: #e6eaf2;
    --vz-topbar-user-bg: #1c2129;

    --vz-page-title-border: #242b37;
    --vz-footer-bg: #12151d;
    --vz-footer-color: #7e8798;

    --vz-card-bg: #161a23;
    --vz-dropdown-bg: #1a1f29;

    --vz-input-bg-custom: #12151d;
    --vz-input-border-custom: #2c3441;
}

/* ============================================================
   4. KENAR CUBUGU PALETI
   ============================================================ */

:root[data-sidebar="dark"],
[data-sidebar="dark"] {
    --vz-vertical-menu-bg: #12141c;
    --vz-vertical-menu-border: #1c1f2a;
    --vz-vertical-menu-item-color: #98a1b3;
    --vz-vertical-menu-item-hover-color: #ffffff;
    --vz-vertical-menu-item-active-color: #ffffff;
    --vz-vertical-menu-item-active-bg: rgba(255, 255, 255, .07);
    --vz-vertical-menu-sub-item-color: #8b93a5;
    --vz-vertical-menu-sub-item-hover-color: #ffffff;
    --vz-vertical-menu-sub-item-active-color: #ffffff;
    --vz-vertical-menu-title-color: #656e82;
    --vz-vertical-menu-box-shadow: none;
}

:root[data-sidebar="light"],
[data-sidebar="light"] {
    --vz-vertical-menu-bg: #ffffff;
    --vz-vertical-menu-border: #e6e9f1;
    --vz-vertical-menu-item-color: #5b6478;
    --vz-vertical-menu-item-hover-color: #5a4be1;
    --vz-vertical-menu-item-active-color: #5a4be1;
    --vz-vertical-menu-title-color: #99a1b3;
}

:root[data-topbar="dark"],
[data-topbar="dark"] {
    --vz-header-bg: #12141c;
    --vz-header-border: #1c1f2a;
    --vz-header-item-color: rgba(255, 255, 255, .88);
    --vz-header-item-sub-color: #98a1b3;
    --vz-header-item-bg: rgba(255, 255, 255, .08);
    --vz-topbar-user-bg: #1a1d27;
    --vz-topbar-search-bg: rgba(255, 255, 255, .06);
    --vz-topbar-search-color: #ffffff;
}

/* ============================================================
   5. TEMEL YUZEY DUZELTMELERI
   ------------------------------------------------------------
   Tokenlarla ifade edilemeyen birkac yapisal rafine.
   ============================================================ */

body {
    background-color: var(--vz-body-bg);
    color: var(--vz-body-color);
}

/* Velzon sayfa basligina sert bir golge veriyordu; artik ince cizgi */
.page-title-box {
    background-color: transparent;
    box-shadow: none;
    border-bottom: 1px solid var(--vz-page-title-border);
}

/* Ust cubuk ile icerik arasinda net ama yumusak bir ayrim */
#page-topbar {
    border-bottom: 1px solid var(--vz-header-border);
}

/* Kenar cubugu artik golgeyle degil ince cizgiyle ayrilir */
.app-menu.navbar-menu {
    border-right: 1px solid var(--vz-vertical-menu-border);
    box-shadow: none;
}

/* Secim ve odak vurgusu marka rengiyle */
::selection {
    background: rgba(var(--vz-primary-rgb), .2);
}
