/* ==========================================================================
   EarthVisa Acente Paneli — "Nova" Tema Paketi
   --------------------------------------------------------------------------
   Saf CSS. Hicbir JS / HTML degisikligi gerekmez.

   KURULUM
   -------
   <head> icindeki EN SON stylesheet olarak ekleyin:
       <link rel="stylesheet" href="/css/earthvisa-theme.css?v=1.0.0">

   TEMA SECIMI (6 tema + auto)
   --------------------
   <html> veya <body> etiketine data-ev-theme ekleyin:
       corporate(UYGULAMA VARSAYILANI — lacivert / fume / altin)
       aurora   (CSS taban paleti — indigo / menekse / camgobegi)
       midnight (koyu mod — gece mavisi / elektrik mavi)
       sunset   (sicak — mercan / gul / kehribar)
       emerald  (dogal — zumrut / turkuaz)
       royal    (lüks — mor / fusya / altin)

   Ornek:  <html lang="tr" data-ev-theme="midnight">

   NOT: Blade sablonlari (layouts/app, auth/login) attribute'u her zaman
   yazdigi icin uygulamanin varsayilani 'corporate'tir. CSS'te attribute
   hic yoksa :root taban paleti (aurora) gecerli olur.
   ========================================================================== */

/* ==========================================================================
   1. TASARIM JETONLARI (DESIGN TOKENS)
   ========================================================================== */

:root,
[data-ev-theme="aurora"] {
  /* --- Marka --- */
  --ev-primary:        #5b5bd6;
  --ev-primary-2:      #8b5cf6;
  --ev-primary-3:      #a78bfa;
  --ev-accent:         #06b6d4;
  --ev-accent-2:       #22d3ee;
  --ev-on-primary:     #ffffff;

  /* --- Durum renkleri --- */
  --ev-success:        #10b981;
  --ev-warning:        #f59e0b;
  --ev-danger:         #f43f5e;
  --ev-info:           #0ea5e9;

  /* --- Yuzeyler --- */
  --ev-bg:             #eef1f8;
  --ev-bg-tint-1:      rgba(91, 91, 214, .18);
  --ev-bg-tint-2:      rgba(6, 182, 212, .14);
  --ev-bg-tint-3:      rgba(139, 92, 246, .12);
  --ev-surface:        #ffffff;
  --ev-surface-2:      #f7f8fc;
  --ev-surface-3:      #eff1f8;
  --ev-surface-glass:  rgba(255, 255, 255, .72);

  /* --- Metin --- */
  --ev-text:           #1a1c2e;
  --ev-text-2:         #4a4f6a;
  --ev-text-muted:     #7c8299;
  --ev-heading:        #14162b;

  /* --- Cizgiler --- */
  --ev-border:         rgba(26, 28, 46, .09);
  --ev-border-2:       rgba(26, 28, 46, .16);

  /* --- Header --- */
  --ev-header-from:    #4f46e5;
  --ev-header-via:     #7c3aed;
  --ev-header-to:      #0891b2;
  --ev-header-text:    #ffffff;
  --ev-header-chip:    rgba(255, 255, 255, .14);
  --ev-header-chip-hi: rgba(255, 255, 255, .26);
  --ev-header-line:    rgba(255, 255, 255, .18);

  /* --- Golge --- */
  --ev-shadow-xs:  0 1px 2px rgba(21, 24, 48, .05);
  --ev-shadow-sm:  0 2px 8px -2px rgba(21, 24, 48, .10), 0 1px 3px rgba(21, 24, 48, .05);
  --ev-shadow-md:  0 8px 24px -8px rgba(21, 24, 48, .16), 0 2px 6px rgba(21, 24, 48, .05);
  --ev-shadow-lg:  0 18px 44px -16px rgba(21, 24, 48, .26), 0 4px 12px rgba(21, 24, 48, .07);
  --ev-shadow-brand: 0 8px 22px -8px color-mix(in srgb, var(--ev-primary) 55%, transparent);

  /* --- Geometri --- */
  --ev-r-xs: 7px;
  --ev-r-sm: 10px;
  --ev-r-md: 14px;
  --ev-r-lg: 18px;
  --ev-r-xl: 24px;
  --ev-r-pill: 999px;

  /* --- Hareket --- */
  --ev-ease: cubic-bezier(.32, .72, .32, 1);
  --ev-t-fast: .14s var(--ev-ease);
  --ev-t: .22s var(--ev-ease);

  --ev-font: "Inter", "Plus Jakarta Sans", "Segoe UI", -apple-system,
             BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
  --ev-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  color-scheme: light;
}

/* ---------- 2 · MIDNIGHT (koyu mod) ---------- */
[data-ev-theme="midnight"] {
  --ev-primary:        #6366f1;
  --ev-primary-2:      #818cf8;
  --ev-primary-3:      #a5b4fc;
  --ev-accent:         #22d3ee;
  --ev-accent-2:       #67e8f9;
  --ev-on-primary:     #ffffff;

  --ev-success:        #34d399;
  --ev-warning:        #fbbf24;
  --ev-danger:         #fb7185;
  --ev-info:           #38bdf8;

  --ev-bg:             #080b18;
  --ev-bg-tint-1:      rgba(99, 102, 241, .22);
  --ev-bg-tint-2:      rgba(34, 211, 238, .14);
  --ev-bg-tint-3:      rgba(168, 85, 247, .16);
  --ev-surface:        #121729;
  --ev-surface-2:      #182038;
  --ev-surface-3:      #1f2947;
  --ev-surface-glass:  rgba(18, 23, 41, .78);

  --ev-text:           #e6ebf7;
  --ev-text-2:         #b3bcd6;
  --ev-text-muted:     #8590ad;
  --ev-heading:        #f4f7ff;

  --ev-border:         rgba(255, 255, 255, .09);
  --ev-border-2:       rgba(255, 255, 255, .17);

  --ev-header-from:    #131a33;
  --ev-header-via:     #1b1f45;
  --ev-header-to:      #10263f;
  --ev-header-text:    #eef2ff;
  --ev-header-chip:    rgba(255, 255, 255, .07);
  --ev-header-chip-hi: rgba(255, 255, 255, .16);
  --ev-header-line:    rgba(255, 255, 255, .10);

  --ev-shadow-xs:  0 1px 2px rgba(0, 0, 0, .5);
  --ev-shadow-sm:  0 2px 10px -2px rgba(0, 0, 0, .6);
  --ev-shadow-md:  0 10px 28px -10px rgba(0, 0, 0, .75);
  --ev-shadow-lg:  0 22px 52px -18px rgba(0, 0, 0, .85);
  --ev-shadow-brand: 0 8px 26px -10px color-mix(in srgb, var(--ev-primary) 75%, transparent);

  /* Koyu temada palet daha acik oldugu icin dolgular biraz daha koyulastirilir */
  --ev-solid-primary:   var(--ev-primary);
  --ev-solid-success:   color-mix(in srgb, var(--ev-success) 63%, #06170f);
  --ev-solid-danger:    color-mix(in srgb, var(--ev-danger) 78%, #19040f);
  --ev-solid-warning:   color-mix(in srgb, var(--ev-warning) 59%, #1d1002);
  --ev-solid-info:      color-mix(in srgb, var(--ev-info) 68%, #02131f);
  --ev-solid-secondary: color-mix(in srgb, var(--ev-text-muted) 70%, #05070e);
  --ev-solid-dark:      #05080f;

  color-scheme: dark;
}

/* ---------- OTOMATIK (sistem koyu modu) ----------
   <html data-ev-theme="auto"> yazildiginda isletim sistemi koyu moddaysa
   MIDNIGHT paleti, aydinlik moddaysa AURORA paleti uygulanir. -------- */
@media (prefers-color-scheme: dark) {
  [data-ev-theme="auto"] {
  --ev-primary:        #6366f1;
  --ev-primary-2:      #818cf8;
  --ev-primary-3:      #a5b4fc;
  --ev-accent:         #22d3ee;
  --ev-accent-2:       #67e8f9;
  --ev-on-primary:     #ffffff;

  --ev-success:        #34d399;
  --ev-warning:        #fbbf24;
  --ev-danger:         #fb7185;
  --ev-info:           #38bdf8;

  --ev-bg:             #080b18;
  --ev-bg-tint-1:      rgba(99, 102, 241, .22);
  --ev-bg-tint-2:      rgba(34, 211, 238, .14);
  --ev-bg-tint-3:      rgba(168, 85, 247, .16);
  --ev-surface:        #121729;
  --ev-surface-2:      #182038;
  --ev-surface-3:      #1f2947;
  --ev-surface-glass:  rgba(18, 23, 41, .78);

  --ev-text:           #e6ebf7;
  --ev-text-2:         #b3bcd6;
  --ev-text-muted:     #8590ad;
  --ev-heading:        #f4f7ff;

  --ev-border:         rgba(255, 255, 255, .09);
  --ev-border-2:       rgba(255, 255, 255, .17);

  --ev-header-from:    #131a33;
  --ev-header-via:     #1b1f45;
  --ev-header-to:      #10263f;
  --ev-header-text:    #eef2ff;
  --ev-header-chip:    rgba(255, 255, 255, .07);
  --ev-header-chip-hi: rgba(255, 255, 255, .16);
  --ev-header-line:    rgba(255, 255, 255, .10);

  --ev-shadow-xs:  0 1px 2px rgba(0, 0, 0, .5);
  --ev-shadow-sm:  0 2px 10px -2px rgba(0, 0, 0, .6);
  --ev-shadow-md:  0 10px 28px -10px rgba(0, 0, 0, .75);
  --ev-shadow-lg:  0 22px 52px -18px rgba(0, 0, 0, .85);
  --ev-shadow-brand: 0 8px 26px -10px color-mix(in srgb, var(--ev-primary) 75%, transparent);

  /* Koyu temada palet daha acik oldugu icin dolgular biraz daha koyulastirilir */
  --ev-solid-primary:   var(--ev-primary);
  --ev-solid-success:   color-mix(in srgb, var(--ev-success) 63%, #06170f);
  --ev-solid-danger:    color-mix(in srgb, var(--ev-danger) 78%, #19040f);
  --ev-solid-warning:   color-mix(in srgb, var(--ev-warning) 59%, #1d1002);
  --ev-solid-info:      color-mix(in srgb, var(--ev-info) 68%, #02131f);
  --ev-solid-secondary: color-mix(in srgb, var(--ev-text-muted) 70%, #05070e);
  --ev-solid-dark:      #05080f;

  color-scheme: dark;
  }
}

/* ---------- 3 · SUNSET (sicak) ---------- */
[data-ev-theme="sunset"] {
  --ev-primary:        #f0602f;
  --ev-primary-2:      #f43f5e;
  --ev-primary-3:      #fb7185;
  --ev-accent:         #f59e0b;
  --ev-accent-2:       #fbbf24;

  --ev-success:        #16a34a;
  --ev-warning:        #d97706;
  --ev-danger:         #dc2626;
  --ev-info:           #0891b2;

  --ev-bg:             #fdf3ec;
  --ev-bg-tint-1:      rgba(240, 96, 47, .16);
  --ev-bg-tint-2:      rgba(245, 158, 11, .16);
  --ev-bg-tint-3:      rgba(244, 63, 94, .10);
  --ev-surface:        #ffffff;
  --ev-surface-2:      #fdf6f1;
  --ev-surface-3:      #f8ebe2;
  --ev-surface-glass:  rgba(255, 252, 250, .74);

  --ev-text:           #2c1a12;
  --ev-text-2:         #5d453a;
  --ev-text-muted:     #94786b;
  --ev-heading:        #21120b;

  --ev-border:         rgba(80, 40, 20, .11);
  --ev-border-2:       rgba(80, 40, 20, .20);

  --ev-header-from:    #e04b2c;
  --ev-header-via:     #f0602f;
  --ev-header-to:      #f59e0b;
  --ev-header-text:    #fff8f3;
  --ev-header-chip:    rgba(255, 255, 255, .16);
  --ev-header-chip-hi: rgba(255, 255, 255, .30);
  --ev-header-line:    rgba(255, 255, 255, .22);

  --ev-shadow-brand: 0 8px 22px -8px color-mix(in srgb, var(--ev-primary) 55%, transparent);
}

/* ---------- 4 · EMERALD (dogal) ---------- */
[data-ev-theme="emerald"] {
  --ev-primary:        #0d9488;
  --ev-primary-2:      #059669;
  --ev-primary-3:      #34d399;
  --ev-accent:         #14b8a6;
  --ev-accent-2:       #6ee7b7;

  --ev-success:        #16a34a;
  --ev-warning:        #ca8a04;
  --ev-danger:         #e11d48;
  --ev-info:           #0284c7;

  --ev-bg:             #eaf5f1;
  --ev-bg-tint-1:      rgba(13, 148, 136, .16);
  --ev-bg-tint-2:      rgba(52, 211, 153, .16);
  --ev-bg-tint-3:      rgba(2, 132, 199, .10);
  --ev-surface:        #ffffff;
  --ev-surface-2:      #f4faf7;
  --ev-surface-3:      #e8f3ee;
  --ev-surface-glass:  rgba(250, 255, 253, .74);

  --ev-text:           #10241f;
  --ev-text-2:         #3d5852;
  --ev-text-muted:     #6f8a83;
  --ev-heading:        #0a1a16;

  --ev-border:         rgba(10, 50, 42, .11);
  --ev-border-2:       rgba(10, 50, 42, .20);

  --ev-header-from:    #065f56;
  --ev-header-via:     #0d9488;
  --ev-header-to:      #14b8a6;
  --ev-header-text:    #f0fdfa;
  --ev-header-chip:    rgba(255, 255, 255, .15);
  --ev-header-chip-hi: rgba(255, 255, 255, .28);
  --ev-header-line:    rgba(255, 255, 255, .20);

  --ev-shadow-brand: 0 8px 22px -8px color-mix(in srgb, var(--ev-primary) 55%, transparent);
}

/* ---------- 5 · ROYAL (lüks) ---------- */
[data-ev-theme="royal"] {
  --ev-primary:        #7c3aed;
  --ev-primary-2:      #c026d3;
  --ev-primary-3:      #d946ef;
  --ev-accent:         #eab308;
  --ev-accent-2:       #facc15;

  --ev-success:        #15a34a;
  --ev-warning:        #d97706;
  --ev-danger:         #e11d48;
  --ev-info:           #6366f1;

  --ev-bg:             #f3eefc;
  --ev-bg-tint-1:      rgba(124, 58, 237, .18);
  --ev-bg-tint-2:      rgba(192, 38, 211, .13);
  --ev-bg-tint-3:      rgba(234, 179, 8, .12);
  --ev-surface:        #ffffff;
  --ev-surface-2:      #faf7fe;
  --ev-surface-3:      #f1eafb;
  --ev-surface-glass:  rgba(253, 251, 255, .74);

  --ev-text:           #221336;
  --ev-text-2:         #4d3a68;
  --ev-text-muted:     #816e9b;
  --ev-heading:        #190b29;

  --ev-border:         rgba(50, 20, 80, .11);
  --ev-border-2:       rgba(50, 20, 80, .20);

  --ev-header-from:    #4c1d95;
  --ev-header-via:     #7c3aed;
  --ev-header-to:      #c026d3;
  --ev-header-text:    #faf5ff;
  --ev-header-chip:    rgba(255, 255, 255, .14);
  --ev-header-chip-hi: rgba(255, 255, 255, .27);
  --ev-header-line:    rgba(255, 255, 255, .20);

  --ev-shadow-brand: 0 8px 22px -8px color-mix(in srgb, var(--ev-primary) 55%, transparent);
}

/* ---------- 6 · CORPORATE (resmi kurumsal — lacivert / fume / altin) ----------
   Daha dusuk doygunluk, daha kucuk kose yaricaplari, daha sakin golgeler.
   Kurumsal sunum ve raporlama icin tasarlandi.                            ---- */
[data-ev-theme="corporate"] {
  --ev-primary:        #1f3b63;
  --ev-primary-2:      #2f5c93;
  --ev-primary-3:      #5b86bd;
  --ev-accent:         #a8842f;
  --ev-accent-2:       #cfae63;
  --ev-on-primary:     #ffffff;

  --ev-success:        #1c7a52;
  --ev-warning:        #9a6b12;
  --ev-danger:         #a92b3d;
  --ev-info:           #245c8a;

  --ev-bg:             #eef1f6;
  --ev-bg-tint-1:      rgba(31, 59, 99, .10);
  --ev-bg-tint-2:      rgba(168, 132, 47, .07);
  --ev-bg-tint-3:      rgba(47, 92, 147, .08);
  --ev-surface:        #ffffff;
  --ev-surface-2:      #f6f8fb;
  --ev-surface-3:      #eaeef4;
  --ev-surface-glass:  rgba(255, 255, 255, .78);

  --ev-text:           #16202e;
  --ev-text-2:         #3d4b60;
  --ev-text-muted:     #6b7a91;
  --ev-heading:        #0e1826;

  --ev-border:         rgba(14, 24, 38, .11);
  --ev-border-2:       rgba(14, 24, 38, .20);

  --ev-header-from:    #12233b;
  --ev-header-via:     #1f3b63;
  --ev-header-to:      #2f5c93;
  --ev-header-text:    #f2f6fb;
  --ev-header-chip:    rgba(255, 255, 255, .10);
  --ev-header-chip-hi: rgba(255, 255, 255, .22);
  --ev-header-line:    rgba(255, 255, 255, .16);

  --ev-shadow-xs:  0 1px 1px rgba(14, 24, 38, .05);
  --ev-shadow-sm:  0 1px 3px rgba(14, 24, 38, .09), 0 1px 2px rgba(14, 24, 38, .05);
  --ev-shadow-md:  0 6px 16px -8px rgba(14, 24, 38, .20), 0 2px 4px rgba(14, 24, 38, .05);
  --ev-shadow-lg:  0 16px 36px -14px rgba(14, 24, 38, .28), 0 3px 8px rgba(14, 24, 38, .06);
  --ev-shadow-brand: 0 3px 10px -4px color-mix(in srgb, var(--ev-primary) 45%, transparent);

  /* Kurumsal duruş icin daha kucuk kose yaricaplari */
  --ev-r-xs: 4px;
  --ev-r-sm: 6px;
  --ev-r-md: 8px;
  --ev-r-lg: 10px;
  --ev-r-xl: 14px;
  --ev-r-pill: 6px;

  color-scheme: light;
}

/* ==========================================================================
   2. KOPRU — panelin eski degiskenleri + Bootstrap 5 degiskenleri
   (Sayfa ici <style> bloklari bu degiskenleri kullaniyor; boylece
    tek noktadan tum eski stiller yeni palete gecis yapar.)
   ========================================================================== */

:root {
  /* Dolgulu (solid) yardimci zeminler — uzerinde HER ZAMAN beyaz metin
     okunacagi icin paletten koyulastirilarak turetilir. */
  --ev-solid-primary:   color-mix(in srgb, var(--ev-primary) 87%, #0b1020);
  --ev-solid-success:   color-mix(in srgb, var(--ev-success) 74%, #06170f);
  --ev-solid-danger:    color-mix(in srgb, var(--ev-danger) 94%, #19040f);
  --ev-solid-warning:   color-mix(in srgb, var(--ev-warning) 67%, #1d1002);
  --ev-solid-info:      color-mix(in srgb, var(--ev-info) 78%, #02131f);
  --ev-solid-secondary: color-mix(in srgb, var(--ev-text-muted) 76%, #0b1020);
  --ev-solid-dark:      #10142a;

  /* Panelin kendi degiskenleri */
  --primary-color:   var(--ev-primary);
  --secondary-color: var(--ev-primary-2);
  --success-color:   var(--ev-success);
  --danger-color:    var(--ev-danger);
  --light-color:     var(--ev-surface-2);
  --dark-color:      var(--ev-text);

  /* Bootstrap 5 */
  --bs-primary:       var(--ev-primary);
  --bs-secondary:     var(--ev-text-muted);
  --bs-success:       var(--ev-success);
  --bs-info:          var(--ev-info);
  --bs-warning:       var(--ev-warning);
  --bs-danger:        var(--ev-danger);
  --bs-light:         var(--ev-surface-2);
  --bs-dark:          var(--ev-text);

  --bs-body-bg:          transparent;
  --bs-body-color:       var(--ev-text);
  --bs-emphasis-color:   var(--ev-heading);
  --bs-secondary-color:  var(--ev-text-2);
  --bs-tertiary-color:   var(--ev-text-muted);
  --bs-secondary-bg:     var(--ev-surface-2);
  --bs-tertiary-bg:      var(--ev-surface-3);
  --bs-border-color:     var(--ev-border);
  --bs-border-color-translucent: var(--ev-border);
  --bs-border-radius:        var(--ev-r-sm);
  --bs-border-radius-sm:     var(--ev-r-xs);
  --bs-border-radius-lg:     var(--ev-r-md);
  --bs-border-radius-xl:     var(--ev-r-lg);
  --bs-border-radius-2xl:    var(--ev-r-xl);
  --bs-link-color:           var(--ev-primary);
  --bs-link-hover-color:     var(--ev-primary-2);
  --bs-link-color-rgb:       var(--bs-primary-rgb);
  --bs-heading-color:        var(--ev-heading);
  --bs-font-sans-serif:      var(--ev-font);
  --bs-body-font-family:     var(--ev-font);
  --bs-focus-ring-color:     color-mix(in srgb, var(--ev-primary) 25%, transparent);
  --bs-box-shadow:           var(--ev-shadow-md);
  --bs-box-shadow-sm:        var(--ev-shadow-sm);
  --bs-box-shadow-lg:        var(--ev-shadow-lg);
}

/* ==========================================================================
   3. TEMEL — arkaplan, tipografi, kaydirma cubugu
   ========================================================================== */

html { scroll-behavior: smooth; }

body {
  font-family: var(--ev-font) !important;
  color: var(--ev-text) !important;
  background-color: var(--ev-bg) !important;
  background-image:
    radial-gradient(1100px 620px at 8% -8%,  var(--ev-bg-tint-1), transparent 62%),
    radial-gradient(900px 520px at 96% 2%,   var(--ev-bg-tint-2), transparent 60%),
    radial-gradient(1000px 700px at 50% 108%, var(--ev-bg-tint-3), transparent 64%) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: .1px;
  min-height: 100vh;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--ev-heading);
  font-weight: 700;
  letter-spacing: -.015em;
}

a { color: var(--ev-primary); text-decoration: none; transition: color var(--ev-t-fast); }
a:hover { color: var(--ev-primary-2); }

hr, .dropdown-divider {
  border-color: var(--ev-border) !important;
  opacity: 1 !important;
}

code, kbd, pre, samp, .font-monospace { font-family: var(--ev-font-mono) !important; }

::selection { background: color-mix(in srgb, var(--ev-primary) 26%, transparent); color: var(--ev-heading); }

/* Ince, temaya uyumlu kaydirma cubuklari */
* { scrollbar-width: thin; scrollbar-color: var(--ev-border-2) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--ev-primary) 34%, transparent);
  border: 3px solid transparent;
  border-radius: var(--ev-r-pill);
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--ev-primary) 60%, transparent); background-clip: padding-box; }
::-webkit-scrollbar-corner { background: transparent; }

/* Icerik alani
   NOT: burada position/z-index KULLANILMAZ. Bazi sayfalarda .modal
   markup'i <main> icinde duruyor; main'de bir yiginlama baglami (stacking
   context) olusursa Bootstrap'in .modal-backdrop'u (body cocugu, z-index
   1050) modalin uzerine biner. animation-fill-mode da bu yuzden
   'backwards' — animasyon bitince geriye baglam birakmaz. */
main.container,
main.container-fluid { animation: ev-rise .4s var(--ev-ease) backwards; }

@keyframes ev-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   4. ÜST BAR (dashboard-header)
   ========================================================================== */

.dashboard-header {
  position: sticky !important;
  top: 0;
  padding: 14px 0 0 !important;
  border-radius: 0 !important;
  color: var(--ev-header-text) !important;
  background:
    radial-gradient(760px 260px at 12% -60%, rgba(255,255,255,.20), transparent 70%),
    linear-gradient(115deg, var(--ev-header-from) 0%, var(--ev-header-via) 52%, var(--ev-header-to) 100%) !important;
  box-shadow: 0 10px 34px -18px rgba(0,0,0,.65), inset 0 -1px 0 var(--ev-header-line) !important;
  isolation: isolate;
}

/* Alt kenara ince isik cizgisi */
.dashboard-header::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: linear-gradient(90deg,
      transparent,
      color-mix(in srgb, var(--ev-accent-2) 85%, transparent),
      color-mix(in srgb, var(--ev-primary-3) 85%, transparent),
      transparent);
  opacity: .85;
  pointer-events: none;
}

.dashboard-header h1 {
  font-size: 1.55rem !important;
  font-weight: 800 !important;
  letter-spacing: -.02em;
  color: var(--ev-header-text) !important;
  text-shadow: 0 1px 14px rgba(0,0,0,.28);
  margin: 0 !important;
}

.dashboard-header .device-count,
.dashboard-header .subheader {
  font-size: .74rem !important;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .82 !important;
  color: var(--ev-header-text) !important;
  margin-top: 2px !important;
  padding: 3px 10px;
  border-radius: var(--ev-r-pill);
  background: var(--ev-header-chip);
  border: 1px solid var(--ev-header-line);
  white-space: nowrap;
}

/* --- Üst bardaki tum butonlar (menu satiri dahil) --- */
.dashboard-header .btn,
.dashboard-stats .btn,
.dashboard-header .dropdown-toggle {
  border-radius: var(--ev-r-pill) !important;
  border: 1px solid var(--ev-header-line) !important;
  background: var(--ev-header-chip) !important;
  color: var(--ev-header-text) !important;
  font-weight: 600 !important;
  font-size: .795rem !important;
  padding: .38rem .82rem !important;
  letter-spacing: .01em;
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  box-shadow: none !important;
  transition: background var(--ev-t-fast), transform var(--ev-t-fast), border-color var(--ev-t-fast), box-shadow var(--ev-t-fast);
}

.dashboard-header .btn:hover,
.dashboard-stats .btn:hover,
.dashboard-header .dropdown-toggle:hover,
.dashboard-header .btn:focus-visible,
.dashboard-stats .btn:focus-visible {
  background: var(--ev-header-chip-hi) !important;
  border-color: rgba(255,255,255,.42) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px -8px rgba(0,0,0,.6) !important;
}

.dashboard-header .btn:active,
.dashboard-stats .btn:active { transform: translateY(0) scale(.985); }

.dashboard-header .btn i,
.dashboard-stats .btn i { opacity: .92; }

/* Aktif sayfa vurgusu */
.dashboard-stats .btn.active,
.dashboard-stats .btn[aria-current="page"] {
  background: rgba(255,255,255,.94) !important;
  color: var(--ev-header-from) !important;
  border-color: transparent !important;
  box-shadow: 0 6px 18px -8px rgba(0,0,0,.55) !important;
}

.dashboard-stats {
  gap: 6px;
  padding-bottom: 12px !important;
  margin-top: 12px !important;
}
.dashboard-stats .btn { margin: 0 !important; }

/* Kullanici menusu */
.user-info .dropdown-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  padding: .34rem .5rem .34rem .38rem !important;
  background: var(--ev-header-chip) !important;
}
.user-info .dropdown-toggle > i,
.user-info .dropdown-toggle .fa-user {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ev-accent-2), var(--ev-primary-3));
  color: #0b1020;
  font-size: .72rem;
}

/* Üst bardaki arama kutusu */
.gsm-search-form { position: relative; }
.gsm-search-form input,
.dashboard-header input.form-control {
  background: rgba(255,255,255,.13) !important;
  border: 1px solid var(--ev-header-line) !important;
  border-radius: var(--ev-r-pill) !important;
  color: #fff !important;
  font-size: .8rem !important;
  padding: .38rem .9rem !important;
  min-width: 190px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: background var(--ev-t-fast), box-shadow var(--ev-t-fast), border-color var(--ev-t-fast);
}
.gsm-search-form input::placeholder,
.dashboard-header input.form-control::placeholder { color: rgba(255,255,255,.62) !important; }
.gsm-search-form input:focus,
.dashboard-header input.form-control:focus {
  background: rgba(255,255,255,.22) !important;
  border-color: rgba(255,255,255,.55) !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.16) !important;
  outline: 0;
}

/* Üst bardaki rozetler */
.dashboard-header .badge {
  border-radius: var(--ev-r-pill) !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
  box-shadow: 0 2px 8px -3px rgba(0,0,0,.5);
}

/* ==========================================================================
   5. YÜZEYLER — kartlar, paneller, konteynerler
   ========================================================================== */

.card,
.modern-card,
.table-container,
.search-container,
.agency-filter-container,
.stat-card,
.stats-mini,
.agency-card,
.group-card,
.target-card,
.device-card,
.sim-card,
.bot-settings-card,
.sound-controls,
.controls,
.pagination-wrapper,
.page-header {
  background: var(--ev-surface) !important;
  color: var(--ev-text);
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-lg) !important;
  box-shadow: var(--ev-shadow-sm) !important;
  transition: transform var(--ev-t), box-shadow var(--ev-t), border-color var(--ev-t);
}

/* Hafif "kaldirma" etkisi olan kartlar */
.card:hover,
.modern-card:hover,
.stat-card:hover,
.stats-mini:hover,
.agency-card:hover,
.group-card:hover,
.target-card:hover,
.device-card:hover,
.sim-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--ev-shadow-md) !important;
  border-color: color-mix(in srgb, var(--ev-primary) 26%, var(--ev-border)) !important;
}

/* Kart basliklari */
.card-header,
.modern-card-header,
.group-header,
.sim-card-header,
.device-header,
.agency-accordion-header,
.country-card-header {
  background:
    linear-gradient(135deg,
      color-mix(in srgb, var(--ev-primary) 13%, var(--ev-surface)),
      color-mix(in srgb, var(--ev-accent) 9%, var(--ev-surface))) !important;
  color: var(--ev-heading) !important;
  border-bottom: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-lg) var(--ev-r-lg) 0 0 !important;
  font-weight: 700;
  letter-spacing: -.01em;
  padding: .85rem 1.15rem !important;
}

.card-footer {
  background: var(--ev-surface-2) !important;
  border-top: 1px solid var(--ev-border) !important;
  border-radius: 0 0 var(--ev-r-lg) var(--ev-r-lg) !important;
  color: var(--ev-text-2);
}

.card-body,
.modern-card-body,
.group-body,
.device-body,
.sim-card-details { color: var(--ev-text); }

.card-title, .modern-card-title {
  color: var(--ev-heading) !important;
  font-weight: 700 !important;
  letter-spacing: -.015em;
  margin-bottom: .2rem;
}

/* Sayfa basligi bloklari */
.page-header {
  padding: 1.05rem 1.3rem !important;
  margin-bottom: 1.15rem !important;
  position: relative;
  overflow: hidden;
}
.page-header::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, var(--ev-primary), var(--ev-accent));
}
.page-title {
  color: var(--ev-heading) !important;
  font-weight: 800 !important;
  font-size: 1.32rem !important;
  letter-spacing: -.025em;
  margin-bottom: .12rem !important;
}
.page-title i, .modern-card-title i, .card-header i {
  color: var(--ev-primary) !important;
  margin-right: .45rem;
}
.page-subtitle { color: var(--ev-text-muted) !important; font-size: .84rem !important; }

/* ==========================================================================
   6. TABLOLAR
   ========================================================================== */

.table-responsive,
.table-container {
  border-radius: var(--ev-r-lg) !important;
  overflow: auto;
}

.table,
.modern-table,
.entries-table,
table.dataTable {
  --bs-table-color: var(--ev-text);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--ev-border);
  --bs-table-striped-color: var(--ev-text);
  --bs-table-striped-bg: color-mix(in srgb, var(--ev-primary) 4%, transparent);
  --bs-table-hover-color: var(--ev-text);
  --bs-table-hover-bg: color-mix(in srgb, var(--ev-primary) 8%, transparent);
  --bs-table-active-color: var(--ev-text);
  --bs-table-active-bg: color-mix(in srgb, var(--ev-primary) 11%, transparent);
  color: var(--ev-text) !important;
  background: transparent !important;
  border-color: var(--ev-border) !important;
  margin-bottom: 0;
  font-size: .855rem;
  border-collapse: separate !important;
  border-spacing: 0;
}

.table > :not(caption) > * > *,
.modern-table td, .modern-table th,
.entries-table td, .entries-table th {
  background: transparent;
  border-bottom: 1px solid var(--ev-border) !important;
  border-top: 0 !important;
  padding: .62rem .78rem !important;
  vertical-align: middle;
  color: inherit;
  box-shadow: none !important;
}

.table thead th,
.modern-table thead th,
.entries-table thead th,
table.dataTable thead th {
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--ev-primary) 14%, var(--ev-surface)),
      color-mix(in srgb, var(--ev-primary) 8%, var(--ev-surface))) !important;
  color: var(--ev-heading) !important;
  font-size: .705rem !important;
  font-weight: 800 !important;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-bottom: 1px solid color-mix(in srgb, var(--ev-primary) 24%, var(--ev-border)) !important;
  white-space: nowrap;
}

/* Yapiskan baslik yalnizca kendi kaydirma kutusu olan tablolarda —
   sayfa geneli kaydirmada ust bar ile cakismasin diye. */
.table-responsive .table thead th,
.table-container .table thead th,
.table-responsive .modern-table thead th,
.table-container .modern-table thead th,
.dataTables_scrollHead th {
  position: sticky;
  top: 0;
  z-index: 3;
}
.table thead th:first-child { border-top-left-radius: var(--ev-r-md); }
.table thead th:last-child  { border-top-right-radius: var(--ev-r-md); }

.table tbody tr,
.modern-table tbody tr,
.entries-table tbody tr,
.payment-row, .entry-row, .compact-row {
  transition: background var(--ev-t-fast), box-shadow var(--ev-t-fast);
}
.table tbody tr:hover,
.modern-table tbody tr:hover,
.entries-table tbody tr:hover,
.payment-row:hover, .entry-row:hover, .compact-row:hover {
  background: color-mix(in srgb, var(--ev-primary) 7%, transparent) !important;
  box-shadow: inset 3px 0 0 var(--ev-primary);
}
.table tbody tr:last-child > * { border-bottom: 0 !important; }

.table > tbody > tr.child-row > td,
.family-members { background: color-mix(in srgb, var(--ev-accent) 6%, var(--ev-surface-2)) !important; }

/* Bootstrap tablo renk yardimcilari — temaya uyumlu yumusak tonlar */
.table-success  > *, .table > tbody > tr.table-success  > * { background: color-mix(in srgb, var(--ev-success) 14%, transparent) !important; color: var(--ev-text) !important; }
.table-danger   > *, .table > tbody > tr.table-danger   > * { background: color-mix(in srgb, var(--ev-danger)  14%, transparent) !important; color: var(--ev-text) !important; }
.table-warning  > *, .table > tbody > tr.table-warning  > * { background: color-mix(in srgb, var(--ev-warning) 16%, transparent) !important; color: var(--ev-text) !important; }
.table-info     > *, .table > tbody > tr.table-info     > * { background: color-mix(in srgb, var(--ev-info)    13%, transparent) !important; color: var(--ev-text) !important; }
.table-primary  > *, .table > tbody > tr.table-primary  > * { background: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important; color: var(--ev-text) !important; }
.table-light    > *, .table > tbody > tr.table-light    > * { background: var(--ev-surface-2) !important; color: var(--ev-text) !important; }
.table-active   > * { background: color-mix(in srgb, var(--ev-primary) 11%, transparent) !important; }

/* Tablo icindeki toplam / ozet satiri */
.table tfoot td, .table tfoot th,
.table tr.total-row td {
  background: color-mix(in srgb, var(--ev-primary) 9%, var(--ev-surface-2)) !important;
  font-weight: 800 !important;
  color: var(--ev-heading) !important;
  border-top: 1px solid var(--ev-border-2) !important;
}

/* ==========================================================================
   7. BUTONLAR
   ========================================================================== */

.btn,
.modern-btn,
.btn-modern,
.pagination-btn,
.edit-btn,
.send-to-bot-btn,
.family-toggle {
  --bs-btn-focus-box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 22%, transparent);
  border-radius: var(--ev-r-sm) !important;
  font-weight: 600 !important;
  letter-spacing: .005em;
  border-width: 1px !important;
  transition: transform var(--ev-t-fast), box-shadow var(--ev-t-fast),
              background-color var(--ev-t-fast), border-color var(--ev-t-fast), color var(--ev-t-fast);
  will-change: transform;
}

.btn:not(.dashboard-stats .btn):not(.dashboard-header .btn):hover,
.modern-btn:hover, .btn-modern:hover, .edit-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--ev-shadow-sm);
}
.btn:active { transform: translateY(0) scale(.98); }
.btn:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 26%, transparent) !important;
}
.btn.btn-sm, .btn-sm { border-radius: var(--ev-r-xs) !important; font-size: .775rem !important; padding: .3rem .68rem !important; }
.btn.btn-lg { border-radius: var(--ev-r-md) !important; }

/* --- Dolgulu (solid) varyantlar: yumusak degrade + marka golgesi --- */
.btn-primary, .modern-btn-primary, .send-to-bot-btn {
  background-image: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  background-color: var(--ev-primary) !important;
  border-color: transparent !important;
  color: var(--ev-on-primary) !important;
  box-shadow: var(--ev-shadow-brand);
}
.btn-primary:hover, .modern-btn-primary:hover, .send-to-bot-btn:hover {
  filter: brightness(1.07) saturate(1.05);
  color: #fff !important;
}

.btn-success {
  background-image: linear-gradient(135deg, var(--ev-success), color-mix(in srgb, var(--ev-success) 62%, var(--ev-accent))) !important;
  background-color: var(--ev-success) !important;
  border-color: transparent !important; color: #fff !important;
  box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--ev-success) 80%, transparent);
}
.btn-danger, .modern-btn-danger {
  background-image: linear-gradient(135deg, var(--ev-danger), color-mix(in srgb, var(--ev-danger) 60%, #f97316)) !important;
  background-color: var(--ev-danger) !important;
  border-color: transparent !important; color: #fff !important;
  box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--ev-danger) 80%, transparent);
}
.btn-warning {
  background-image: linear-gradient(135deg, var(--ev-warning), color-mix(in srgb, var(--ev-warning) 55%, var(--ev-danger))) !important;
  background-color: var(--ev-warning) !important;
  border-color: transparent !important; color: #23180a !important;
  box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--ev-warning) 80%, transparent);
}
.btn-info {
  background-image: linear-gradient(135deg, var(--ev-info), var(--ev-accent-2)) !important;
  background-color: var(--ev-info) !important;
  border-color: transparent !important; color: #06212e !important;
  box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--ev-info) 80%, transparent);
}
.btn-secondary, .modern-btn-secondary {
  background-image: none !important;
  background-color: var(--ev-surface-3) !important;
  border-color: var(--ev-border-2) !important;
  color: var(--ev-text) !important;
  box-shadow: none !important;
}
.btn-secondary:hover, .modern-btn-secondary:hover {
  background-color: color-mix(in srgb, var(--ev-primary) 12%, var(--ev-surface-3)) !important;
  color: var(--ev-heading) !important;
}
.btn-dark {
  background-image: linear-gradient(135deg, var(--ev-heading), color-mix(in srgb, var(--ev-heading) 70%, var(--ev-primary))) !important;
  border-color: transparent !important; color: #fff !important;
}

/* --- Icerik alanindaki .btn-light (üst bardaki degil) --- */
main .btn-light, .card .btn-light, .modal .btn-light {
  background: var(--ev-surface-2) !important;
  border-color: var(--ev-border) !important;
  color: var(--ev-text) !important;
}
main .btn-light:hover, .card .btn-light:hover, .modal .btn-light:hover {
  background: color-mix(in srgb, var(--ev-primary) 10%, var(--ev-surface-2)) !important;
  border-color: color-mix(in srgb, var(--ev-primary) 30%, var(--ev-border)) !important;
  color: var(--ev-heading) !important;
}

/* --- Cerceve (outline) varyantlari --- */
.btn-outline-primary   { color: var(--ev-primary) !important; border-color: color-mix(in srgb, var(--ev-primary) 42%, transparent) !important; background: color-mix(in srgb, var(--ev-primary) 6%, transparent) !important; }
.btn-outline-primary:hover   { background: var(--ev-primary) !important; border-color: var(--ev-primary) !important; color: var(--ev-on-primary) !important; }
.btn-outline-success   { color: var(--ev-success) !important; border-color: color-mix(in srgb, var(--ev-success) 42%, transparent) !important; background: color-mix(in srgb, var(--ev-success) 6%, transparent) !important; }
.btn-outline-success:hover   { background: var(--ev-success) !important; border-color: var(--ev-success) !important; color: #fff !important; }
.btn-outline-danger    { color: var(--ev-danger) !important; border-color: color-mix(in srgb, var(--ev-danger) 42%, transparent) !important; background: color-mix(in srgb, var(--ev-danger) 6%, transparent) !important; }
.btn-outline-danger:hover    { background: var(--ev-danger) !important; border-color: var(--ev-danger) !important; color: #fff !important; }
.btn-outline-warning   { color: color-mix(in srgb, var(--ev-warning) 58%, var(--ev-text)) !important; border-color: color-mix(in srgb, var(--ev-warning) 45%, transparent) !important; background: color-mix(in srgb, var(--ev-warning) 8%, transparent) !important; }
.btn-outline-warning:hover   { background: var(--ev-warning) !important; border-color: var(--ev-warning) !important; color: #23180a !important; }
.btn-outline-info      { color: var(--ev-info) !important; border-color: color-mix(in srgb, var(--ev-info) 42%, transparent) !important; background: color-mix(in srgb, var(--ev-info) 6%, transparent) !important; }
.btn-outline-info:hover      { background: var(--ev-info) !important; border-color: var(--ev-info) !important; color: #06212e !important; }
.btn-outline-secondary { color: var(--ev-text-2) !important; border-color: var(--ev-border-2) !important; background: transparent !important; }
.btn-outline-secondary:hover { background: var(--ev-surface-3) !important; border-color: var(--ev-border-2) !important; color: var(--ev-heading) !important; }
.btn-outline-dark      { color: var(--ev-text) !important; border-color: var(--ev-border-2) !important; }
.btn-outline-dark:hover      { background: var(--ev-heading) !important; color: var(--ev-surface) !important; border-color: var(--ev-heading) !important; }
.btn-outline-light     { color: var(--ev-text-2) !important; border-color: var(--ev-border) !important; }

.btn-link { color: var(--ev-primary) !important; text-decoration: none !important; font-weight: 600 !important; }
.btn-link:hover { color: var(--ev-primary-2) !important; text-decoration: underline !important; }

.btn:disabled, .btn.disabled, .pagination-btn.disabled { opacity: .45 !important; box-shadow: none !important; transform: none !important; filter: none !important; }

.btn-group > .btn:not(:first-child), .btn-group > .btn:not(:last-child) { border-radius: var(--ev-r-xs) !important; }
.btn-group > .btn:first-child { border-top-left-radius: var(--ev-r-sm) !important; border-bottom-left-radius: var(--ev-r-sm) !important; }
.btn-group > .btn:last-child  { border-top-right-radius: var(--ev-r-sm) !important; border-bottom-right-radius: var(--ev-r-sm) !important; }

/* Ikon-butonlar (tablolardaki islem butonlari) */
main .btn.btn-sm > i:only-child { font-size: .8rem; }

/* ==========================================================================
   8. ROZETLER (BADGE)
   ========================================================================== */

.badge,
.badge-modern,
.modern-badge,
.status-badge,
.priority-badge,
.filter-badge,
.default-badge,
.device-tag,
.click-count-badge,
.last-notification-badge {
  border-radius: var(--ev-r-pill) !important;
  font-weight: 700 !important;
  font-size: .695rem !important;
  letter-spacing: .025em;
  padding: .32em .72em !important;
  border: 1px solid transparent;
  line-height: 1.35;
  vertical-align: middle;
}

/* Yumusak tonlu rozet stili — modern ve okunakli */
main .badge.bg-primary,   main .badge-modern.bg-primary,   .modal .badge.bg-primary   { background: color-mix(in srgb, var(--ev-primary) 15%, transparent) !important; color: color-mix(in srgb, var(--ev-primary) 72%, var(--ev-text)) !important; border-color: color-mix(in srgb, var(--ev-primary) 30%, transparent); }
main .badge.bg-success,   main .badge-modern.bg-success,   .modal .badge.bg-success   { background: color-mix(in srgb, var(--ev-success) 17%, transparent) !important; color: color-mix(in srgb, var(--ev-success) 72%, var(--ev-text)) !important; border-color: color-mix(in srgb, var(--ev-success) 32%, transparent); }
main .badge.bg-danger,    main .badge-modern.bg-danger,    .modal .badge.bg-danger    { background: color-mix(in srgb, var(--ev-danger) 16%, transparent) !important;  color: color-mix(in srgb, var(--ev-danger) 72%, var(--ev-text)) !important;  border-color: color-mix(in srgb, var(--ev-danger) 32%, transparent); }
main .badge.bg-warning,   main .badge-modern.bg-warning,   .modal .badge.bg-warning   { background: color-mix(in srgb, var(--ev-warning) 20%, transparent) !important; color: color-mix(in srgb, var(--ev-warning) 56%, var(--ev-text)) !important; border-color: color-mix(in srgb, var(--ev-warning) 34%, transparent); }
main .badge.bg-info,      main .badge-modern.bg-info,      .modal .badge.bg-info      { background: color-mix(in srgb, var(--ev-info) 16%, transparent) !important;    color: color-mix(in srgb, var(--ev-info) 72%, var(--ev-text)) !important;    border-color: color-mix(in srgb, var(--ev-info) 32%, transparent); }
main .badge.bg-secondary, main .badge-modern.bg-secondary, .modal .badge.bg-secondary { background: var(--ev-surface-3) !important; color: var(--ev-text-2) !important; border-color: var(--ev-border-2); }
main .badge.bg-light      { background: var(--ev-surface-3) !important; color: var(--ev-text-2) !important; }
main .badge.bg-dark       { background: var(--ev-solid-dark) !important; color: #fff !important; }

/* Durum rozetleri */
.status-pending,  .badge-warning { background: color-mix(in srgb, var(--ev-warning) 18%, transparent) !important; color: color-mix(in srgb, var(--ev-warning) 56%, var(--ev-text)) !important; }
.status-approved, .badge-success { background: color-mix(in srgb, var(--ev-success) 17%, transparent) !important; color: color-mix(in srgb, var(--ev-success) 70%, var(--ev-text)) !important; }
.status-rejected, .badge-danger  { background: color-mix(in srgb, var(--ev-danger) 16%, transparent) !important;  color: color-mix(in srgb, var(--ev-danger) 70%, var(--ev-text)) !important; }
.badge-info      { background: color-mix(in srgb, var(--ev-info) 16%, transparent) !important;    color: color-mix(in srgb, var(--ev-info) 72%, var(--ev-text)) !important; }
.badge-secondary { background: var(--ev-surface-3) !important; color: var(--ev-text-2) !important; }

/* Filtre rozetleri — tiklanabilir cip */
.filter-badge {
  cursor: pointer;
  background: var(--ev-surface-2) !important;
  color: var(--ev-text-2) !important;
  border: 1px solid var(--ev-border) !important;
  padding: .38em .9em !important;
  transition: all var(--ev-t-fast);
}
.filter-badge:hover {
  background: color-mix(in srgb, var(--ev-primary) 12%, var(--ev-surface-2)) !important;
  color: var(--ev-primary) !important;
  border-color: color-mix(in srgb, var(--ev-primary) 34%, transparent) !important;
  transform: translateY(-1px);
}
.filter-badge.active {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
  border-color: transparent !important;
  box-shadow: var(--ev-shadow-brand);
}

/* ID / kod tarzi kucuk etiketler */
.payment-id, .device-id, .search-index {
  font-family: var(--ev-font-mono) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  color: var(--ev-primary) !important;
  background: color-mix(in srgb, var(--ev-primary) 10%, transparent) !important;
  border-radius: var(--ev-r-xs) !important;
  padding: .16em .48em !important;
  letter-spacing: .01em;
}

/* ==========================================================================
   9. FORMLAR
   ========================================================================== */

.form-control,
.form-select,
.modern-select,
.edit-input,
.search-box input,
.form-control-sm,
textarea.form-control,
input[type="text"].form-control,
input[type="search"].form-control,
input[type="number"].form-control,
input[type="date"].form-control,
input[type="email"].form-control,
.dataTables_filter input,
.dataTables_length select {
  background-color: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border: 1px solid var(--ev-border-2) !important;
  border-radius: var(--ev-r-sm) !important;
  box-shadow: var(--ev-shadow-xs) !important;
  transition: border-color var(--ev-t-fast), box-shadow var(--ev-t-fast), background-color var(--ev-t-fast);
}

.form-control::placeholder, .edit-input::placeholder {
  color: var(--ev-text-muted) !important;
  opacity: .85;
}

.form-control:focus,
.form-select:focus,
.modern-select:focus,
.edit-input:focus,
.search-box input:focus,
.dataTables_filter input:focus {
  border-color: var(--ev-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 20%, transparent) !important;
  outline: 0 !important;
}

.form-control:disabled, .form-control[readonly], .form-select:disabled {
  background-color: var(--ev-surface-3) !important;
  color: var(--ev-text-muted) !important;
  opacity: 1;
}

.form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23808aa5' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right .7rem center !important;
  background-size: 15px 12px !important;
  padding-right: 2.1rem !important;
}

.form-label,
label:not(.form-check-label):not(.btn):not([class*="btn-"]):not(.form-floating > label) {
  color: var(--ev-text-2) !important;
  font-weight: 600 !important;
  font-size: .795rem !important;
  letter-spacing: .012em;
  margin-bottom: .3rem;
}

/* Bootstrap "floating label" ve buton gorunumlu <label>'lar kendi
   davranislarini korumali — aksi halde hizalama/olcek bozuluyor. */
.form-floating > label {
  color: var(--ev-text-muted) !important;
  font-weight: 400 !important;
  font-size: 1rem !important;
  letter-spacing: normal;
  margin-bottom: 0 !important;
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select ~ label { color: var(--ev-primary) !important; }
label.btn, label[class*="btn-"] {
  font-size: .8rem !important;
  font-weight: 600 !important;
  margin-bottom: 0 !important;
  letter-spacing: .005em;
}
.form-text { color: var(--ev-text-muted) !important; }

.input-group-text {
  background: var(--ev-surface-3) !important;
  border: 1px solid var(--ev-border-2) !important;
  color: var(--ev-text-2) !important;
  border-radius: var(--ev-r-sm) !important;
}
.input-group > .form-control:not(:last-child), .input-group > .form-select:not(:last-child) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.input-group > :not(:first-child) { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }

.form-check-input {
  border-color: var(--ev-border-2) !important;
  background-color: var(--ev-surface) !important;
  cursor: pointer;
  transition: background-color var(--ev-t-fast), border-color var(--ev-t-fast);
}
.form-check-input:checked {
  background-color: var(--ev-primary) !important;
  border-color: var(--ev-primary) !important;
}
.form-check-input:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 20%, transparent) !important; border-color: var(--ev-primary) !important; }
.form-check-label { color: var(--ev-text) !important; }

input[type="range"].form-range::-webkit-slider-thumb { background: var(--ev-primary) !important; }
input[type="range"].form-range::-webkit-slider-runnable-track { background: var(--ev-surface-3) !important; }

/* Satir ici duzenlenebilir alanlar */
.editable-field {
  border-radius: var(--ev-r-xs) !important;
  transition: background var(--ev-t-fast), box-shadow var(--ev-t-fast);
  cursor: pointer;
}
.editable-field:hover {
  background: color-mix(in srgb, var(--ev-primary) 11%, transparent) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ev-primary) 28%, transparent);
}
.date-placeholder { color: var(--ev-text-muted) !important; font-style: italic; }

/* Arama kutusu (icon'lu) */
.search-box { position: relative; }
.search-box i { color: var(--ev-text-muted) !important; }
.search-box input { padding-left: 2.35rem !important; }

/* ==========================================================================
   10. AÇILIR MENÜLER (DROPDOWN)
   ========================================================================== */

.dropdown-menu {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  padding: 6px !important;
  min-width: 205px;
  color: var(--ev-text) !important;
  animation: ev-pop .16s var(--ev-ease) both;
}
@keyframes ev-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }

.dropdown-item {
  border-radius: var(--ev-r-xs) !important;
  color: var(--ev-text) !important;
  font-size: .84rem !important;
  font-weight: 500;
  padding: .48rem .68rem !important;
  transition: background var(--ev-t-fast), color var(--ev-t-fast), transform var(--ev-t-fast);
}
.dropdown-item i { width: 18px; text-align: center; color: var(--ev-text-muted); transition: color var(--ev-t-fast); }
.dropdown-item:hover, .dropdown-item:focus {
  background: color-mix(in srgb, var(--ev-primary) 12%, transparent) !important;
  color: var(--ev-primary) !important;
  transform: translateX(2px);
}
.dropdown-item:hover i { color: var(--ev-primary); }
.dropdown-item.active, .dropdown-item:active {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
}
.dropdown-item.active i { color: inherit; }
.dropdown-header { color: var(--ev-text-muted) !important; font-size: .68rem !important; font-weight: 800 !important; text-transform: uppercase; letter-spacing: .08em; padding: .5rem .68rem .3rem !important; }
.dropdown-toggle::after { opacity: .6; margin-left: .42em; }

/* ==========================================================================
   11. MODALLAR & OFFCANVAS
   ========================================================================== */

.modal-backdrop.show { background: rgba(10, 12, 26, .55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 1 !important; }

.modal-content {
  background: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-xl) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  /* overflow:hidden KULLANILMAZ — modal icindeki select2/flatpickr/autocomplete
     acilir kutularini kirpardi. Koseler basliga/altliga ayrica veriliyor. */
}
.modal-header {
  background: linear-gradient(135deg,
      color-mix(in srgb, var(--ev-primary) 14%, var(--ev-surface)),
      color-mix(in srgb, var(--ev-accent) 10%, var(--ev-surface))) !important;
  border-bottom: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-xl) var(--ev-r-xl) 0 0 !important;
  padding: 1rem 1.35rem !important;
}
.modal-title { color: var(--ev-heading) !important; font-weight: 700 !important; letter-spacing: -.015em; }
.modal-body { color: var(--ev-text) !important; padding: 1.25rem 1.35rem !important; }
.modal-footer {
  background: var(--ev-surface-2) !important;
  border-top: 1px solid var(--ev-border) !important;
  border-radius: 0 0 var(--ev-r-xl) var(--ev-r-xl) !important;
  padding: .85rem 1.35rem !important;
}

/* Modal icindeki acilir kutular her zaman en ustte */
.select2-container--open { z-index: 1075 !important; }
.flatpickr-calendar, .datepicker-dropdown { z-index: 1080 !important; }
.swal2-container { z-index: 1090 !important; }
.tooltip, .popover { z-index: 1085 !important; }
.btn-close {
  border-radius: 50% !important;
  opacity: .55;
  transition: opacity var(--ev-t-fast), background var(--ev-t-fast), transform var(--ev-t-fast);
}
.btn-close:hover { opacity: 1; background-color: color-mix(in srgb, var(--ev-danger) 16%, transparent); transform: rotate(90deg); }

.offcanvas { background: var(--ev-surface) !important; color: var(--ev-text) !important; border-color: var(--ev-border) !important; }

/* ==========================================================================
   12. SAYFALAMA
   ========================================================================== */

.pagination { --bs-pagination-border-radius: var(--ev-r-sm); gap: 4px; }
.page-link, .pagination-btn {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  color: var(--ev-text-2) !important;
  border-radius: var(--ev-r-sm) !important;
  font-weight: 600 !important;
  font-size: .8rem !important;
  min-width: 34px;
  text-align: center;
  transition: all var(--ev-t-fast);
}
.page-link:hover, .pagination-btn:hover:not(.disabled) {
  background: color-mix(in srgb, var(--ev-primary) 11%, var(--ev-surface)) !important;
  border-color: color-mix(in srgb, var(--ev-primary) 32%, transparent) !important;
  color: var(--ev-primary) !important;
  transform: translateY(-1px);
}
.page-item.active .page-link, .pagination-btn.active {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  border-color: transparent !important;
  color: var(--ev-on-primary) !important;
  box-shadow: var(--ev-shadow-brand);
}
.page-item.disabled .page-link, .pagination-btn.disabled { background: var(--ev-surface-2) !important; color: var(--ev-text-muted) !important; opacity: .6; }
.pagination-wrapper { padding: .7rem .9rem !important; box-shadow: none !important; background: transparent !important; border: 0 !important; }

/* ==========================================================================
   13. SEKMELER, ALERTLER, PROGRESS
   ========================================================================== */

.nav-tabs { border-bottom: 1px solid var(--ev-border) !important; gap: 4px; }
.nav-tabs .nav-link {
  border: 0 !important;
  border-radius: var(--ev-r-sm) var(--ev-r-sm) 0 0 !important;
  color: var(--ev-text-muted) !important;
  font-weight: 600 !important;
  padding: .55rem 1rem !important;
  position: relative;
  transition: color var(--ev-t-fast), background var(--ev-t-fast);
}
.nav-tabs .nav-link:hover { color: var(--ev-primary) !important; background: color-mix(in srgb, var(--ev-primary) 8%, transparent) !important; }
.nav-tabs .nav-link.active {
  color: var(--ev-primary) !important;
  background: color-mix(in srgb, var(--ev-primary) 11%, transparent) !important;
}
.nav-tabs .nav-link.active::after {
  content: ""; position: absolute; left: .6rem; right: .6rem; bottom: -1px; height: 2.5px;
  border-radius: 3px; background: linear-gradient(90deg, var(--ev-primary), var(--ev-accent));
}
.nav-pills .nav-link { border-radius: var(--ev-r-pill) !important; color: var(--ev-text-2) !important; font-weight: 600 !important; }
.nav-pills .nav-link.active { background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important; color: var(--ev-on-primary) !important; }

.alert {
  border-radius: var(--ev-r-md) !important;
  border: 1px solid var(--ev-border) !important;
  border-left-width: 3px !important;
  box-shadow: var(--ev-shadow-xs) !important;
  color: var(--ev-text) !important;
  font-size: .86rem;
}
.alert-primary { background: color-mix(in srgb, var(--ev-primary) 10%, var(--ev-surface)) !important; border-left-color: var(--ev-primary) !important; }
.alert-success { background: color-mix(in srgb, var(--ev-success) 11%, var(--ev-surface)) !important; border-left-color: var(--ev-success) !important; }
.alert-danger  { background: color-mix(in srgb, var(--ev-danger) 10%, var(--ev-surface)) !important;  border-left-color: var(--ev-danger) !important; }
.alert-warning { background: color-mix(in srgb, var(--ev-warning) 13%, var(--ev-surface)) !important; border-left-color: var(--ev-warning) !important; }
.alert-info    { background: color-mix(in srgb, var(--ev-info) 10%, var(--ev-surface)) !important;    border-left-color: var(--ev-info) !important; }
.alert .alert-link { color: var(--ev-primary) !important; }
.changes-warning { background: color-mix(in srgb, var(--ev-warning) 13%, var(--ev-surface)) !important; border-left: 3px solid var(--ev-warning) !important; border-radius: var(--ev-r-md) !important; color: var(--ev-text) !important; }

.progress {
  background: var(--ev-surface-3) !important;
  border-radius: var(--ev-r-pill) !important;
  height: 8px;
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.06);
}
.progress-bar {
  background: linear-gradient(90deg, var(--ev-primary), var(--ev-accent)) !important;
  border-radius: var(--ev-r-pill) !important;
  transition: width .5s var(--ev-ease);
}
.progress-bar.bg-success { background: linear-gradient(90deg, var(--ev-success), color-mix(in srgb, var(--ev-success) 55%, var(--ev-accent))) !important; }
.progress-bar.bg-danger  { background: linear-gradient(90deg, var(--ev-danger), color-mix(in srgb, var(--ev-danger) 55%, var(--ev-warning))) !important; }
.progress-bar.bg-warning { background: linear-gradient(90deg, var(--ev-warning), color-mix(in srgb, var(--ev-warning) 55%, var(--ev-danger))) !important; }

/* ==========================================================================
   14. DASHBOARD — cihaz kartlari
   ========================================================================== */

.device-grid { gap: 14px; }

.device-card {
  overflow: hidden;
  position: relative;
  padding: 0 !important;
}
.device-card::before {
  content: "";
  position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--ev-primary), var(--ev-accent));
  opacity: .9;
}
.device-card.active-device::before   { background: linear-gradient(90deg, var(--ev-success), var(--ev-accent-2)); }
.device-card.inactive-device::before { background: linear-gradient(90deg, var(--ev-danger), var(--ev-warning)); }
.device-card.active-device   { border-color: color-mix(in srgb, var(--ev-success) 30%, var(--ev-border)) !important; }
.device-card.inactive-device { border-color: color-mix(in srgb, var(--ev-danger) 26%, var(--ev-border)) !important; }

.device-header {
  padding: .7rem .9rem !important;
  font-weight: 700;
  font-size: .84rem;
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  border-radius: 0 !important;
}
.device-header.active-header   { background: color-mix(in srgb, var(--ev-success) 12%, var(--ev-surface)) !important; color: var(--ev-heading) !important; }
.device-header.inactive-header { background: color-mix(in srgb, var(--ev-danger) 10%, var(--ev-surface)) !important;  color: var(--ev-heading) !important; }

.device-body { padding: .75rem .9rem .9rem !important; font-size: .78rem; color: var(--ev-text-2) !important; }

.device-status { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: 0 0 auto; }
.device-status.active   { background: var(--ev-success) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-success) 24%, transparent); animation: ev-pulse 2.2s var(--ev-ease) infinite; }
.device-status.inactive { background: var(--ev-danger) !important;  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-danger) 20%, transparent); }
@keyframes ev-pulse { 0%,100% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-success) 24%, transparent); } 50% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--ev-success) 6%, transparent); } }

.battery-indicator {
  border-radius: var(--ev-r-pill) !important;
  font-size: .66rem !important;
  font-weight: 800 !important;
  padding: .18em .6em !important;
  letter-spacing: .02em;
}
.battery-high   { background: color-mix(in srgb, var(--ev-success) 17%, transparent) !important; color: color-mix(in srgb, var(--ev-success) 70%, var(--ev-text)) !important; }
.battery-medium { background: color-mix(in srgb, var(--ev-warning) 20%, transparent) !important; color: color-mix(in srgb, var(--ev-warning) 56%, var(--ev-text)) !important; }
.battery-low    { background: color-mix(in srgb, var(--ev-danger) 17%, transparent) !important;  color: color-mix(in srgb, var(--ev-danger) 70%, var(--ev-text)) !important; }

.sim-card {
  border-radius: var(--ev-r-md) !important;
  background: var(--ev-surface-2) !important;
  box-shadow: none !important;
}
.sim-card-header { font-size: .74rem !important; border-radius: var(--ev-r-md) var(--ev-r-md) 0 0 !important; padding: .5rem .7rem !important; }
.sim-card-details { padding: .55rem .7rem !important; font-family: var(--ev-font-mono); font-size: .68rem; color: var(--ev-text-muted) !important; }

.controls, .search-container, .agency-filter-container, .filter-controls, .sound-controls {
  padding: .9rem 1.05rem !important;
  margin-bottom: 1.05rem !important;
  box-shadow: var(--ev-shadow-sm) !important;
}

/* Mini istatistik kutulari */
.stat-card {
  padding: .95rem 1.05rem !important;
  position: relative;
  overflow: hidden;
}

/* Kompakt sayac cipleri (Odemeler basligi) */
.stats-mini {
  display: inline-flex !important;
  align-items: baseline;
  gap: .38rem;
  padding: .34rem .72rem !important;
  border-radius: var(--ev-r-pill) !important;
  box-shadow: none !important;
  background: var(--ev-surface) !important;
}
.stats-mini .stat-number { font-size: 1.02rem !important; }
.stats-mini .stat-label  { font-size: .615rem !important; }
.stat-card::after {
  content: ""; position: absolute; right: -26px; top: -26px;
  width: 84px; height: 84px; border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--ev-primary) 20%, transparent), transparent 70%);
  pointer-events: none;
}
.stats-mini .stat-number, .stat-number {
  font-size: 1.6rem !important;
  font-weight: 800 !important;
  letter-spacing: -.03em;
  line-height: 1.1;
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-accent));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.stat-label, .stats-mini .stat-label {
  font-size: .68rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .075em;
  color: var(--ev-text-muted) !important;
}
.stat-pending  .stat-number { background: linear-gradient(135deg, var(--ev-warning), color-mix(in srgb, var(--ev-warning) 55%, var(--ev-danger))); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.stat-approved .stat-number { background: linear-gradient(135deg, var(--ev-success), var(--ev-accent-2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.stat-rejected .stat-number { background: linear-gradient(135deg, var(--ev-danger), var(--ev-warning)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.stat-card .icon { color: color-mix(in srgb, var(--ev-primary) 60%, transparent) !important; }

.highlight {
  background: linear-gradient(180deg, transparent 58%, color-mix(in srgb, var(--ev-accent) 42%, transparent) 0) !important;
  color: inherit !important;
  border-radius: 3px;
  padding: 0 2px;
}

/* ==========================================================================
   15. SAYFA ÖZEL BILEŞENLER
   ========================================================================== */

/* --- Acente akordiyonlari --- */
.agency-card { margin-bottom: .7rem !important; }
.agency-accordion-header {
  cursor: pointer;
  padding: .8rem 1.05rem !important;
}

/* --- Cihaz gruplari --- */
.group-card { overflow: hidden; }
.group-header {
  padding: .85rem 1.05rem !important;
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
  border-bottom: 0 !important;
}
.group-header * { color: inherit !important; }
.group-body { padding: .9rem 1.05rem !important; }
.device-selection {
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  background: var(--ev-surface-2) !important;
  padding: .5rem !important;
}
.device-tag {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border-2) !important;
  color: var(--ev-text-2) !important;
  font-family: var(--ev-font-mono);
  font-size: .68rem !important;
  transition: all var(--ev-t-fast);
  cursor: default;
}
.device-tag:hover { border-color: var(--ev-primary) !important; color: var(--ev-primary) !important; transform: translateY(-1px); }
.default-badge {
  background: linear-gradient(135deg, var(--ev-success), var(--ev-accent-2)) !important;
  color: #06231b !important;
  border-color: transparent !important;
  box-shadow: 0 2px 8px -3px rgba(0,0,0,.35);
}
/* Degradeli baslik uzerindeki rozetler saydam olmamali */
.group-header .badge, .group-header .badge-modern, .group-header .default-badge {
  background: rgba(255,255,255,.92) !important;
  color: var(--ev-primary) !important;
  border-color: transparent !important;
}
.group-header .default-badge { background: linear-gradient(135deg, #ffffff, #eafff7) !important; color: #0b6b4f !important; }

/* --- Randevu / Target kartlari --- */
.target-card { padding: .85rem 1rem !important; cursor: pointer; }
.target-card.selected {
  border-color: var(--ev-primary) !important;
  background: color-mix(in srgb, var(--ev-primary) 8%, var(--ev-surface)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 15%, transparent), var(--ev-shadow-sm) !important;
}
.dropzone {
  border: 2px dashed var(--ev-border-2) !important;
  border-radius: var(--ev-r-lg) !important;
  background: var(--ev-surface-2) !important;
  color: var(--ev-text-muted) !important;
  transition: all var(--ev-t);
}
.dropzone.dragover {
  border-color: var(--ev-primary) !important;
  background: color-mix(in srgb, var(--ev-primary) 9%, var(--ev-surface)) !important;
  color: var(--ev-primary) !important;
}
.passport-preview { border-radius: var(--ev-r-md) !important; border: 1px solid var(--ev-border) !important; box-shadow: var(--ev-shadow-sm); }

/* --- Ödemeler --- */
.payment-name { font-weight: 700 !important; color: var(--ev-heading) !important; }
.payment-date { font-weight: 600 !important; color: var(--ev-text-2) !important; }
.payment-time { color: var(--ev-text-muted) !important; font-size: .72rem !important; }
.payment-go-button { border-radius: var(--ev-r-xs) !important; }
.payment-changed { animation: ev-flash 1.6s var(--ev-ease) 2; }
@keyframes ev-flash {
  0%, 100% { background: transparent; }
  50% { background: color-mix(in srgb, var(--ev-accent) 22%, transparent); }
}
.new-payments-alert {
  border-radius: var(--ev-r-md) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--ev-success) 16%, var(--ev-surface)), var(--ev-surface)) !important;
  border: 1px solid color-mix(in srgb, var(--ev-success) 32%, transparent) !important;
  color: var(--ev-text) !important;
}
.browser-sound-alert {
  border-radius: var(--ev-r-md) !important;
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  color: var(--ev-text) !important;
}
.sound-toggle { border-radius: var(--ev-r-pill) !important; }
.sound-toggle.disabled { opacity: .55; }
.sound-status { color: var(--ev-text-muted) !important; font-size: .74rem !important; }
.family-toggle {
  background: color-mix(in srgb, var(--ev-primary) 11%, transparent) !important;
  color: var(--ev-primary) !important;
  border: 0 !important;
  border-radius: var(--ev-r-pill) !important;
  font-size: .7rem !important;
}
.family-toggle.expanded { background: var(--ev-primary) !important; color: var(--ev-on-primary) !important; }
.filtered-out { display: none !important; }

/* --- Bot ayar karti --- */
.bot-settings-card {
  background: linear-gradient(120deg, var(--ev-primary), var(--ev-primary-2) 55%, var(--ev-accent)) !important;
  border-color: transparent !important;
  color: #fff !important;
  padding: 0 !important;
  box-shadow: var(--ev-shadow-brand), var(--ev-shadow-sm) !important;
}
.bot-settings-card .card-body { background: transparent !important; }
.bot-settings-card h1, .bot-settings-card h2, .bot-settings-card h3,
.bot-settings-card h4, .bot-settings-card h5, .bot-settings-card h6,
.bot-settings-card label, .bot-settings-card .form-label, .bot-settings-card small {
  color: #fff !important;
}
.bot-settings-card .btn {
  background: rgba(255,255,255,.94) !important;
  background-image: none !important;
  border-color: transparent !important;
  color: var(--ev-primary) !important;
  box-shadow: none !important;
}
.bot-settings-card .btn:hover { background: #fff !important; }
.bot-settings-card .form-control {
  background: rgba(255,255,255,.96) !important;
  border-color: transparent !important;
  color: #1a1c2e !important;
}
.last-notification-badge {
  background: color-mix(in srgb, var(--ev-info) 14%, transparent) !important;
  color: color-mix(in srgb, var(--ev-info) 70%, var(--ev-text)) !important;
}

/* --- Mesaj icerigi (SMS) --- */
.message-content {
  font-family: var(--ev-font-mono);
  font-size: .78rem;
  color: var(--ev-text) !important;
  background: var(--ev-surface-2) !important;
  border-radius: var(--ev-r-xs);
  padding: .28rem .5rem;
  display: inline-block;
  max-width: 100%;
  word-break: break-word;
}

/* --- Yukleme durumu --- */
.loading, .spinner-border { color: var(--ev-primary) !important; }

/* ==========================================================================
   16. EKLENTILER — Select2, Flatpickr, Datepicker, SweetAlert2, DataTables
   ========================================================================== */

/* --- Select2 --- */
.select2-container--bootstrap-5 .select2-selection,
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border-2) !important;
  border-radius: var(--ev-r-sm) !important;
  color: var(--ev-text) !important;
  box-shadow: var(--ev-shadow-xs) !important;
  transition: border-color var(--ev-t-fast), box-shadow var(--ev-t-fast);
}
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
  border-color: var(--ev-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 20%, transparent) !important;
}
.select2-container--bootstrap-5 .select2-selection__rendered,
.select2-container .select2-selection__rendered { color: var(--ev-text) !important; }
.select2-container--bootstrap-5 .select2-selection__placeholder,
.select2-container .select2-selection__placeholder { color: var(--ev-text-muted) !important; }
.select2-dropdown {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  overflow: hidden;
}
.select2-container--bootstrap-5 .select2-dropdown .select2-results__option,
.select2-results__option { color: var(--ev-text) !important; font-size: .85rem; padding: .48rem .7rem !important; }
.select2-container--bootstrap-5 .select2-results__option--highlighted,
.select2-results__option--highlighted[aria-selected] {
  background: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important;
  color: var(--ev-primary) !important;
}
.select2-container--bootstrap-5 .select2-results__option--selected,
.select2-results__option[aria-selected="true"] {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
}
.select2-search__field, .select2-container--bootstrap-5 .select2-search .select2-search__field {
  background: var(--ev-surface-2) !important;
  border: 1px solid var(--ev-border-2) !important;
  border-radius: var(--ev-r-xs) !important;
  color: var(--ev-text) !important;
}
.select2-selection__choice,
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice {
  background: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--ev-primary) 28%, transparent) !important;
  color: color-mix(in srgb, var(--ev-primary) 72%, var(--ev-text)) !important;
  border-radius: var(--ev-r-pill) !important;
  font-size: .74rem !important;
  padding: .1rem .5rem !important;
}
.select2-selection__choice__remove { color: inherit !important; opacity: .7; }
.select2-selection__choice__remove:hover { opacity: 1; color: var(--ev-danger) !important; background: transparent !important; }
.select2-container--bootstrap-5 .select2-selection__clear { color: var(--ev-text-muted) !important; }

/* --- Flatpickr --- */
.flatpickr-calendar {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  color: var(--ev-text) !important;
}
.flatpickr-months, .flatpickr-month, .flatpickr-current-month,
.flatpickr-monthDropdown-months, .numInputWrapper {
  background: transparent !important; color: var(--ev-heading) !important; fill: var(--ev-heading) !important;
}
.flatpickr-monthDropdown-months option { background: var(--ev-surface) !important; color: var(--ev-text) !important; }
.flatpickr-weekday { color: var(--ev-text-muted) !important; font-weight: 700 !important; font-size: .68rem; text-transform: uppercase; }
.flatpickr-day { color: var(--ev-text) !important; border-radius: var(--ev-r-xs) !important; border: 0 !important; }
.flatpickr-day:hover { background: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important; color: var(--ev-primary) !important; }
.flatpickr-day.today { box-shadow: inset 0 0 0 1.5px var(--ev-accent) !important; }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
}
.flatpickr-day.inRange { background: color-mix(in srgb, var(--ev-primary) 12%, transparent) !important; box-shadow: none !important; }
.flatpickr-day.flatpickr-disabled, .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { color: var(--ev-text-muted) !important; opacity: .45; }
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg { fill: var(--ev-primary) !important; }

/* --- Bootstrap Datepicker --- */
.datepicker, .datepicker-dropdown {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  color: var(--ev-text) !important;
  padding: .5rem !important;
}
.datepicker table tr td, .datepicker table tr th { color: var(--ev-text) !important; border-radius: var(--ev-r-xs) !important; }
.datepicker table tr td.day:hover { background: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important; color: var(--ev-primary) !important; }
.datepicker table tr td.active, .datepicker table tr td.active:hover,
.datepicker table tr td span.active {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
  text-shadow: none !important;
}
.datepicker table tr td.today { background: color-mix(in srgb, var(--ev-accent) 20%, transparent) !important; color: var(--ev-text) !important; }
.datepicker table tr td.old, .datepicker table tr td.new { color: var(--ev-text-muted) !important; }
.datepicker .datepicker-switch:hover, .datepicker .prev:hover, .datepicker .next:hover { background: var(--ev-surface-3) !important; }

/* --- SweetAlert2 --- */
.swal2-popup {
  background: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border-radius: var(--ev-r-xl) !important;
  border: 1px solid var(--ev-border) !important;
  box-shadow: var(--ev-shadow-lg) !important;
  font-family: var(--ev-font) !important;
}
.swal2-title { color: var(--ev-heading) !important; font-weight: 800 !important; letter-spacing: -.02em; }
.swal2-html-container, .swal2-content { color: var(--ev-text-2) !important; }
.swal2-container.swal2-backdrop-show { background: rgba(10, 12, 26, .55) !important; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.swal2-styled { border-radius: var(--ev-r-sm) !important; font-weight: 700 !important; box-shadow: none !important; }
.swal2-styled.swal2-confirm {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
  box-shadow: var(--ev-shadow-brand) !important;
}
.swal2-styled.swal2-deny   { background: linear-gradient(135deg, var(--ev-danger), color-mix(in srgb, var(--ev-danger) 60%, var(--ev-warning))) !important; }
.swal2-styled.swal2-cancel { background: var(--ev-surface-3) !important; color: var(--ev-text) !important; border: 1px solid var(--ev-border-2) !important; }
.swal2-input, .swal2-textarea, .swal2-select {
  background: var(--ev-surface) !important;
  border: 1px solid var(--ev-border-2) !important;
  border-radius: var(--ev-r-sm) !important;
  color: var(--ev-text) !important;
  box-shadow: none !important;
}
.swal2-input:focus, .swal2-textarea:focus { border-color: var(--ev-primary) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--ev-primary) 20%, transparent) !important; }
.swal2-icon.swal2-success { border-color: var(--ev-success) !important; color: var(--ev-success) !important; }
.swal2-icon.swal2-success [class^='swal2-success-line'] { background-color: var(--ev-success) !important; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: color-mix(in srgb, var(--ev-success) 35%, transparent) !important; }
.swal2-icon.swal2-error   { border-color: var(--ev-danger) !important;  color: var(--ev-danger) !important; }
.swal2-icon.swal2-error [class^='swal2-x-mark-line'] { background-color: var(--ev-danger) !important; }
.swal2-icon.swal2-warning { border-color: var(--ev-warning) !important; color: var(--ev-warning) !important; }
.swal2-icon.swal2-info, .swal2-icon.swal2-question { border-color: var(--ev-info) !important; color: var(--ev-info) !important; }
.swal2-timer-progress-bar { background: linear-gradient(90deg, var(--ev-primary), var(--ev-accent)) !important; }
.swal2-close:hover { color: var(--ev-danger) !important; }
.swal-wide { border-radius: var(--ev-r-xl) !important; }

/* --- DataTables --- */
.dataTables_wrapper { color: var(--ev-text) !important; }
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing { color: var(--ev-text-2) !important; font-size: .82rem; }
.dataTables_wrapper .dataTables_paginate .paginate_button {
  border-radius: var(--ev-r-sm) !important;
  border: 1px solid var(--ev-border) !important;
  background: var(--ev-surface) !important;
  color: var(--ev-text-2) !important;
  margin: 0 2px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: color-mix(in srgb, var(--ev-primary) 12%, var(--ev-surface)) !important;
  color: var(--ev-primary) !important;
  border-color: color-mix(in srgb, var(--ev-primary) 30%, transparent) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important;
  color: var(--ev-on-primary) !important;
  border-color: transparent !important;
}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after { opacity: .5; }

/* --- Tooltip / Popover --- */
.tooltip-inner {
  background: var(--ev-heading) !important;
  color: var(--ev-surface) !important;
  border-radius: var(--ev-r-xs) !important;
  font-size: .75rem;
  padding: .38rem .6rem;
  box-shadow: var(--ev-shadow-md);
}
.tooltip .tooltip-arrow::before { border-top-color: var(--ev-heading) !important; border-bottom-color: var(--ev-heading) !important; }
.popover { background: var(--ev-surface) !important; border: 1px solid var(--ev-border) !important; border-radius: var(--ev-r-md) !important; box-shadow: var(--ev-shadow-lg) !important; }
.popover-header { background: var(--ev-surface-2) !important; color: var(--ev-heading) !important; border-bottom-color: var(--ev-border) !important; }
.popover-body { color: var(--ev-text) !important; }

/* --- Bildirimler --- */
.notification, .toast {
  background: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border: 1px solid var(--ev-border) !important;
  border-radius: var(--ev-r-md) !important;
  box-shadow: var(--ev-shadow-lg) !important;
}
.toast-header { background: var(--ev-surface-2) !important; color: var(--ev-heading) !important; border-bottom-color: var(--ev-border) !important; }

/* ==========================================================================
   17. YARDIMCI SINIF UYUMU (utility sync)
   Panelin markup'inda gecen bg- ve text- yardimcilarini temaya baglar.
   ========================================================================== */

main .bg-white       { background-color: var(--ev-surface) !important; }
main .bg-light       { background-color: var(--ev-surface-2) !important; }
main .bg-body        { background-color: var(--ev-surface) !important; }
main .bg-body-tertiary { background-color: var(--ev-surface-3) !important; }
main .bg-dark        { background-color: var(--ev-solid-dark) !important; color: #fff !important; }

main .bg-primary:not(.badge):not(.badge-modern):not([class*="bg-opacity"]),
main .bg-success:not(.badge):not(.badge-modern):not([class*="bg-opacity"]),
main .bg-danger:not(.badge):not(.badge-modern):not([class*="bg-opacity"]),
main .bg-warning:not(.badge):not(.badge-modern):not([class*="bg-opacity"]),
main .bg-info:not(.badge):not(.badge-modern):not([class*="bg-opacity"]),
main .bg-secondary:not(.badge):not(.badge-modern):not([class*="bg-opacity"]) {
  color: #fff !important;
}
main .bg-primary:not(.badge):not(.badge-modern)   { background-color: var(--ev-solid-primary) !important; }
main .bg-success:not(.badge):not(.badge-modern)   { background-color: var(--ev-solid-success) !important; }
main .bg-danger:not(.badge):not(.badge-modern)    { background-color: var(--ev-solid-danger) !important; }
main .bg-warning:not(.badge):not(.badge-modern)   { background-color: var(--ev-solid-warning) !important; }
main .bg-info:not(.badge):not(.badge-modern)      { background-color: var(--ev-solid-info) !important; }
main .bg-secondary:not(.badge):not(.badge-modern) { background-color: var(--ev-solid-secondary) !important; }

/* bg-opacity ile kullanilan yumusak zeminler */
main .bg-primary.bg-opacity-10 { background-color: color-mix(in srgb, var(--ev-primary) 12%, transparent) !important; }
main .bg-success.bg-opacity-10 { background-color: color-mix(in srgb, var(--ev-success) 13%, transparent) !important; }
main .bg-danger.bg-opacity-10  { background-color: color-mix(in srgb, var(--ev-danger) 12%, transparent) !important; }
main .bg-warning.bg-opacity-10 { background-color: color-mix(in srgb, var(--ev-warning) 15%, transparent) !important; }
main .bg-info.bg-opacity-10    { background-color: color-mix(in srgb, var(--ev-info) 12%, transparent) !important; }

.text-primary   { color: var(--ev-primary) !important; }
.text-success   { color: color-mix(in srgb, var(--ev-success) 72%, var(--ev-text)) !important; }
.text-danger    { color: color-mix(in srgb, var(--ev-danger) 72%, var(--ev-text)) !important; }
.text-warning   { color: color-mix(in srgb, var(--ev-warning) 58%, var(--ev-text)) !important; }
.text-info      { color: color-mix(in srgb, var(--ev-info) 72%, var(--ev-text)) !important; }
main .text-muted, main .text-secondary { color: var(--ev-text-muted) !important; }
main .text-dark, main .text-body, main .text-black { color: var(--ev-text) !important; }

main .border, main .border-top, main .border-bottom, main .border-start, main .border-end,
main .border-1, main .border-2 { border-color: var(--ev-border) !important; }
main .shadow-sm { box-shadow: var(--ev-shadow-sm) !important; }
main .shadow    { box-shadow: var(--ev-shadow-md) !important; }
main .shadow-lg { box-shadow: var(--ev-shadow-lg) !important; }
main .rounded    { border-radius: var(--ev-r-sm) !important; }
main .rounded-3  { border-radius: var(--ev-r-md) !important; }
main .rounded-4  { border-radius: var(--ev-r-lg) !important; }

.list-group-item {
  background: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border-color: var(--ev-border) !important;
}
.list-group-item:first-child { border-top-left-radius: var(--ev-r-md) !important; border-top-right-radius: var(--ev-r-md) !important; }
.list-group-item:last-child  { border-bottom-left-radius: var(--ev-r-md) !important; border-bottom-right-radius: var(--ev-r-md) !important; }
.list-group-item.active { background: linear-gradient(135deg, var(--ev-primary), var(--ev-primary-2)) !important; border-color: transparent !important; color: var(--ev-on-primary) !important; }

.accordion-item { background: var(--ev-surface) !important; border-color: var(--ev-border) !important; border-radius: var(--ev-r-md) !important; overflow: hidden; }
.accordion-button { background: var(--ev-surface-2) !important; color: var(--ev-heading) !important; font-weight: 700 !important; box-shadow: none !important; }
.accordion-button:not(.collapsed) { background: color-mix(in srgb, var(--ev-primary) 11%, var(--ev-surface)) !important; color: var(--ev-primary) !important; }
.accordion-body { background: var(--ev-surface) !important; color: var(--ev-text) !important; }

/* ==========================================================================
   18. KOYU TEMA (midnight) ozel duzeltmeleri
   Sayfa ici stillerde sabit acik renkler kalmissa duzeltilir.
   ========================================================================== */

[data-ev-theme="midnight"] main img:not([src*=".svg"]) { filter: brightness(.94) contrast(1.02); }

[data-ev-theme="midnight"] .form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23a8b2cc' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") !important;
}
[data-ev-theme="midnight"] .btn-close { filter: invert(1) grayscale(1) brightness(1.8); }
[data-ev-theme="midnight"] .modal-backdrop.show,
[data-ev-theme="midnight"] .swal2-container.swal2-backdrop-show { background: rgba(2, 4, 12, .72) !important; }

[data-ev-theme="midnight"] main [style*="background: #fff"],
[data-ev-theme="midnight"] main [style*="background:#fff"],
[data-ev-theme="midnight"] main [style*="background-color: #fff"],
[data-ev-theme="midnight"] main [style*="background-color:#fff"],
[data-ev-theme="midnight"] main [style*="background: white"],
[data-ev-theme="midnight"] main [style*="background:white"] {
  background-color: var(--ev-surface) !important;
  background-image: none !important;
  color: var(--ev-text) !important;
}
[data-ev-theme="midnight"] main [style*="color: #000"],
[data-ev-theme="midnight"] main [style*="color:#000"],
[data-ev-theme="midnight"] main [style*="color: black"] { color: var(--ev-text) !important; }

[data-ev-theme="midnight"] .highlight { color: var(--ev-heading) !important; }
[data-ev-theme="midnight"] .tooltip-inner { background: var(--ev-surface-3) !important; color: var(--ev-text) !important; }
[data-ev-theme="midnight"] .tooltip .tooltip-arrow::before { border-top-color: var(--ev-surface-3) !important; border-bottom-color: var(--ev-surface-3) !important; }
[data-ev-theme="midnight"] main .btn-warning, [data-ev-theme="midnight"] main .btn-info,
[data-ev-theme="midnight"] .modal .btn-warning, [data-ev-theme="midnight"] .modal .btn-info { color: #0b1020 !important; }

/* ==========================================================================
   19. DUYARLILIK (responsive) & ERISILEBILIRLIK
   ========================================================================== */

@media (max-width: 991.98px) {
  .dashboard-header h1 { font-size: 1.28rem !important; }
  .dashboard-stats .btn { font-size: .74rem !important; padding: .32rem .66rem !important; }
  .gsm-search-form input { min-width: 150px; }
}

@media (max-width: 767.98px) {
  .dashboard-header { position: static !important; }
  .dashboard-header .device-count, .dashboard-header .subheader { display: none !important; }
  .dashboard-stats { overflow-x: auto; flex-wrap: nowrap !important; padding-bottom: 10px !important; scrollbar-width: none; }
  .dashboard-stats::-webkit-scrollbar { display: none; }
  .dashboard-stats .btn { white-space: nowrap; flex: 0 0 auto; }
  .card, .modern-card, .page-header { border-radius: var(--ev-r-md) !important; }
  .table { font-size: .8rem; }
  .stat-number, .stats-mini .stat-number { font-size: 1.35rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .card:hover, .device-card:hover, .btn:hover, .stat-card:hover { transform: none !important; }
}

/* Klavye ile gezinme halkasi */
:focus-visible {
  outline: 2px solid var(--ev-primary) !important;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ==========================================================================
   20. YAZDIRMA
   ========================================================================== */

@media print {
  body { background: #fff !important; color: #000 !important; }
  .dashboard-header, .controls, .pagination-wrapper, .sound-controls { display: none !important; }
  .card, .modern-card, .table-container { box-shadow: none !important; border: 1px solid #ccc !important; }
}

/* ==========================================================================
   21. SON GEÇERLILIK KATMANI
   Bootstrap'in yuksek ozgullukteki secicilerini gecmek icin en sonda durur.
   ========================================================================== */

/* Üst bardaki arama alani her zaman cam efektli kalsin */
.dashboard-header .gsm-search-form input,
.dashboard-header .gsm-search-form input.form-control,
.dashboard-header input[type="text"].form-control,
.dashboard-header input[type="search"].form-control,
.dashboard-header input[type="text"],
.dashboard-header input[type="search"] {
  background-color: rgba(255, 255, 255, .14) !important;
  background-image: none !important;
  border: 1px solid var(--ev-header-line) !important;
  border-radius: var(--ev-r-pill) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.dashboard-header .gsm-search-form input:focus,
.dashboard-header input[type="text"].form-control:focus,
.dashboard-header input[type="search"].form-control:focus {
  background-color: rgba(255, 255, 255, .24) !important;
  border-color: rgba(255, 255, 255, .55) !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .16) !important;
}
.dashboard-header ::placeholder { color: rgba(255, 255, 255, .62) !important; }

/* Degradeli / koyu zeminlerde beyaz metin korunur */
.group-header .text-white, .group-header,
.bot-settings-card .text-white,
.dashboard-header .text-white { color: #fff !important; }

/* Degradeli zeminde duran acik butonlar */
.group-header .btn, .group-header .btn-light {
  background: rgba(255, 255, 255, .18) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .28) !important;
  color: #fff !important;
}
.group-header .btn:hover { background: rgba(255, 255, 255, .3) !important; }

/* Üst bardaki butonlar her zaman hap (pill) formunda kalir */
.dashboard-header .btn.btn-sm,
.dashboard-header .btn.btn-sm.dropdown-toggle,
.dashboard-stats .btn.btn-sm,
.dashboard-header .user-info .dropdown-toggle,
.dashboard-header .gsm-search-form .btn {
  border-radius: var(--ev-r-pill) !important;
}

/* .page-header bazi sayfalarda dogrudan bir BASLIK etiketidir
   (degrade ile kirpilmis metin). Kart govdesi yerine degradeli baslik olarak birak. */
h1.page-header, h2.page-header, h3.page-header,
h4.page-header, h5.page-header, h6.page-header {
  background: linear-gradient(120deg, var(--ev-primary), var(--ev-primary-2) 60%, var(--ev-accent)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-weight: 800 !important;
  letter-spacing: -.025em;
  display: inline-block;
  overflow: visible !important;
}
h1.page-header::before, h2.page-header::before, h3.page-header::before,
h4.page-header::before, h5.page-header::before, h6.page-header::before { display: none !important; }
h1.page-header:hover, h2.page-header:hover, h3.page-header:hover, h4.page-header:hover,
h5.page-header:hover, h6.page-header:hover { transform: none !important; box-shadow: none !important; }

/* Degradeli ayar kartlarinin icindeki tum metinler acik renk kalir */
.bot-settings-card, .bot-settings-card * { border-color: rgba(255,255,255,.28); }
.bot-settings-card .text-muted, .bot-settings-card .form-text, .bot-settings-card small,
.bot-settings-card .badge, .bot-settings-card .last-notification-badge {
  color: rgba(255, 255, 255, .88) !important;
  background: rgba(255, 255, 255, .16) !important;
}
.bot-settings-card .form-text,
.bot-settings-card small:not(.badge) {
  background: transparent !important;
  color: rgba(255, 255, 255, .8) !important;
}
.bot-settings-card i { color: rgba(255, 255, 255, .9) !important; }
.bot-settings-card .btn i { color: var(--ev-primary) !important; }

/* Renkli/koyu zeminli kartlarda .text-white mirasi korunur
   (ornek: Muhasebe ozet kartlari) */
main .text-white,
main .text-white *:not(.badge):not(.badge-modern):not(.modern-badge):not(.btn):not(.form-control):not(.form-select):not(.stats-mini):not(.stat-card),
.modal .text-white,
.modal .text-white *:not(.badge):not(.btn):not(.form-control):not(.form-select) {
  color: #fff !important;
}
main .text-white-50, main .text-white .text-white-50,
main .text-white .opacity-75, main .text-white .text-muted {
  color: rgba(255, 255, 255, .68) !important;
}
main .text-white .btn-close { filter: invert(1) grayscale(1) brightness(2); }

/* Renkli yardimci zeminli kartlarin ic gövdesi seffaf kalsin */
main .card.bg-primary > *, main .card.bg-success > *, main .card.bg-danger > *,
main .card.bg-warning > *, main .card.bg-info > *, main .card.bg-dark > *,
main .card.bg-secondary > * {
  background: transparent !important;
  border-color: rgba(255, 255, 255, .22) !important;
}
main .card.bg-primary, main .card.bg-success, main .card.bg-danger,
main .card.bg-warning, main .card.bg-info, main .card.bg-dark,
main .card.bg-secondary { border-color: transparent !important; }

/* ==========================================================================
   22. SAYFA ICI SABIT RENKLERIN TEMAYA BAGLANMASI
   Bazi sayfalar satir/etiket zeminlerini sabit acik renklerle yaziyor.
   Bunlari palet uzerinden yeniden turetiyoruz — koyu temada da dogru calisir.
   ========================================================================== */

/* --- Randevu paneli satirlari --- */
.entries-table tr.entry-row.waitlisted-entry > td {
  background-color: color-mix(in srgb, var(--ev-success) 14%, var(--ev-surface)) !important;
  color: var(--ev-text) !important;
}
.entry-row:hover > td,
.table-modern tbody tr:hover > td,
.table-modern tbody tr:hover {
  background-color: color-mix(in srgb, var(--ev-primary) 9%, var(--ev-surface)) !important;
  color: var(--ev-text) !important;
}
.child-row > td {
  background-color: color-mix(in srgb, var(--ev-accent) 9%, var(--ev-surface-2)) !important;
  color: var(--ev-text) !important;
}
.new-sms-row > td, tr.new-sms-row {
  background-color: color-mix(in srgb, var(--ev-warning) 16%, var(--ev-surface)) !important;
  color: var(--ev-text) !important;
}

/* --- Modern tablo ve odeme kutulari --- */
.table-modern {
  background: var(--ev-surface) !important;
  color: var(--ev-text) !important;
  border-color: var(--ev-border) !important;
}
.table-modern { color: var(--ev-text) !important; }
.table-modern td, .table-modern th {
  border-color: var(--ev-border) !important;
  color: inherit;
}
.table-modern thead th {
  background: linear-gradient(180deg,
      color-mix(in srgb, var(--ev-primary) 14%, var(--ev-surface)),
      color-mix(in srgb, var(--ev-primary) 8%, var(--ev-surface))) !important;
  color: var(--ev-heading) !important;
  border-bottom-color: color-mix(in srgb, var(--ev-primary) 24%, var(--ev-border)) !important;
}
.table-modern tbody tr:nth-child(even) > td,
.table-modern td { background-color: transparent !important; }
.table-modern tbody tr:nth-child(even) {
  background-color: color-mix(in srgb, var(--ev-primary) 4%, transparent) !important;
}
.volume-control { background: var(--ev-surface-3) !important; }

/* --- Satir ici duzenleme vurgusu --- */
.editable-field:hover, .date-placeholder:hover {
  background-color: color-mix(in srgb, var(--ev-primary) 13%, transparent) !important;
  color: var(--ev-text) !important;
}

/* --- Oncelik rozetleri --- */
.priority-badge {
  border-radius: var(--ev-r-pill) !important;
  font-weight: 700 !important;
  font-size: .68rem !important;
  padding: .22em .62em !important;
}

/* --- Sabit acik zeminli rozetler --- */
.badge-danger  { background: color-mix(in srgb, var(--ev-danger) 16%, transparent) !important;  color: color-mix(in srgb, var(--ev-danger) 70%, var(--ev-text)) !important; }
.badge-info    { background: color-mix(in srgb, var(--ev-info) 16%, transparent) !important;    color: color-mix(in srgb, var(--ev-info) 70%, var(--ev-text)) !important; }

/* --- Sabit koyu metin renkleri (koyu temada okunmaz kalirdi) --- */
.modern-table tbody td,
.modern-table tbody th,
.table tbody th,
.location-country,
.location-office,
.device-checkbox label,
.search-container .search-icon,
.agency-filter-container::after { color: var(--ev-text) !important; }

.modern-card .modern-card-title { color: var(--ev-heading) !important; }

.search-container .search-icon,
.agency-filter-container::after,
.location-office { color: var(--ev-text-muted) !important; }

/* ==========================================================================
   23. SATIR ICI (inline style) RENKLERININ TEMAYA BAGLANMASI
   Panelde bazi basliklar ve rozetler renklerini dogrudan style="" ile
   yaziyor. Bunlari palete cekiyoruz; boylece koyu temada da okunur kalir.
   ========================================================================== */

/* Baslik etiketleri — inline color'i ezip tema basligi kullanilir */
main h1, main h2, main h3, main h4, main h5, main h6,
.modal h1, .modal h2, .modal h3, .modal h4, .modal h5, .modal h6 {
  color: var(--ev-heading) !important;
}
main .text-white h1, main .text-white h2, main .text-white h3,
main .text-white h4, main .text-white h5, main .text-white h6,
.bot-settings-card h6,
.group-header h1, .group-header h2, .group-header h3,
.group-header h4, .group-header h5, .group-header h6 { color: #fff !important; }
h1.page-header, h2.page-header, h3.page-header, h4.page-header,
h5.page-header, h6.page-header { -webkit-text-fill-color: transparent !important; }

/* Material tonlu inline rozet/etiket ciftleri → palet karsiliklari */
main [style*="#fff8e1"], main [style*="#FFF8E1"] {
  background-color: color-mix(in srgb, var(--ev-warning) 17%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-warning) 56%, var(--ev-text)) !important;
}
main [style*="#e3f2fd"], main [style*="#E3F2FD"] {
  background-color: color-mix(in srgb, var(--ev-info) 15%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-info) 68%, var(--ev-text)) !important;
}
main [style*="#f3e5f5"], main [style*="#F3E5F5"] {
  background-color: color-mix(in srgb, var(--ev-primary-2) 15%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-primary-2) 68%, var(--ev-text)) !important;
}
main [style*="#e0f2f1"], main [style*="#E0F2F1"] {
  background-color: color-mix(in srgb, var(--ev-accent) 15%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-accent) 60%, var(--ev-text)) !important;
}
main [style*="#ffebee"], main [style*="#FFEBEE"] {
  background-color: color-mix(in srgb, var(--ev-danger) 15%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-danger) 68%, var(--ev-text)) !important;
}
main [style*="#e8f5e9"], main [style*="#E8F5E9"] {
  background-color: color-mix(in srgb, var(--ev-success) 15%, var(--ev-surface)) !important;
  color: color-mix(in srgb, var(--ev-success) 66%, var(--ev-text)) !important;
}

/* Koyu temada sabit acik zeminler ve sabit koyu metinler */
[data-ev-theme="midnight"] main [style*="#f8f9fa"],
[data-ev-theme="midnight"] main [style*="#f5f5f5"],
[data-ev-theme="midnight"] main [style*="#fafafa"],
[data-ev-theme="midnight"] main [style*="#FAFAFA"],
[data-ev-theme="midnight"] main [style*="#F5F5F5"],
[data-ev-theme="midnight"] main [style*="#F8F9FA"] {
  background-color: var(--ev-surface-2) !important;
  color: var(--ev-text) !important;
}
[data-ev-theme="midnight"] main [style*="#616161"],
[data-ev-theme="midnight"] main [style*="#757575"],
[data-ev-theme="midnight"] main [style*="#424242"],
[data-ev-theme="midnight"] main [style*="#2c3e50"],
[data-ev-theme="midnight"] main [style*="#6c757d"],
[data-ev-theme="midnight"] main [style*="#666"],
[data-ev-theme="midnight"] main [style*="#495057"],
[data-ev-theme="midnight"] main [style*="#212529"],
[data-ev-theme="midnight"] main [style*="#374151"],
[data-ev-theme="midnight"] main [style*="#1e293b"] { color: var(--ev-text-2) !important; }

/* .modern-table (ve .table-modern) serit/hover zeminleri */
.modern-table tbody tr:nth-child(even),
.table-modern tbody tr:nth-child(even) {
  background-color: color-mix(in srgb, var(--ev-primary) 5%, transparent) !important;
}
.modern-table tbody tr:nth-child(even) > td,
.modern-table tbody tr > td,
.table-modern tbody tr > td { background-color: transparent !important; }
.modern-table tbody tr:hover,
.table-modern tbody tr:hover {
  background-color: color-mix(in srgb, var(--ev-primary) 10%, transparent) !important;
}
.modern-table tbody tr:hover > td,
.table-modern tbody tr:hover > td { background-color: transparent !important; color: var(--ev-text) !important; }
.modern-table, .modern-table thead tr, .table-modern, .table-modern thead tr { background-color: transparent !important; }


/* AUTO temasinin koyu mod ince ayarlari (midnight ile ayni kurallar) */
@media (prefers-color-scheme: dark) {
  [data-ev-theme="auto"] .form-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23a8b2cc' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") !important;
  }
  [data-ev-theme="auto"] .btn-close { filter: invert(1) grayscale(1) brightness(1.8); }
  [data-ev-theme="auto"] .modal-backdrop.show,
  [data-ev-theme="auto"] .swal2-container.swal2-backdrop-show { background: rgba(2, 4, 12, .72) !important; }
  [data-ev-theme="auto"] main [style*="background: #fff"],
  [data-ev-theme="auto"] main [style*="background:#fff"],
  [data-ev-theme="auto"] main [style*="background-color: #fff"],
  [data-ev-theme="auto"] main [style*="background-color:#fff"],
  [data-ev-theme="auto"] main [style*="background: white"],
  [data-ev-theme="auto"] main [style*="background:white"] {
    background-color: var(--ev-surface) !important;
    background-image: none !important;
    color: var(--ev-text) !important;
  }
  [data-ev-theme="auto"] main [style*="color: #000"],
  [data-ev-theme="auto"] main [style*="color:#000"],
  [data-ev-theme="auto"] main [style*="color: black"] { color: var(--ev-text) !important; }
  [data-ev-theme="auto"] .highlight { color: var(--ev-heading) !important; }
  [data-ev-theme="auto"] .tooltip-inner { background: var(--ev-surface-3) !important; color: var(--ev-text) !important; }
  [data-ev-theme="auto"] .tooltip .tooltip-arrow::before { border-top-color: var(--ev-surface-3) !important; border-bottom-color: var(--ev-surface-3) !important; }
  [data-ev-theme="auto"] .btn-warning, [data-ev-theme="auto"] .btn-info { color: #0b1020 !important; }
  [data-ev-theme="auto"] main [style*="#616161"],
  [data-ev-theme="auto"] main [style*="#757575"],
  [data-ev-theme="auto"] main [style*="#424242"],
  [data-ev-theme="auto"] main [style*="#2c3e50"],
  [data-ev-theme="auto"] main [style*="#6c757d"],
  [data-ev-theme="auto"] main [style*="#666"],
  [data-ev-theme="auto"] main [style*="#495057"],
  [data-ev-theme="auto"] main [style*="#212529"],
  [data-ev-theme="auto"] main [style*="#374151"],
  [data-ev-theme="auto"] main [style*="#1e293b"] { color: var(--ev-text-2) !important; }
}

/* Uygulamanin "koyu/renkli olsun" dedigi basliklar (icinde .text-white var)
   acik tonlu tema basligina donusmemeli — guclu degrade ile birakiyoruz. */
.card-header:has(.text-white), .card-header.text-white,
.modern-card-header:has(.text-white), .modern-card-header.text-white,
.sim-card-header:has(.text-white), .sim-card-header.text-white,
.device-header:has(.text-white), .device-header.text-white,
.agency-accordion-header:has(.text-white),
.country-card-header:has(.text-white), .country-card-header.text-white,
.modal-header:has(.text-white), .modal-header.text-white {
  background: linear-gradient(120deg, var(--ev-primary), var(--ev-primary-2) 58%, var(--ev-accent)) !important;
  border-bottom-color: transparent !important;
  color: #fff !important;
}
.card-header:has(.text-white) *:not(.badge):not(.text-dark),
.card-header.text-white *:not(.badge):not(.text-dark),
.modern-card-header:has(.text-white) *:not(.badge):not(.text-dark),
.modern-card-header.text-white *:not(.badge):not(.text-dark),
.sim-card-header:has(.text-white) *:not(.badge):not(.text-dark),
.device-header:has(.text-white) *:not(.badge):not(.text-dark),
.agency-accordion-header:has(.text-white) *:not(.badge):not(.text-dark),
.country-card-header:has(.text-white) *:not(.badge):not(.text-dark),
.country-card-header.text-white *:not(.badge):not(.text-dark),
.modal-header:has(.text-white) *:not(.badge):not(.text-dark),
.modal-header.text-white *:not(.badge):not(.text-dark) {
  color: #fff !important;
}
.card-header:has(.text-white) .badge, .country-card-header:has(.text-white) .badge,
.modal-header:has(.text-white) .badge {
  background: rgba(255, 255, 255, .2) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, .3) !important;
}
/* bg-white / text-dark ile isaretlenmis sayac rozetleri beyaz kalir */
.card-header:has(.text-white) .badge.bg-white,
.card-header:has(.text-white) .badge.text-dark,
.country-card-header:has(.text-white) .badge.bg-white,
.country-card-header:has(.text-white) .badge.text-dark,
.modal-header:has(.text-white) .badge.bg-white {
  background: #ffffff !important;
  color: var(--ev-primary) !important;
  border-color: transparent !important;
}

/* ==========================================================================
   24. CORPORATE TEMASI — yapisal ince ayarlar
   ========================================================================== */

/* Ust bar: degrade yerine sakin, duz lacivert + altin ayirici cizgi */
[data-ev-theme="corporate"] .dashboard-header {
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 55%),
    linear-gradient(100deg, var(--ev-header-from) 0%, var(--ev-header-via) 62%, var(--ev-header-to) 100%) !important;
  box-shadow: 0 2px 10px -4px rgba(14, 24, 38, .45), inset 0 -1px 0 var(--ev-header-line) !important;
}
[data-ev-theme="corporate"] .dashboard-header::after {
  height: 2px;
  opacity: 1;
  background: linear-gradient(90deg,
      var(--ev-accent) 0%,
      color-mix(in srgb, var(--ev-accent-2) 90%, transparent) 38%,
      transparent 100%);
}
[data-ev-theme="corporate"] .dashboard-header h1 { letter-spacing: .01em; text-shadow: none; }
[data-ev-theme="corporate"] .dashboard-header .btn,
[data-ev-theme="corporate"] .dashboard-stats .btn,
[data-ev-theme="corporate"] .dashboard-header .btn.btn-sm,
[data-ev-theme="corporate"] .dashboard-stats .btn.btn-sm,
[data-ev-theme="corporate"] .dashboard-header .user-info .dropdown-toggle {
  border-radius: var(--ev-r-sm) !important;
  font-weight: 500 !important;
  letter-spacing: .015em;
}
[data-ev-theme="corporate"] .dashboard-header .gsm-search-form input,
[data-ev-theme="corporate"] .dashboard-header input[type="text"].form-control,
[data-ev-theme="corporate"] .dashboard-header input[type="search"].form-control {
  border-radius: var(--ev-r-sm) !important;
}

/* Kartlar: daha az yukselme, daha net cizgi */
[data-ev-theme="corporate"] .card:hover,
[data-ev-theme="corporate"] .modern-card:hover,
[data-ev-theme="corporate"] .stat-card:hover,
[data-ev-theme="corporate"] .agency-card:hover,
[data-ev-theme="corporate"] .group-card:hover,
[data-ev-theme="corporate"] .target-card:hover,
[data-ev-theme="corporate"] .device-card:hover,
[data-ev-theme="corporate"] .sim-card:hover,
[data-ev-theme="corporate"] .stats-mini:hover { transform: translateY(-1px); }

[data-ev-theme="corporate"] .card-header:not(:has(.text-white)):not(.text-white),
[data-ev-theme="corporate"] .modern-card-header:not(:has(.text-white)):not(.text-white) {
  background: var(--ev-surface-2) !important;
  border-bottom: 2px solid color-mix(in srgb, var(--ev-primary) 22%, var(--ev-border)) !important;
  font-weight: 600;
}
/* Renkli baslikta kurumsal temada degrade yerine duz lacivert */
[data-ev-theme="corporate"] .card-header:has(.text-white),
[data-ev-theme="corporate"] .card-header.text-white,
[data-ev-theme="corporate"] .modern-card-header:has(.text-white),
[data-ev-theme="corporate"] .country-card-header:has(.text-white),
[data-ev-theme="corporate"] .modal-header:has(.text-white),
[data-ev-theme="corporate"] .group-header {
  background-image: none !important;
  background-color: var(--ev-primary) !important;
}
[data-ev-theme="corporate"] .page-header::before {
  background: linear-gradient(180deg, var(--ev-primary), var(--ev-accent));
  width: 3px;
}

/* Tablolar: gazete duzeni — duz baslik, ince cizgiler */
[data-ev-theme="corporate"] .table thead th,
[data-ev-theme="corporate"] .modern-table thead th,
[data-ev-theme="corporate"] .entries-table thead th,
[data-ev-theme="corporate"] table.dataTable thead th {
  background: var(--ev-surface-3) !important;
  color: var(--ev-heading) !important;
  border-bottom: 2px solid color-mix(in srgb, var(--ev-primary) 30%, var(--ev-border)) !important;
  letter-spacing: .085em;
  font-weight: 700 !important;
}
[data-ev-theme="corporate"] .table tbody tr:hover,
[data-ev-theme="corporate"] .modern-table tbody tr:hover,
[data-ev-theme="corporate"] .entries-table tbody tr:hover {
  box-shadow: inset 2px 0 0 var(--ev-primary);
}

/* Butonlar: degrade yerine duz dolgu, ince cerceve */
[data-ev-theme="corporate"] .btn-primary,
[data-ev-theme="corporate"] .modern-btn-primary,
[data-ev-theme="corporate"] .send-to-bot-btn {
  background-image: none !important;
  background-color: var(--ev-primary) !important;
  box-shadow: var(--ev-shadow-xs) !important;
}
[data-ev-theme="corporate"] .btn-success { background-image: none !important; background-color: var(--ev-success) !important; box-shadow: var(--ev-shadow-xs) !important; }
[data-ev-theme="corporate"] .btn-danger { background-image: none !important; background-color: var(--ev-danger) !important;  box-shadow: var(--ev-shadow-xs) !important; }
[data-ev-theme="corporate"] .btn-warning { background-image: none !important; background-color: var(--ev-warning) !important; color: #fff !important; box-shadow: var(--ev-shadow-xs) !important; }
[data-ev-theme="corporate"] .btn-info { background-image: none !important; background-color: var(--ev-info) !important; color: #fff !important; box-shadow: var(--ev-shadow-xs) !important; }
[data-ev-theme="corporate"] .btn { font-weight: 600 !important; }
[data-ev-theme="corporate"] .page-item.active .page-link,
[data-ev-theme="corporate"] .pagination-btn.active,
[data-ev-theme="corporate"] .filter-badge.active,
[data-ev-theme="corporate"] .nav-pills .nav-link.active,
[data-ev-theme="corporate"] .dropdown-item.active,
[data-ev-theme="corporate"] .list-group-item.active {
  background-image: none !important;
  background-color: var(--ev-primary) !important;
}

/* Rozetler: kare kose, ince cerceveli kurumsal etiket */
[data-ev-theme="corporate"] .badge,
[data-ev-theme="corporate"] .badge-modern,
[data-ev-theme="corporate"] .modern-badge,
[data-ev-theme="corporate"] .status-badge,
[data-ev-theme="corporate"] .priority-badge,
[data-ev-theme="corporate"] .device-tag,
[data-ev-theme="corporate"] .filter-badge {
  border-radius: 4px !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .655rem !important;
}

/* Vurgu sayilari: degrade metin yerine duz lacivert */
[data-ev-theme="corporate"] .stat-number,
[data-ev-theme="corporate"] .stats-mini .stat-number {
  background: none !important;
  -webkit-text-fill-color: var(--ev-primary) !important;
  color: var(--ev-primary) !important;
}
[data-ev-theme="corporate"] h1.page-header, [data-ev-theme="corporate"] h2.page-header,
[data-ev-theme="corporate"] h3.page-header, [data-ev-theme="corporate"] h4.page-header,
[data-ev-theme="corporate"] h5.page-header, [data-ev-theme="corporate"] h6.page-header {
  background: none !important;
  -webkit-text-fill-color: var(--ev-heading) !important;
  color: var(--ev-heading) !important;
}

/* Zemin: cok sakin, neredeyse duz kagit */
[data-ev-theme="corporate"] body {
  background-image:
    radial-gradient(900px 480px at 6% -10%, var(--ev-bg-tint-1), transparent 58%),
    radial-gradient(700px 400px at 98% 4%, var(--ev-bg-tint-2), transparent 56%) !important;
}

/* Ust bardaki renkli butonlar (orn. "Aktif Kullanici" rozeti):
   degradeli zemin uzerinde her temada okunur kalmasi icin beyaz hap +
   anlamli renkte metin. */
.dashboard-header .btn.btn-warning,
.dashboard-header .btn.btn-danger,
.dashboard-header .btn.btn-success,
.dashboard-header .btn.btn-info,
.dashboard-header .btn.btn-primary,
.dashboard-header .btn.btn-dark,
.dashboard-header .btn.btn-secondary {
  background: rgba(255, 255, 255, .93) !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: 0 2px 8px -3px rgba(0, 0, 0, .45) !important;
}
.dashboard-header .btn.btn-warning:hover,
.dashboard-header .btn.btn-danger:hover,
.dashboard-header .btn.btn-success:hover,
.dashboard-header .btn.btn-info:hover,
.dashboard-header .btn.btn-primary:hover,
.dashboard-header .btn.btn-dark:hover,
.dashboard-header .btn.btn-secondary:hover { background: #fff !important; }

.dashboard-header .btn.btn-warning   { color: color-mix(in srgb, var(--ev-warning) 60%, #1a1205) !important; }
.dashboard-header .btn.btn-danger    { color: color-mix(in srgb, var(--ev-danger) 80%, #190410) !important; }
.dashboard-header .btn.btn-success   { color: color-mix(in srgb, var(--ev-success) 72%, #06170f) !important; }
.dashboard-header .btn.btn-info      { color: color-mix(in srgb, var(--ev-info) 78%, #02131f) !important; }
.dashboard-header .btn.btn-primary   { color: color-mix(in srgb, var(--ev-primary) 86%, #0b1020) !important; }
.dashboard-header .btn.btn-dark,
.dashboard-header .btn.btn-secondary { color: #1a1c2e !important; }
.dashboard-header .btn.btn-warning i, .dashboard-header .btn.btn-danger i,
.dashboard-header .btn.btn-success i, .dashboard-header .btn.btn-info i,
.dashboard-header .btn.btn-primary i, .dashboard-header .btn.btn-dark i,
.dashboard-header .btn.btn-secondary i { color: inherit !important; }

/* Bootstrap floating-label alanlarinda placeholder gizli kalmalidir,
   aksi halde etiket ile placeholder ust uste biniyor. */
.form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder,
.form-floating > textarea.form-control::placeholder { color: transparent !important; }
.form-floating > .form-control:focus::placeholder { color: transparent !important; }

/* Secili (checked / active) buton durumlari — btn-check ile calisan
   radyo/segment gruplari dolgusunu kaybetmemeli. */
.btn-check:checked + .btn-outline-primary,
.btn-outline-primary.active, .btn-outline-primary:active,
.btn-check:active + .btn-outline-primary {
  background: var(--ev-primary) !important;
  border-color: var(--ev-primary) !important;
  color: var(--ev-on-primary) !important;
}
.btn-check:checked + .btn-outline-success,
.btn-outline-success.active, .btn-outline-success:active {
  background: var(--ev-success) !important; border-color: var(--ev-success) !important; color: #fff !important;
}
.btn-check:checked + .btn-outline-danger,
.btn-outline-danger.active, .btn-outline-danger:active {
  background: var(--ev-danger) !important; border-color: var(--ev-danger) !important; color: #fff !important;
}
.btn-check:checked + .btn-outline-warning,
.btn-outline-warning.active, .btn-outline-warning:active {
  background: var(--ev-warning) !important; border-color: var(--ev-warning) !important; color: #23180a !important;
}
.btn-check:checked + .btn-outline-info,
.btn-outline-info.active, .btn-outline-info:active {
  background: var(--ev-info) !important; border-color: var(--ev-info) !important; color: #06212e !important;
}
.btn-check:checked + .btn-outline-secondary,
.btn-outline-secondary.active, .btn-outline-secondary:active {
  background: var(--ev-surface-3) !important; border-color: var(--ev-border-2) !important; color: var(--ev-heading) !important;
}
.btn-check:checked + .btn-outline-dark,
.btn-outline-dark.active, .btn-outline-dark:active {
  background: var(--ev-heading) !important; border-color: var(--ev-heading) !important; color: var(--ev-surface) !important;
}
.btn-check:checked + .btn-primary, .btn-primary.active {
  background-image: linear-gradient(135deg, var(--ev-primary-2), var(--ev-primary)) !important;
}
.btn-check:checked + .btn i, .btn.active i { color: inherit !important; }

/* ==========================================================================
   25. GIRIS EKRANI (login)
   <body class="ev-login"> ile devreye girer. Tum temalarla uyumludur.
   ========================================================================== */

body.ev-login {
  min-height: 100vh;
  margin: 0;
  background: var(--ev-bg) !important;
  background-image: none !important;
  display: block;
}

.ev-login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
}

/* ---- Sol: marka paneli ---- */
.ev-login-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, 4vw, 3.5rem);
  padding-bottom: clamp(5rem, 10vh, 7rem);
  overflow: hidden;
  background: #0a1628;
  isolation: isolate;
}
/* Marka degradesi (taban) */
.ev-login-hero::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(680px 420px at 12% 8%, rgba(255,255,255,.10), transparent 62%),
    linear-gradient(158deg,
      var(--ev-header-from) 0%,
      var(--ev-header-via) 46%,
      #060e1c 100%);
  z-index: -2;
}
/* Dunya ufku serit halinde alta yaslanir, ustu degradeye karisir */
.ev-login-hero::before {
  content: "";
  position: absolute;
  left: -6%; right: -6%; bottom: 0;
  height: clamp(150px, 26vh, 260px);
  /* NOT: custom property icindeki url() STYLESHEET'e gore cozulur,
     belgeye gore degil. Bu yuzden --ev-login-hero'ya MUTLAK bir adres
     verin (Blade'de {{ v_asset('img/login-hero.jpg') }} zaten mutlaktir). */
  background-image: var(--ev-login-hero, none);
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% auto;
  opacity: .85;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 42%, #000 100%);
          mask-image: linear-gradient(to bottom, transparent 0%, #000 42%, #000 100%);
  z-index: -1;
  pointer-events: none;
}
/* Sag kenarda ince altin ayirici */
.ev-login-hero { box-shadow: inset -1px 0 0 rgba(255, 255, 255, .10); }

.ev-hero-mark {
  width: clamp(72px, 7vw, 104px);
  height: auto;
  border-radius: 22%;
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .8);
  margin-bottom: 1.6rem;
}
.ev-hero-title {
  color: #fff;
  font-size: clamp(1.7rem, 2.7vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.14;
  margin: 0 0 .7rem;
  max-width: 15ch;
}
.ev-hero-title span {
  background: linear-gradient(100deg, var(--ev-accent-2), var(--ev-accent));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ev-hero-sub {
  color: rgba(255, 255, 255, .72);
  font-size: .96rem;
  line-height: 1.6;
  max-width: 42ch;
  margin: 0 0 2rem;
}
.ev-hero-points { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
.ev-hero-points li {
  display: flex; align-items: center; gap: .7rem;
  color: rgba(255, 255, 255, .9);
  font-size: .9rem;
  font-weight: 500;
}
.ev-hero-points i {
  flex: 0 0 auto;
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--ev-r-sm);
  background: rgba(255, 255, 255, .11);
  border: 1px solid rgba(255, 255, 255, .16);
  color: var(--ev-accent-2);
  font-size: .8rem;
}
.ev-login-hero > * { position: relative; z-index: 1; }
.ev-hero-foot {
  position: absolute;
  left: clamp(2rem, 4vw, 3.5rem);
  right: clamp(2rem, 4vw, 3.5rem);
  bottom: clamp(1.4rem, 3vh, 2.2rem);
  color: rgba(255, 255, 255, .62);
  font-size: .78rem;
  letter-spacing: .03em;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .75);
}

/* ---- Sag: form paneli ---- */
.ev-login-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--ev-surface);
}
.ev-login-box { width: 100%; max-width: 400px; }

.ev-login-logo { height: 46px; width: auto; margin-bottom: 2rem; display: block; }
.ev-login-logo--light { display: none; }

.ev-login-title {
  color: var(--ev-heading);
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: -.025em;
  margin: 0 0 .3rem;
}
.ev-login-sub { color: var(--ev-text-muted); font-size: .9rem; margin: 0 0 1.8rem; }

.ev-login-box .form-label {
  display: block;
  font-size: .78rem !important;
  font-weight: 700 !important;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--ev-text-muted) !important;
  margin-bottom: .4rem;
}

.ev-field { position: relative; margin-bottom: 1.1rem; }
.ev-field > i {
  position: absolute; left: .9rem; top: 50%; transform: translateY(-50%);
  color: var(--ev-text-muted);
  font-size: .85rem;
  pointer-events: none;
  transition: color var(--ev-t-fast);
}
.ev-field .form-control {
  padding: .78rem .9rem .78rem 2.5rem !important;
  font-size: .93rem !important;
  width: 100%;
}
.ev-field:focus-within > i { color: var(--ev-primary); }
.ev-field .ev-eye {
  position: absolute; right: .35rem; top: 50%; transform: translateY(-50%);
  background: none; border: 0; padding: .45rem .6rem;
  color: var(--ev-text-muted); cursor: pointer;
  border-radius: var(--ev-r-xs);
  transition: color var(--ev-t-fast), background var(--ev-t-fast);
}
.ev-field .ev-eye:hover { color: var(--ev-primary); background: color-mix(in srgb, var(--ev-primary) 10%, transparent); }

.ev-login-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; margin: .2rem 0 1.5rem;
}
.ev-login-row .form-check { margin: 0; }
.ev-login-row .form-check-label { font-size: .87rem; color: var(--ev-text-2); }
.ev-login-link { font-size: .87rem; font-weight: 600; color: var(--ev-primary); }

.ev-login-btn {
  width: 100%;
  padding: .82rem 1rem !important;
  font-size: .97rem !important;
  font-weight: 700 !important;
  border: 0 !important;
  border-radius: var(--ev-r-sm) !important;
  color: var(--ev-on-primary) !important;
  background-image: linear-gradient(120deg, var(--ev-primary), var(--ev-primary-2) 65%, var(--ev-accent)) !important;
  background-size: 160% 100%;
  background-position: 0% 50%;
  box-shadow: var(--ev-shadow-brand) !important;
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  transition: background-position .45s var(--ev-ease), transform var(--ev-t-fast), box-shadow var(--ev-t-fast);
}
.ev-login-btn:hover { background-position: 100% 50%; transform: translateY(-1px); color: #fff !important; }
.ev-login-btn:active { transform: translateY(0) scale(.99); }
.ev-login-btn i { transition: transform var(--ev-t-fast); }
.ev-login-btn:hover i { transform: translateX(3px); }

.ev-login-foot {
  margin-top: 2rem;
  text-align: center;
  font-size: .78rem;
  color: var(--ev-text-muted);
}
.ev-login-box .alert { font-size: .87rem; margin-bottom: 1.2rem; }
.ev-login-box .alert ul { padding-left: 1.1rem; margin: 0; }

/* Mobil / dar ekran: marka paneli ince bir seride donusur */
@media (max-width: 991.98px) {
  .ev-login-shell { grid-template-columns: 1fr; }
  .ev-login-hero {
    min-height: 210px;
    padding: 1.6rem 1.4rem;
    justify-content: center;
    text-align: center;
    align-items: center;
  }
  .ev-hero-mark { width: 62px; margin-bottom: .9rem; }
  .ev-hero-title {
    font-size: 1.35rem;
    max-width: none;
    text-shadow: 0 2px 14px rgba(0, 0, 0, .65);
  }
  /* Dar ekranda serit basligin arkasina denk geliyor, biraz kisilir */
  .ev-login-hero::before { opacity: .5; height: 100%; }
  .ev-hero-sub, .ev-hero-points, .ev-hero-foot { display: none; }
  .ev-login-panel { padding: 2rem 1.4rem 3rem; align-items: flex-start; }
  .ev-login-logo { margin: 0 auto 1.6rem; }
  .ev-login-title, .ev-login-sub { text-align: center; }
}

/* Koyu temalarda acik logo varyantina gec */
[data-ev-theme="midnight"] .ev-login-logo--dark { display: none; }
[data-ev-theme="midnight"] .ev-login-logo--light { display: block; }
@media (prefers-color-scheme: dark) {
  [data-ev-theme="auto"] .ev-login-logo--dark { display: none; }
  [data-ev-theme="auto"] .ev-login-logo--light { display: block; }
}

/* Kurumsal temada daha sakin bir giris ekrani */
[data-ev-theme="corporate"] .ev-login-btn {
  background-image: none !important;
  background-color: var(--ev-primary) !important;
  box-shadow: var(--ev-shadow-sm) !important;
}
[data-ev-theme="corporate"] .ev-login-btn:hover { background-color: var(--ev-primary-2) !important; }
[data-ev-theme="corporate"] .ev-hero-title span {
  background: none; -webkit-text-fill-color: var(--ev-accent-2); color: var(--ev-accent-2);
}

/* ==========================================================================
   26. ÜST BAR MARKA LOGOSU
   <h1 class="ev-brand"><img src=".../logo-header-light.png" alt="EarthVisa"></h1>
   Koyu degradeli baslik icin acik (lacivert -> beyaz) varyant kullanilir.
   ========================================================================== */

.dashboard-header .ev-brand {
  display: inline-flex;
  align-items: center;
  margin: 0 !important;
  padding: 0;
  line-height: 0;
}
.dashboard-header .ev-brand img {
  height: 34px;
  width: auto;
  display: block;
  filter: drop-shadow(0 1px 6px rgba(0, 0, 0, .35));
}
@media (max-width: 991.98px) { .dashboard-header .ev-brand img { height: 29px; } }
@media (max-width: 575.98px) { .dashboard-header .ev-brand img { height: 25px; } }

/* ==========================================================================
   27. IC ICE YUVARLATILMIS KUTULAR
   Kart > kart > tablo basligi seklinde yigilan bloklarin her biri ayni kose
   yaricapini alinca kenarlar ust uste biniyor ve goruntu kirik cikiyor
   (orn. Randevu Basvurulari: acente karti > ulke karti > tablo basligi).

   Kural: kose yaricapi yalnizca EN DISTAKI cerceveye aittir. Icerideki tam
   genislikteki bolumler duz bant olur, tablo baslik satiri da kendi
   yaricapini birakir.
   ========================================================================== */

/* --- 1) Kart icindeki TAM GENISLIKTEKI bolum kartlari duz banda doner ---
   Yalnizca dogrudan cocuk olanlar hedeflenir; bir .row/.col-* icinde duran
   kartlar (izgara icindeki gercek kartlar) etkilenmez. */
.card .country-card,
.card > .card-body > .card,
.card > .card-body > .modern-card,
.card > .agency-accordion-body > .card,
.card > .card-body > .agency-card {
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}
.card .country-card > .card-header,
.card .country-card > .card-footer,
.card > .card-body > .card > .card-header,
.card > .card-body > .card > .card-footer,
.card > .agency-accordion-body > .card > .card-header,
.card > .card-body > .modern-card > .modern-card-header {
  border-radius: 0 !important;
}
/* Ic bant hover'da yukselmemeli — cerceveden tasip kayik gorunuyor */
.card .country-card:hover,
.card > .card-body > .card:hover,
.card > .agency-accordion-body > .card:hover,
.card > .card-body > .modern-card:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* --- 2) Bir kart basliginin altindaki tablo basligi yaricap tasimaz ---
   Aksi halde baslik seridinin yuvarlak kenari ile tablo basliginin yuvarlak
   kenari ust uste biniyor. */
.card:has(> .card-header) .table thead th,
.card:has(> .card-header) .modern-table thead th,
.card:has(> .card-header) .entries-table thead th,
.card:has(> .modern-card-header) .table thead th {
  border-radius: 0 !important;
}

/* --- 3) Kart icindeki kaydirma kutulari kendi yaricapini tasimaz ---
   Yuvarlak cerceveyi zaten kartin kendisi veriyor. */
.card .table-responsive,
.card .table-container { border-radius: 0 !important; }

/* ==========================================================================
   28. DASHBOARD — KANAL HARITASI
   Cihaz adi "<cihaz>-<kanal><slot>" kalibindan cozulur (orn. SLAYER-1A).
   Her kanal 2x2 bir blok: ustte B ve D, altta A ve C. Satirda 4 kanal,
   yani 8 kart yan yana. Cihaz onekine gore sekme acilir.
   ========================================================================== */

/* --- cihaz sekmeleri --- */
.dv-tabs {
  display: flex; gap: 4px; align-items: flex-end; flex-wrap: wrap;
  border-bottom: 1px solid var(--ev-border);
  padding: 0 2px; margin-bottom: 14px;
}
.dv-tabs:empty, .dv-tabs.is-single { display: none; }
.dv-tab {
  display: inline-flex; align-items: center; gap: 8px;
  padding: .5rem .95rem; border: 1px solid transparent; border-bottom: 0;
  border-radius: var(--ev-r-sm) var(--ev-r-sm) 0 0;
  font-size: .83rem; font-weight: 700; color: var(--ev-text-muted);
  cursor: pointer; background: transparent; position: relative; top: 1px;
  transition: color var(--ev-t-fast), background var(--ev-t-fast);
}
.dv-tab:hover { color: var(--ev-primary); background: color-mix(in srgb, var(--ev-primary) 7%, transparent); }
.dv-tab.on { background: var(--ev-surface); border-color: var(--ev-border); color: var(--ev-heading); }
.dv-tab.on::after {
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px;
  background: linear-gradient(90deg, var(--ev-primary), var(--ev-accent));
}
.dv-tab .cnt {
  font-family: var(--ev-font-mono); font-size: .66rem; font-weight: 800;
  padding: .12em .4em; border-radius: 4px;
  background: color-mix(in srgb, var(--ev-primary) 12%, transparent); color: var(--ev-primary);
}
.dv-tab.on .cnt {
  background: color-mix(in srgb, var(--ev-success) 16%, transparent);
  color: color-mix(in srgb, var(--ev-success) 70%, var(--ev-text));
}

/* --- kanal izgarasi: satirda 4 kanal --- */
.ch-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: start; }
.ch-grid[hidden] { display: none; }
@media (max-width: 1500px) { .ch-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1150px) { .ch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .ch-grid { grid-template-columns: 1fr; } }

/* --- kanal blogu --- */
.ch { border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); background: var(--ev-surface-2); overflow: hidden; }
.ch[hidden] { display: none; }
.ch-head {
  display: flex; align-items: center; gap: 8px; padding: 5px 9px;
  background: color-mix(in srgb, var(--ev-primary) 8%, var(--ev-surface));
  border-bottom: 1px solid var(--ev-border);
}
.ch-lbl { font-size: .62rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--ev-text-muted); }
.ch-no  { font-family: var(--ev-font-mono); font-size: .7rem; font-weight: 800; letter-spacing: .04em;
          color: color-mix(in srgb, var(--ev-primary) 85%, var(--ev-text)); }
.ch-slots { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 6px; }

/* --- minimal kart --- */
.dv { background: var(--ev-surface); border: 1px solid var(--ev-border); border-radius: var(--ev-r-sm);
      overflow: hidden; height: 100%; transition: border-color var(--ev-t-fast), box-shadow var(--ev-t-fast); }
.dv:hover { border-color: color-mix(in srgb, var(--ev-primary) 34%, var(--ev-border)); box-shadow: var(--ev-shadow-sm); }
.dv.off { background: color-mix(in srgb, var(--ev-danger) 5%, var(--ev-surface)); }

/* Aktif kart: beyaz tabanli acik yesil zemin. Zemin temadan bagimsiz sabit
   oldugu icin icerideki metinler koyuya sabitlenir — aksi halde koyu temada
   acik yazi acik zemine dusup okunmuyor. */
.dv.on { background: color-mix(in srgb, var(--ev-success) 12%, #ffffff); }
.dv.on .dv-head      { border-bottom-color: rgba(0, 0, 0, .10); }
.dv.on .dv-slot      { color: #000; }
.dv.on .dv-num       { color: #000; }
.dv.on .dv-num.none  { color: #5a6470; }
.dv.on .dv-age       { color: #3d4652; }
.dv.on .dv-age.stale { color: #8a5a00; }
.dv.on .dv-age.dead  { color: #a3202f; }
.dv.on .dv-gid       { background: rgba(0, 0, 0, .07); color: #1b2430; }
.dv.on .dv-gid.none  { background: rgba(0, 0, 0, .05); color: #5a6470; }
.dv.on .dv-batt      { background: rgba(0, 0, 0, .10); }

.dv-head { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-bottom: 1px solid var(--ev-border); }
.dv-dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto; }
.dv-dot.on  { background: var(--ev-success); box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--ev-success) 22%, transparent); }
.dv-dot.off { background: var(--ev-danger);  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--ev-danger) 18%, transparent); }
.dv-slot { font-size: .75rem; font-weight: 800; color: var(--ev-heading); flex: 1 1 auto; min-width: 0;
           white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: .02em; }
.dv-age  { font-size: .66rem; font-weight: 700; color: var(--ev-text-muted); white-space: nowrap;
           cursor: help; font-variant-numeric: tabular-nums; }
.dv-age.stale { color: color-mix(in srgb, var(--ev-warning) 62%, var(--ev-text)); }
.dv-age.dead  { color: color-mix(in srgb, var(--ev-danger) 72%, var(--ev-text)); }
.dv-body { padding: 5px 8px 6px; display: grid; gap: 3px; }
.dv-sim  { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.dv-num  { font-family: var(--ev-font-mono); font-size: .76rem; font-weight: 600; color: var(--ev-text);
           font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dv-num.none { color: var(--ev-text-muted); font-style: italic; font-weight: 400;
               font-family: var(--ev-font); font-size: .72rem; }
.dv-gid { font-family: var(--ev-font-mono); font-size: .64rem; font-weight: 700; cursor: help; flex: 0 0 auto;
          padding: .12em .4em; border-radius: 4px;
          background: color-mix(in srgb, var(--ev-primary) 11%, transparent);
          color: color-mix(in srgb, var(--ev-primary) 84%, var(--ev-text)); }
.dv-gid.none { background: var(--ev-surface-3); color: var(--ev-text-muted); }
.dv-sim-off  { opacity: .5; }
.dv-batt { height: 2px; background: var(--ev-surface-3); }
.dv-batt i { display: block; height: 100%; }

/* --- bos slot: dolu kartla ayni yukseklikte, yerlesim kaymasin --- */
.dv-empty {
  border: 1px dashed var(--ev-border-2); border-radius: var(--ev-r-sm); background: transparent;
  display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 63px;
  color: var(--ev-text-muted); font-size: .7rem; font-weight: 600; letter-spacing: .04em; opacity: .8;
}
.dv-empty .sl { font-size: .75rem; font-weight: 800; opacity: .6; }

/* kart sarmalayicisi — filtrede gizlenen hucre yerini korur */
.dv-cell { display: block; height: 100%; }
.dv-cell[hidden] { display: none; }

/* ==== EarthVisa Nova Tema — son ==== */