/* ==========================================================================
   FLIGHTSCONTROL — HAVACILIK KOKPİTİ (YÖN 2) KABUK & GÖRÜNÜM MİMARİSİ
   SaaS Çok Kiracılı Uçak Bileti Maliyet ve Finansal Mutabakat Paneli
   ========================================================================== */

:root {
  /* Havacılık Kokpiti Kenar Çubuğu (Sabit Koyu Havacılık Laciverti) */
  --fc-sidebar: #0A192F;
  --fc-sidebar-kenar: #172A45;
  --fc-sidebar-yazi: #94A3B8;
  --fc-sidebar-hover: #172A45;
  --fc-sidebar-aktif: #1E293B;
  --fc-sidebar-vurgu: #38BDF8;
  --fc-sidebar-ikon: #64748B;
  --fc-sidebar-ikon-aktif: #38BDF8;

  /* Açık Tema (Aero Pale Blue-Gray) */
  --fc-zemin: #F0F4F8;
  --fc-kart: #FFFFFF;
  --fc-ust: #FFFFFF;
  --fc-ust-kenar: #E2E8F0;
  --fc-ust-yazi: #0F172A;
  --fc-metin-ana: #0F172A;
  --fc-metin-ikincil: #64748B;
  --fc-vurgu: #0284C7;
  --fc-kenar-ince: #E2E8F0;
  --fc-kenar-orta: #CBD5E1;

  /* Kanal Renkleri (Havacılık Rapor Kaynakları) */
  --fc-kanal-pegasus: #F59E0B;
  --fc-kanal-ajet: #DC2626;
  --fc-kanal-sunexpress: #EA580C;
  --fc-kanal-biletbank: #2563EB;
  /* THY: AJet zaten kirmizi; ayirt edilsin diye koyu bordo. */
  --fc-kanal-thy: #9F1239;

  /* Finansal Durum Renkleri */
  --fc-kar: #059669;
  --fc-zarar: #DC2626;
  --fc-bekleyen: #D97706;

  /* Tablo ve Bar Ölçüleri */
  --fc-satir-boyu: 38px;
  --fc-ust-boyu: 46px;

  /* MudBlazor Light Değişkenleri */
  --mud-palette-surface: #FFFFFF;
  --mud-palette-background: #F0F4F8;
  --mud-palette-background-grey: #F1F5F9;
  --mud-palette-text-primary: #0F172A;
  --mud-palette-text-secondary: #64748B;
  --mud-palette-lines-default: #E2E8F0;
  --mud-palette-table-lines: #E2E8F0;
  --mud-palette-divider: #E2E8F0;
  --mud-palette-action-default: #64748B;
  --mud-palette-primary: #0284C7;
  --mud-palette-success: #059669;
  --mud-palette-warning: #D97706;
  --mud-palette-error: #DC2626;
  --mud-palette-info: #0284C7;
  --mud-drawer-width-left: 240px;
  --mud-drawer-width: 240px;
}

/* --------------------------------------------------------------------------
   KOYU TEMA (KOKPİT GECE MODU & MUDBLAZOR DEĞİŞKENLERİNİ EZME)
   -------------------------------------------------------------------------- */
html.fc-koyu {
  --fc-sidebar: #091322;
  --fc-sidebar-kenar: #14233A;
  --fc-sidebar-hover: #14233A;
  --fc-sidebar-aktif: #1C2E46;

  --fc-zemin: #060D17;
  --fc-kart: #0E1A2B;
  --fc-ust: #0E1A2B;
  --fc-ust-kenar: #1C2E46;
  --fc-ust-yazi: #F1F5F9;
  --fc-metin-ana: #F1F5F9;
  --fc-metin-ikincil: #94A3B8;
  --fc-vurgu: #38BDF8;
  --fc-kenar-ince: #1C2E46;
  --fc-kenar-orta: #2A4160;

  --fc-kar: #10B981;
  --fc-zarar: #F87171;
  --fc-bekleyen: #FBBF24;

  /* MudBlazor Koyu Değişkenleri Tam Override */
  --mud-palette-surface: #0E1A2B !important;
  --mud-palette-background: #060D17 !important;
  --mud-palette-background-grey: #14233A !important;
  --mud-palette-text-primary: #F1F5F9 !important;
  --mud-palette-text-secondary: #94A3B8 !important;
  --mud-palette-lines-default: #1C2E46 !important;
  --mud-palette-table-lines: #1C2E46 !important;
  --mud-palette-divider: #1C2E46 !important;
  --mud-palette-action-default: #94A3B8 !important;
  --mud-palette-primary: #38BDF8 !important;
  --mud-palette-success: #10B981 !important;
  --mud-palette-warning: #F59E0B !important;
  --mud-palette-error: #F87171 !important;
  --mud-palette-info: #38BDF8 !important;
}

body {
  background-color: var(--fc-zemin) !important;
  color: var(--fc-metin-ana) !important;
}

/* --------------------------------------------------------------------------
   KENAR ÇUBUĞU (KOKPİT LACİVERTİ & DARALTMA SİSTEMİ)
   -------------------------------------------------------------------------- */
.fc-yan {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--fc-sidebar);
  color: var(--fc-sidebar-yazi);
  user-select: none;
  overflow-x: hidden;
}

.fc-marka {
  display: flex;
  align-items: center;
  gap: 10px;
  height: var(--fc-ust-boyu);
  min-height: var(--fc-ust-boyu);
  padding: 0 14px;
  border-bottom: 1px solid var(--fc-sidebar-kenar);
  background: rgba(0, 0, 0, 0.15);
}

.fc-marka-ikon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: linear-gradient(135deg, #0284C7, #0369A1);
  color: #FFFFFF;
  box-shadow: 0 2px 6px rgba(2, 132, 199, 0.35);
  flex-shrink: 0;
}

.fc-marka-ad {
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #F8FAFC;
  white-space: nowrap;
}

.fc-marka-alt {
  font-size: 11px;
  color: #64748B;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
}

/* Navigasyon Menüsü */
.fc-menu {
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.fc-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  color: var(--fc-sidebar-yazi);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  transition: background 0.12s ease, color 0.12s ease;
  position: relative;
}

/* Menu grubu (Ayarlar). Katlanabilir olmasi icin <details> kullanildi;
   dil secicide de ayni desen var, tarayici destegi icin JS gerekmiyor. */
.fc-menu-grup > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  color: var(--fc-sidebar-yazi);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  list-style: none;
  transition: background 0.12s ease;
}

.fc-menu-grup > summary::-webkit-details-marker { display: none; }
.fc-menu-grup > summary:hover { background: var(--fc-sidebar-hover); }

.fc-menu-ok {
  margin-left: auto;
  font-size: 15px;
  line-height: 1;
  opacity: 0.6;
  transition: transform 0.15s ease;
}

.fc-menu-grup[open] > summary .fc-menu-ok { transform: rotate(90deg); }

/* Grup icindeki maddeler ikon hizasindan girintili baslar. */
.fc-menu-grup > a { margin-left: 12px; }

/* 🚨 Dar kenar cubugunda metin gizleniyor; girinti ve ok da gitmeli, yoksa
   ikonlar hizasindan kayar ve ok tek basina anlamsiz durur. */
html.fc-dar .fc-menu-grup > a { margin-left: 0; }
html.fc-dar .fc-menu-ok { display: none; }

.fc-menu a:hover {
  background: var(--fc-sidebar-hover);
  color: #F8FAFC;
}

.fc-menu a.etkin {
  background: var(--fc-sidebar-aktif);
  color: #FFFFFF;
  font-weight: 600;
}

.fc-menu a.etkin::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--fc-sidebar-vurgu);
  box-shadow: 0 0 8px var(--fc-sidebar-vurgu);
}

.fc-menu a .mud-icon-root {
  font-size: 18px;
  flex: none;
  color: var(--fc-sidebar-ikon);
  transition: color 0.12s ease;
}

.fc-menu a:hover .mud-icon-root {
  color: #CBD5E1;
}

.fc-menu a.etkin .mud-icon-root {
  color: var(--fc-sidebar-ikon-aktif);
}

/* Masaüstü Çekmece Boyut ve Daraltma Kontrolü (>= 960px) */
@media (min-width: 960px) {
  .fc-mud-drawer {
    width: 240px !important;
    min-width: 240px !important;
    transition: width 0.2s ease-in-out !important;
    overflow-x: hidden !important;
    border-right: 1px solid var(--fc-sidebar-kenar) !important;
  }

  .mud-main-content {
    margin-left: 240px !important;
    transition: margin-left 0.2s ease-in-out !important;
  }

  /* html.fc-dar (Daraltılmış Menü 64px) */
  html.fc-dar {
    --mud-drawer-width-left: 64px;
    --mud-drawer-width: 64px;
  }

  html.fc-dar .fc-mud-drawer {
    width: 64px !important;
    min-width: 64px !important;
  }

  html.fc-dar .mud-main-content {
    margin-left: 64px !important;
  }

  html.fc-dar .fc-yan {
    width: 64px !important;
  }

  html.fc-dar .fc-menu a {
    justify-content: center !important;
    padding: 8px 0 !important;
  }

  html.fc-dar .fc-etiket-metin,
  html.fc-dar .fc-marka-yazi {
    display: none !important;
  }

  /* Daraltılmışken tek kimlik simgedir; geniş menüde gizli olan kutu burada açılır. */
  html.fc-dar .fc-marka-ikon {
    display: flex !important;
  }

  html.fc-dar .fc-marka {
    justify-content: center;
    padding: 0;
  }
}

/* Mobilde ve Tablette Kenar Çubuğu ve İçerik Boşluğu (< 960px) */
@media (max-width: 959px) {
  .mud-main-content,
  html.fc-dar .mud-main-content {
    margin-left: 0 !important;
  }

  /* 🚨 KAYMA "left" ILE, "transform" ILE DEGIL.
     transform tartismali: MudBlazor cekmeceyi kendi kurallariyla oteliyor ve
     CSS'ten ezmek defalarca tutmadi (ozgullugu yukselttim, !important ekledim,
     yine kazanamadi - sebebi kesin tespit edilemedi). left'e MudBlazor hic
     dokunmuyor, dolayisiyla yarisacak kimse yok. transform ise JS'te satir ici
     + important ile notrlestiriliyor (fcYanNotrle).

     Gizlemeyi de MudBlazor yapiyor: responsive cekmece kucuk ekranda
     ".mud-drawer-responsive.mud-drawer-md.mud-drawer--initial" kuraliyla
     display:none !important aliyor ve Open="true" sabit oldugu icin o
     durumdan hic cikmiyor. Ozgullugu yeterli kural gerekiyor: html + kendi
     sinifimiz bes kez = (0,5,1), MudBlazor'unki (0,5,0). */
  html .fc-mud-drawer.fc-mud-drawer.fc-mud-drawer.fc-mud-drawer.fc-mud-drawer {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    height: 100% !important;
    width: 264px !important;
    max-width: 82vw !important;
    left: -280px;
    transition: left 0.2s ease-in-out;
    z-index: 1400;
    border-right: 1px solid var(--fc-sidebar-kenar);
  }

  html.fc-yan-acik .fc-mud-drawer.fc-mud-drawer.fc-mud-drawer.fc-mud-drawer.fc-mud-drawer {
    left: 0;
  }

  .fc-mud-drawer .fc-yan {
    height: 100%;
    overflow-y: auto;
  }

  /* Perde: menu acikken arkasi karartilir, dokununca kapanir. */
  .fc-yan-perde {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1300;
  }

  html.fc-yan-acik .fc-yan-perde { display: block; }

  /* Masaustunden kalan "dar mod" cerezi telefonda menuyu kirpmasin. */
  html.fc-dar .fc-mud-drawer { width: 264px !important; }
}

/* --------------------------------------------------------------------------
   ÜST BAR & KOKPİT KONTROL ALANI
   -------------------------------------------------------------------------- */
.fc-ust-bar {
  position: sticky;
  top: 0;
  z-index: 30;
  height: var(--fc-ust-boyu);
  min-height: var(--fc-ust-boyu);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px;
  background: var(--fc-ust);
  color: var(--fc-ust-yazi);
  border-bottom: 1px solid var(--fc-ust-kenar);
}

.fc-ust-sol {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.fc-ust-sag {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fc-ust-baslik {
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--fc-metin-ana);
}

.fc-ikon-dugme {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 6px;
  cursor: pointer;
  color: var(--fc-metin-ikincil);
  transition: all 0.12s ease;
}

.fc-ikon-dugme:hover {
  background: rgba(148, 163, 184, 0.12);
  color: var(--fc-metin-ana);
  border-color: var(--fc-kenar-ince);
}

/* Tema Değiştirme İkon Gösterimi (Saf CSS) */
html:not(.fc-koyu) .fc-tema-ikon-gunes {
  display: none !important;
}
html.fc-koyu .fc-tema-ikon-ay {
  display: none !important;
}

.fc-kullanici-etiket {
  font-size: 12px;
  font-weight: 500;
  color: var(--fc-metin-ikincil);
  padding: 3px 8px;
  background: rgba(148, 163, 184, 0.1);
  border-radius: 4px;
  border: 1px solid var(--fc-kenar-ince);
  white-space: nowrap;
}

/* Kanal Rozetleri (Hızlı Filtre / Gösterge & Tablo İçi) */
.fc-kanal-rozet-grup {
  display: flex;
  align-items: center;
  gap: 6px;
}

.fc-kanal-rozet {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1.5px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  user-select: none;
  white-space: nowrap;
}

.fc-rozet-pegasus {
  background: rgba(245, 158, 11, 0.12);
  color: #D97706;
  border: 1px solid rgba(245, 158, 11, 0.25);
}

.fc-rozet-ajet {
  background: rgba(220, 38, 38, 0.12);
  color: #DC2626;
  border: 1px solid rgba(220, 38, 38, 0.25);
}

.fc-rozet-sunexpress {
  background: rgba(234, 88, 12, 0.12);
  color: #EA580C;
  border: 1px solid rgba(234, 88, 12, 0.25);
}

.fc-rozet-biletbank {
  background: rgba(37, 99, 235, 0.12);
  color: #2563EB;
  border: 1px solid rgba(37, 99, 235, 0.25);
}

.fc-rozet-thy {
  background: rgba(159, 18, 57, 0.12);
  color: var(--fc-kanal-thy);
  border: 1px solid rgba(159, 18, 57, 0.28);
}

.fc-rozet-nokta {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: currentColor;
  flex-shrink: 0;
}

/* Dil Dropdown (Pure HTML details/summary, devre bağımsız) */
details.fc-dil-dropdown {
  position: relative;
  display: inline-block;
  user-select: none;
}

details.fc-dil-dropdown summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--fc-metin-ikincil);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 6px;
  background: rgba(148, 163, 184, 0.08);
  transition: all 0.12s ease;
}

details.fc-dil-dropdown summary::-webkit-details-marker {
  display: none;
}

details.fc-dil-dropdown summary:hover {
  background: rgba(148, 163, 184, 0.15);
  color: var(--fc-metin-ana);
}

details.fc-dil-dropdown[open] summary {
  border-color: var(--fc-vurgu);
  color: var(--fc-vurgu);
}

.fc-dil-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 50;
  min-width: 110px;
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 4px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.fc-dil-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  color: var(--fc-metin-ana);
  text-decoration: none;
  transition: background 0.12s;
}

.fc-dil-menu a:hover {
  background: rgba(148, 163, 184, 0.12);
}

.fc-dil-menu a.etkin {
  font-weight: 700;
  color: var(--fc-vurgu);
  background: rgba(2, 132, 199, 0.08);
}

/* --------------------------------------------------------------------------
   FİNANSAL TABLO MİMARİSİ (GENEL)
   -------------------------------------------------------------------------- */
.fc-tablo {
  background: var(--fc-kart) !important;
  border: 1px solid var(--fc-kenar-ince) !important;
  border-radius: 8px;
  overflow: hidden;
}

.fc-tablo .mud-table-container {
  overflow-x: auto;
}

.fc-tablo table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  font-variant-numeric: tabular-nums lining-nums;
  background-color: var(--fc-kart) !important;
}

/* Kanal 3.5px Sol Şeritleri (Garantili Render) */
.fc-tablo tr.fc-kanal-serit-pegasus > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-pegasus > td:first-child {
  border-left: 3.5px solid var(--fc-kanal-pegasus) !important;
  box-shadow: inset 3.5px 0 0 var(--fc-kanal-pegasus) !important;
}

.fc-tablo tr.fc-kanal-serit-ajet > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-ajet > td:first-child {
  border-left: 3.5px solid var(--fc-kanal-ajet) !important;
  box-shadow: inset 3.5px 0 0 var(--fc-kanal-ajet) !important;
}

.fc-tablo tr.fc-kanal-serit-sunexpress > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-sunexpress > td:first-child {
  border-left: 3.5px solid var(--fc-kanal-sunexpress) !important;
  box-shadow: inset 3.5px 0 0 var(--fc-kanal-sunexpress) !important;
}

.fc-tablo tr.fc-kanal-serit-biletbank > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-biletbank > td:first-child {
  border-left: 3.5px solid var(--fc-kanal-biletbank) !important;
  box-shadow: inset 3.5px 0 0 var(--fc-kanal-biletbank) !important;
}

.fc-tablo tr.fc-kanal-serit-thy > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-thy > td:first-child {
  border-left: 3.5px solid var(--fc-kanal-thy) !important;
  box-shadow: inset 3.5px 0 0 var(--fc-kanal-thy) !important;
}

/* PNR Ağaç ve Hiyerarşi Bağlantıları */
.fc-pnr-hucre {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  font-size: 11.5px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
}

.fc-pnr-kok {
  display: inline-flex;
  align-items: center;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(148, 163, 184, 0.12);
  color: var(--fc-metin-ana);
  font-weight: 600;
  letter-spacing: 0.03em;
}

.fc-pnr-dal {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #94A3B8;
  font-weight: 500;
  font-size: 11px;
}

.fc-pnr-cizgi {
  color: #94A3B8;
  font-weight: bold;
}

/* Parkur & Uçuş Bilgisi */
.fc-parkur-kapsayici {
  display: flex;
  align-items: center;
  gap: 6px;
}

.fc-parkur-metin {
  font-weight: 600;
  font-size: 12px;
}

.fc-parkur-detay {
  font-size: 11px;
  color: var(--fc-metin-ikincil);
  white-space: nowrap;
  flex-shrink: 0;
}

.fc-yolcu-metin {
  font-weight: 500;
}

/* Para ve Tutar */
.fc-tutar {
  font-variant-numeric: tabular-nums lining-nums;
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   1. MASAÜSTÜ VE TABLET TABLO DÜZENİ (>= 600px — 768px ve 1280px)
   -------------------------------------------------------------------------- */
.fc-tablo {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

.fc-tablo .mud-table-container {
  overflow-x: auto !important;
  width: 100% !important;
}

@media (min-width: 600px) {
  .fc-tablo thead,
  .fc-tablo .mud-table-head {
    display: table-header-group !important;
    height: 34px !important;
  }

  /* Başlık Hücreleri (~35px) */
  .fc-tablo .mud-table-head .mud-table-cell {
    display: table-cell !important;
    background-color: rgba(148, 163, 184, 0.08) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 4px 8px !important;
    height: 34px !important;
    max-height: 34px !important;
    line-height: 26px !important;
    color: var(--fc-metin-ikincil) !important;
    border-bottom: 1px solid var(--fc-kenar-ince) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Satır Yüksekliği: 38px */
  .fc-tablo .mud-table-body .mud-table-row {
    display: table-row !important;
    height: var(--fc-satir-boyu) !important;
    max-height: var(--fc-satir-boyu) !important;
    min-height: var(--fc-satir-boyu) !important;
    transition: background-color 0.1s ease;
    background-color: var(--fc-kart) !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .fc-tablo .mud-table-body .mud-table-row:hover {
    background-color: rgba(2, 132, 199, 0.04) !important;
  }

  html.fc-koyu .fc-tablo .mud-table-body .mud-table-row:hover {
    background-color: rgba(56, 189, 248, 0.06) !important;
  }

  /* Gövde Hücreleri: 38px */
  .fc-tablo .mud-table-body .mud-table-cell {
    display: table-cell !important;
    height: var(--fc-satir-boyu) !important;
    max-height: var(--fc-satir-boyu) !important;
    padding: 2px 8px !important;
    font-size: 12.5px !important;
    line-height: 1.2 !important;
    border-bottom: 1px solid var(--fc-kenar-ince) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
    color: var(--fc-metin-ana) !important;
  }

  .fc-yolcu-metin {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    min-width: 0 !important;
  }

  .fc-parkur-kapsayici {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
  }

  .fc-parkur-metin {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
    flex-shrink: 1 !important;
  }

  .fc-tutar {
    text-align: right !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .fc-satis-hucre {
    text-align: right !important;
    white-space: nowrap !important;
  }
}

/* ── TABLET EKRAN KALİBRASYONU (600px - 959px — 768px) ───────────────── */
@media (min-width: 600px) and (max-width: 959px) {
  .fc-tablo table {
    table-layout: fixed !important;
    width: 960px !important;
    min-width: 960px !important;
  }

  /* 🚨 SecimSutunu (SelectColumn) HeaderClass/CellClass KABUL ETMIYOR - verilirse
     calisma aninda patlar. Bu yuzden sinifla degil, konumla hedefleniyor.
     .mud-data-grid yalniz Biletler ekraninda var; Kartlar/Firmalar MudSimpleTable. */
  .mud-data-grid thead th:first-child,
  .mud-data-grid tbody td:first-child { width: 44px !important; min-width: 44px !important; max-width: 44px !important; padding: 0 !important; text-align: center !important; }
  .fc-tablo .fc-col-tarih { width: 58px !important; min-width: 58px !important; max-width: 58px !important; }
  .fc-tablo .fc-col-kanal { width: 94px !important; min-width: 94px !important; max-width: 94px !important; }
  .fc-tablo .fc-col-pnr { width: 72px !important; min-width: 72px !important; max-width: 72px !important; }
  .fc-tablo .fc-col-biletno { width: 120px !important; min-width: 120px !important; max-width: 120px !important; font-variant-numeric: tabular-nums !important; }
  .fc-tablo .fc-col-yolcu { width: 130px !important; min-width: 130px !important; max-width: 130px !important; }
  .fc-tablo .fc-col-parkur { width: 120px !important; min-width: 120px !important; max-width: 120px !important; }
  .fc-tablo .fc-col-maliyet { width: 168px !important; min-width: 168px !important; max-width: 168px !important; text-align: right !important; }
  .fc-tablo .fc-col-firma { width: 82px !important; min-width: 82px !important; max-width: 82px !important; }
  .fc-tablo .fc-col-satis { width: 88px !important; min-width: 88px !important; max-width: 88px !important; text-align: right !important; }
  .fc-tablo .fc-col-kar { width: 86px !important; min-width: 86px !important; max-width: 86px !important; text-align: right !important; }
}

/* ── MASAÜSTÜ GENİŞ EKRAN KALİBRASYONU (>= 960px — 1280px) ───────────── */
@media (min-width: 960px) {
  .fc-tablo table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 100% !important;
  }

  /* 🚨 SecimSutunu (SelectColumn) HeaderClass/CellClass KABUL ETMIYOR - verilirse
     calisma aninda patlar. Bu yuzden sinifla degil, konumla hedefleniyor.
     .mud-data-grid yalniz Biletler ekraninda var; Kartlar/Firmalar MudSimpleTable. */
  .mud-data-grid thead th:first-child,
  .mud-data-grid tbody td:first-child { width: 44px !important; min-width: 44px !important; max-width: 44px !important; padding: 0 !important; text-align: center !important; }
  .fc-tablo .fc-col-tarih { width: 58px !important; min-width: 58px !important; max-width: 58px !important; }
  .fc-tablo .fc-col-kanal { width: 94px !important; min-width: 94px !important; max-width: 94px !important; }
  .fc-tablo .fc-col-pnr { width: 72px !important; min-width: 72px !important; max-width: 72px !important; }
  .fc-tablo .fc-col-biletno { width: 120px !important; min-width: 120px !important; max-width: 120px !important; font-variant-numeric: tabular-nums !important; }
  .fc-tablo .fc-col-yolcu { width: 124px !important; min-width: 124px !important; max-width: 124px !important; }
  .fc-tablo .fc-col-parkur { width: auto !important; min-width: 120px !important; }
  .fc-tablo .fc-col-maliyet { width: 168px !important; min-width: 168px !important; max-width: 168px !important; text-align: right !important; }
  .fc-tablo .fc-col-firma { width: 82px !important; min-width: 82px !important; max-width: 82px !important; }
  .fc-tablo .fc-col-satis { width: 88px !important; min-width: 88px !important; max-width: 88px !important; text-align: right !important; }
  .fc-tablo .fc-col-kar { width: 86px !important; min-width: 86px !important; max-width: 86px !important; text-align: right !important; }
}

/* --------------------------------------------------------------------------
   2. MOBİL YIĞILMIŞ / KART DÜZENİ (< 600px — 375px)
   -------------------------------------------------------------------------- */
@media (max-width: 599px) {
  .fc-ust-bar {
    padding: 0 10px;
  }

  .fc-kanal-rozet-grup {
    display: none;
  }

  /* 🚨 Başlık bloğu mobilde tamamen gizlenir - Başlık Yüksekliği 0px */
  .fc-tablo thead,
  .fc-tablo .mud-table-head,
  .fc-tablo thead tr,
  .fc-tablo .mud-table-head .mud-table-cell {
    display: none !important;
    height: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    visibility: hidden !important;
    overflow: hidden !important;
  }

  .fc-tablo table {
    table-layout: auto !important;
    width: 100% !important;
  }

  /* Mobil modda tüm sütun sınıfları serbesttir - Kırpılma 0 */
  .fc-tablo .mud-table-cell,
  .fc-tablo td,
  .fc-tablo th,
  .fc-tablo .fc-col-tarih,
  .fc-tablo .fc-col-kanal,
  .fc-tablo .fc-col-pnr,
  .fc-tablo .fc-col-biletno,
  .fc-tablo .fc-col-yolcu,
  .fc-tablo .fc-col-parkur,
  .fc-tablo .fc-col-maliyet,
  .fc-tablo .fc-col-satis {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .fc-tablo .mud-table-body .mud-table-row {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    margin-bottom: 8px !important;
    border: 1px solid var(--fc-kenar-ince) !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
    background: var(--fc-kart) !important;
  }

  .fc-yolcu-metin,
  .fc-parkur-metin,
  .fc-parkur-kapsayici {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .fc-tablo .mud-table-cell {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 4px 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08) !important;
    font-size: 12.5px !important;
  }

  .fc-tablo .mud-table-cell:last-child {
    border-bottom: none !important;
  }

  .fc-tablo .mud-table-body .mud-table-cell .fc-tutar {
    text-align: right !important;
  }

  .fc-satis-hucre {
    text-align: right !important;
  }
}

/* --------------------------------------------------------------------------
   3. İÇE AKTARIM & YÜKLEME ALANI
   -------------------------------------------------------------------------- */
.fc-yukleme-alani {
  border: 2px dashed var(--fc-kenar-ince);
  border-radius: 12px;
  background: var(--fc-kart);
  text-align: center;
  padding: 36px 20px;
  transition: all 0.15s ease;
}

.fc-yukleme-alani:hover {
  border-color: var(--fc-vurgu);
  background: rgba(2, 132, 199, 0.03);
}

.fc-yukleme-ikon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(2, 132, 199, 0.08);
}

.fc-onizleme-kutu {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 12px 14px;
  transition: all 0.15s ease;
}

.fc-onizleme-kutu.fc-kutu-yeni {
  background: rgba(5, 150, 105, 0.05);
  border-color: rgba(5, 150, 105, 0.3);
}

.fc-onizleme-kutu.fc-kutu-mukerrer {
  background: rgba(217, 119, 6, 0.05);
  border-color: rgba(217, 119, 6, 0.3);
}

.fc-mono { font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------------
   4. FİYATLAMA, SEÇİM BARI & FİRMA ATAMA MİMARİSİ
   -------------------------------------------------------------------------- */
.fc-secim-bari {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(10, 25, 47, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #FFFFFF;
  border: 1px solid rgba(56, 189, 248, 0.3);
  border-radius: 9999px;
  padding: 6px 14px 6px 18px;
  box-shadow: 0 16px 36px -6px rgba(0, 0, 0, 0.5), 0 0 20px rgba(2, 132, 199, 0.25);
  font-size: 13px;
  animation: fc-slide-up 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fc-slide-up {
  from {
    opacity: 0;
    transform: translate(-50%, 16px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

.fc-secim-sayac {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #E2E8F0;
}

.fc-secim-sayac-rozet {
  background: rgba(56, 189, 248, 0.2);
  color: #38BDF8;
  padding: 2px 7px;
  border-radius: 9999px;
  font-size: 11.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  border: 1px solid rgba(56, 189, 248, 0.3);
}

.fc-secim-kapat {
  border: 0;
  background: rgba(255, 255, 255, 0.08);
  color: #94A3B8;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.12s ease;
  margin-left: 2px;
}

.fc-secim-kapat:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #FFFFFF;
}

/* Satış Hücre İçi Girdi */
.fc-satis-hucre {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  width: 100%;
}

.fc-satis-girdi {
  width: 84px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 4px;
  padding: 2px 6px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--fc-metin-ana);
  transition: all 0.12s ease;
}

/* Okunamayan girdi: hucre kirmizi kalir, eski fiyat korunmustur.
   Kullanici bir seyi sildigini sanmasin diye deger geri yazilir. */
.fc-satis-girdi.hatali,
.fc-satis-girdi.hatali:hover {
  border-color: var(--fc-zarar);
  background: rgba(220, 38, 38, 0.06);
}

.fc-satis-girdi:hover {
  border-color: var(--fc-kenar-ince);
  background: var(--fc-kart);
}

.fc-satis-girdi:focus {
  border-color: var(--fc-vurgu);
  background: var(--fc-kart);
  box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.15);
  outline: none;
}

.fc-satis-girdi::placeholder {
  color: var(--fc-metin-ikincil);
  opacity: 0.5;
}

/* Fiyat Kaynağı Etiketleri */
.fc-fiyat-etiket {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 1.5px 5px;
  border-radius: 3px;
  background: rgba(148, 163, 184, 0.15);
  color: var(--fc-metin-ikincil);
  white-space: nowrap;
}

/* 🚨 Elle girilmiş fiyat etiketi: belirgin amber/uyarı rengi */
.fc-fiyat-etiket.elle {
  background: rgba(245, 158, 11, 0.18);
  color: #D97706;
  border: 1px solid rgba(245, 158, 11, 0.35);
  font-weight: 800;
}

/* Kâr ve Marj Hücresi */
.fc-kar-hucre {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 1.15;
}

.fc-kar-hucre.arti {
  color: var(--fc-kar);
}

.fc-kar-hucre.eksi {
  color: var(--fc-zarar);
}

.fc-marj {
  display: block;
  font-size: 10px;
  font-weight: 600;
  opacity: 0.75;
}

/* Firma Atama Butonu */
.fc-firma-dugme {
  border: 1px dashed var(--fc-kenar-ince);
  background: transparent;
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 11.5px;
  color: var(--fc-metin-ikincil);
  cursor: pointer;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: all 0.12s ease;
}

.fc-firma-dugme:hover {
  border-style: solid;
  border-color: var(--fc-vurgu);
  color: var(--fc-vurgu);
  background: rgba(2, 132, 199, 0.05);
}

.fc-firma-dugme.dolu {
  border-style: solid;
  border-color: var(--fc-kenar-ince);
  background: rgba(148, 163, 184, 0.08);
  color: var(--fc-metin-ana);
  font-weight: 600;
}

/* Toplu Fiyatlama Canlı Önizleme Kartı */
.fc-onizleme {
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-line;
  background: rgba(148, 163, 184, 0.06);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 6px;
  padding: 10px 12px;
  color: var(--fc-metin-ana);
  font-variant-numeric: tabular-nums;
}

/* Boş Durum Kartı (Empty State) */
.fc-bos-kart {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 10px;
  color: var(--fc-metin-ikincil);
}

/* --------------------------------------------------------------------------
   5. KART MODÜLÜ, ROZETLER & LİMİT GÖSTERGELERİ
   -------------------------------------------------------------------------- */
.fc-kart-tur {
  display: inline-flex;
  align-items: center;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 2px 7px;
  border-radius: 4px;
  border: 1px solid transparent;
  white-space: nowrap;
  line-height: 1.2;
}

.fc-kart-tur.sirket {
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
  border-color: rgba(2, 132, 199, 0.28);
}

.fc-kart-tur.personel {
  background: rgba(139, 92, 246, 0.12);
  color: #8B5CF6;
  border-color: rgba(139, 92, 246, 0.28);
}

.fc-kart-tur.musteri {
  background: rgba(217, 119, 6, 0.14);
  color: #D97706;
  border-color: rgba(217, 119, 6, 0.32);
}

.fc-kart-tur.mutabik {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
  border-color: rgba(5, 150, 105, 0.28);
}

.fc-kart-tur.fark {
  background: rgba(220, 38, 38, 0.14);
  color: #DC2626;
  border-color: rgba(220, 38, 38, 0.32);
  font-weight: 800;
}

.fc-kart-link {
  color: var(--fc-vurgu);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.12s ease;
}

.fc-kart-link:hover {
  text-decoration: underline;
  color: #0369A1;
}

/* Limit Doluluk Çubuğu */
.fc-limit-kapsayici {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.fc-limit-cubuk {
  width: 100%;
  height: 6px;
  background: rgba(148, 163, 184, 0.2);
  border-radius: 9999px;
  overflow: hidden;
}

.fc-limit-doluluk {
  height: 100%;
  border-radius: 9999px;
  background: var(--fc-vurgu);
  transition: width 0.3s ease;
}

.fc-limit-doluluk.orta {
  background: #D97706;
}

.fc-limit-doluluk.yuksek {
  background: #DC2626;
}

/* Bölüm Kartları (Keşif & Onay) */
.fc-bolum-kapsayici {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 10px;
  overflow: hidden;
}

.fc-onay-karti {
  border-color: rgba(217, 119, 6, 0.35);
  background: rgba(217, 119, 6, 0.02);
}

.fc-kesif-karti {
  border-color: rgba(2, 132, 199, 0.35);
  background: rgba(2, 132, 199, 0.02);
}

/* --------------------------------------------------------------------------
   6. BÜTÜNSEL YENİDEN TASARIM (TASARIM 9 & 28) — GÖSTERGELER & EYLEM MERKEZİ
   -------------------------------------------------------------------------- */
/* Kokpit Temel Gösterge Kutuları (TASARIM 28) */
.fc-gosterge-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 10px;
  margin-bottom: 8px;
}

.fc-gosterge-izgara.fc-tek-kutu {
  max-width: 320px;
}

.fc-gosterge-kart {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 82px;
  transition: all 0.15s ease;
}

.fc-gosterge-kart:hover {
  border-color: var(--fc-kenar-orta);
}

.fc-gosterge-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.fc-gosterge-baslik {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fc-metin-ikincil);
}

.fc-gosterge-rozet {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.fc-gosterge-rozet.cikar {
  color: var(--mud-palette-warning);
  background: rgba(217, 119, 6, 0.12);
}

.fc-gosterge-rozet.sonuc {
  color: var(--fc-kar);
  background: rgba(5, 150, 105, 0.14);
  font-weight: 800;
}

.fc-gosterge-rozet.ayrik {
  color: var(--fc-metin-ikincil);
  background: rgba(148, 163, 184, 0.14);
}

.fc-gosterge-deger {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  margin: 2px 0;
  color: var(--fc-metin-ana);
  white-space: nowrap;
}

.fc-gosterge-alt {
  font-size: 11px;
  color: var(--fc-metin-ikincil);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Çıkarılan Adım: Ödenecek KDV */
.fc-gosterge-kart.fc-gosterge-cikar {
  border-left: 3px solid rgba(217, 119, 6, 0.7);
  background: rgba(217, 119, 6, 0.02);
}

/* Zincir Sonucu: Net Kâr — Öne Çıkan Sonuç Kartı */
.fc-gosterge-kart.fc-gosterge-sonuc {
  border: 1.5px solid rgba(5, 150, 105, 0.4);
  background: rgba(5, 150, 105, 0.04);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.05);
}

.fc-gosterge-kart.fc-gosterge-sonuc .fc-gosterge-baslik {
  color: var(--fc-kar);
}

.fc-gosterge-kart.fc-gosterge-sonuc .fc-gosterge-deger {
  font-size: 22px;
  color: var(--fc-kar);
}

/* Zincir Dışı: Kart Borçları — Ayrı Bakiye */
.fc-gosterge-kart.fc-gosterge-ayrik {
  border-style: dashed;
}

/* Ay Kapanışı Eylem Kartları (Action Hub - TASARIM 27) */
.fc-is-kapsayici {
  /* Kart sayisi YETKIYE gore 1 ile 5 arasinda degisir; sabit kirilim tutmaz.
     🚨 Flex-wrap denendi ve son satirda tek kalan kart, ustundeki kartlardan
     GENIS cikiyordu (1280'de 4x241 + 1x360): flex'te her satir kendi icinde
     buyudugu icin yalniz kalan kart max-width'e kadar seriliyordu - ragged
     bir kenar. Grid'de sutun genisligi TUM satirlarda ayni oldugu icin son
     satirdaki kart ilk sutunun altina, ayni genislikte oturur.
     Olculdu (8 Eyl): iki duzen 1632/1152/992 x 1-5 kart senaryolarinda
     yalniz bu iki durumda ayrisiyor, digerlerinde birebir ayni. */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
  margin-bottom: 24px;
}

.fc-is-kart {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  transition: all 0.15s ease;
  text-decoration: none !important;
  color: var(--fc-metin-ana);
  max-width: 360px;
  min-width: 0;
}

@media (max-width: 600px) {
  .fc-is-kart {
    max-width: none;
  }
}

.fc-is-kart:hover {
  border-color: var(--fc-vurgu);
  background: rgba(2, 132, 199, 0.02);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.fc-is-kart.uyari {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(245, 158, 11, 0.02);
}

.fc-is-kart.uyari:hover {
  border-color: #D97706;
}

.fc-is-kart.tamam {
  border-color: rgba(5, 150, 105, 0.25);
  background: rgba(5, 150, 105, 0.02);
}

.fc-is-sol {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.fc-is-ikon-kutu {
  width: 34px;
  height: 34px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.fc-is-ikon-kutu.mavi {
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
}

.fc-is-ikon-kutu.sari {
  background: rgba(245, 158, 11, 0.14);
  color: #D97706;
}

.fc-is-ikon-kutu.yesil {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
}

.fc-is-ikon-kutu.mor {
  background: rgba(139, 92, 246, 0.12);
  color: #8B5CF6;
}

.fc-is-ikon-kutu.kirmizi {
  background: rgba(220, 38, 38, 0.12);
  color: #DC2626;
}

/* Hızlı Filtre Çipleri (Biletler Tablo Filtresi) */
.fc-filtre-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  padding: 2px 0;
}

.fc-filtre-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--fc-kenar-ince);
  background: var(--fc-kart);
  color: var(--fc-metin-ikincil);
  transition: all 0.12s ease;
  white-space: nowrap;
}

.fc-filtre-chip:hover {
  border-color: var(--fc-vurgu);
  color: var(--fc-metin-ana);
}

.fc-filtre-chip.etkin {
  background: var(--fc-vurgu);
  color: #FFFFFF;
  border-color: var(--fc-vurgu);
}

.fc-filtre-sayac {
  background: rgba(0, 0, 0, 0.08);
  padding: 1px 6px;
  border-radius: 9999px;
  font-size: 10.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.fc-filtre-chip.etkin .fc-filtre-sayac {
  background: rgba(255, 255, 255, 0.25);
  color: #FFFFFF;
}

/* Alista KDV rozeti — satis fiyati verilirken KDV'li mi degil mi gorunsun. */
.fc-kdv-rozet {
  font-size: 10px;
  font-weight: 700;
  margin-left: 5px;
  padding: 1px 5px;
  border-radius: 4px;
  letter-spacing: .01em;
  white-space: nowrap;
  color: var(--mud-palette-info);
  background: rgba(37, 99, 235, .08);
}
.fc-kdv-rozet.yok {
  font-weight: 600;
  color: var(--mud-palette-text-secondary);
  background: transparent;
  opacity: .38;
  text-decoration: line-through;
}

/* Oturumsuz sayfalarin form girdileri (giris, kayit, parola sifirlama, parola yenileme).
   🚨 Bu sayfalar STATIK SSR; MudBlazor input kullanilamaz, sade <input> stillenir. */
.fc-oturum-kapsayici {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  background-color: var(--fc-zemin);
  box-sizing: border-box;
  position: relative;
}

.fc-oturum-ust-bar {
  width: 100%;
  max-width: 900px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  z-index: 10;
}

.fc-oturum-govde {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 20px 0;
}

.fc-oturum-alt-bilgi {
  font-size: 11.5px;
  color: var(--fc-metin-ikincil);
  opacity: 0.8;
  text-align: center;
  padding: 12px 0 4px;
}

.fc-oturum-kart {
  width: 100%;
  max-width: 420px;
  background: var(--fc-kart) !important;
  border: 1px solid var(--fc-kenar-ince) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.04) !important;
  padding: 36px 32px !important;
  box-sizing: border-box;
}

.fc-oturum-kart.genis {
  max-width: 860px;
  padding: 0 !important;
  overflow: hidden;
}

/* ── Kayıt Ekranı 2-Sütunlu Düzen ────────────────────────────────────── */
.fc-kayit-duzeni {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* 🚨 TELEFONDA FORM ÖNCE GELİR. Tanıtım paneli üstte kalınca ilk alan 770px'e,
   düğme 1062px'e düşüyordu: 812px'lik bir ekranda kullanıcı formu göremeden bir
   ekran boyu kaydırmak zorundaydı. Acente kaydına basan kişi zaten karar
   vermiştir; önce formu görür, tanıtımı isterse aşağıda okur. */
@media (max-width: 767px) {
  .fc-kayit-form-alani { order: 1; }
  .fc-kayit-hero       { order: 2; padding: 28px 24px; }
}

@media (min-width: 768px) {
  .fc-kayit-duzeni {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    min-height: 480px;
  }
}

.fc-kayit-hero {
  background: linear-gradient(145deg, #0A192F 0%, #112240 100%);
  color: #F8FAFC;
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.fc-kayit-hero-madde {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
}

.fc-kayit-hero-ikon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(56, 189, 248, 0.15);
  color: #38BDF8;
  flex-shrink: 0;
}

.fc-kayit-form-alani {
  padding: 36px 32px;
  background: var(--fc-kart);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ── Durum Bildirim Kutuları (Başarı, Hata, Bilgi) ───────────────────── */
.fc-durum-kutu {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 0;
}

.fc-durum-ikon-yuvarlak {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
}

.fc-durum-ikon-yuvarlak.basari {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
}

.fc-durum-ikon-yuvarlak.hata {
  background: rgba(220, 38, 38, 0.12);
  color: #DC2626;
}

.fc-durum-ikon-yuvarlak.bilgi {
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
}

.fc-durum-bilgi-karti {
  background: rgba(148, 163, 184, 0.08);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 12px 14px;
  margin: 16px 0 20px;
  text-align: left;
  width: 100%;
  box-sizing: border-box;
}

.fc-etiket {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--fc-metin-ana);
  margin: 0 0 5px;
}

.fc-girdi {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  margin: 0 0 14px;
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 6px;
  font-size: 13.5px;
  font-family: inherit;
  background: var(--fc-kart);
  color: var(--fc-metin-ana);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  outline: none;
}

.fc-girdi:hover {
  border-color: rgba(148, 163, 184, 0.6);
}

.fc-girdi:focus {
  border-color: var(--fc-vurgu);
  box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.15);
}

.fc-girdi::placeholder {
  color: var(--fc-metin-ikincil);
  opacity: 0.55;
}

.fc-yardim {
  font-size: 11px;
  color: var(--fc-metin-ikincil);
  margin-top: -10px;
  margin-bottom: 14px;
  display: block;
}

/* ── Marka görselleri ────────────────────────────────────────────────
   🚨 İki takım var ve adları tersmiş gibi durur:
      logo-*        → AÇIK mürekkep, KOYU zemin içindir (kenar çubuğu)
      logo-acik-*   → KOYU mürekkep, AÇIK zemin içindir (açık tema)
   Aynısı tam kilit için: tam-koyu = koyu zeminde, tam-acik = açık zeminde. */

.fc-marka-ikon {
  display: none !important;
  background: none !important;
}
.fc-marka-ikon img {
  width: 30px;
  height: 30px;
  display: block;
}

/* Sözcük markası artık metin değil görsel; eski tipografi kuralları geçersiz. */
img.fc-marka-ad {
  height: 26px;
  width: auto;
  display: block;
}

/* Oturumsuz sayfalardaki tam kilit (giriş, kayıt, parola). */
.fc-kilit {
  display: block;
  width: 190px;
  height: auto;
  margin: 0 auto 2px;
}

/* Tema duyarlı gösterim. Koyu tema html.fc-koyu sınıfıyla açılıyor. */
.fc-yalniz-koyu-tema { display: none; }
html.fc-koyu .fc-yalniz-acik-tema { display: none; }
html.fc-koyu .fc-yalniz-koyu-tema { display: block; }

/* ── Oturum ekranları: gönderiliyor durumu ve parola gücü ───────────────────
   🚨 Bu ekranlar statik SSR; davranış wwwroot/oturum.js içinde, Razor'da değil. */

/* Düğme çalışırken: yazı kaybolur, yerine dönen halka gelir. Genişlik
   DEĞİŞMEZ — düğme küçülüp büyürse sayfa zıplar. */
.fc-calisiyor {
  position: relative;
  pointer-events: none;
}
.fc-calisiyor > * {
  visibility: hidden;
}
.fc-calisiyor::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border: 2px solid rgba(255, 255, 255, .35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: fc-doner .6s linear infinite;
}
@keyframes fc-doner {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .fc-calisiyor::after { animation-duration: 2s; }
}

/* Parola gücü çubuğu. */
.fc-guc {
  margin: -10px 0 14px;
}
.fc-guc.bos {
  visibility: hidden;
}
.fc-guc-ray {
  height: 4px;
  border-radius: 999px;
  background: var(--fc-kenar-ince);
  overflow: hidden;
}
.fc-guc-dolgu {
  height: 100%;
  width: 0;
  border-radius: 999px;
  transition: width .18s ease, background-color .18s ease;
}
.fc-guc-dolgu.seviye-1 { width: 25%;  background: var(--mud-palette-error); }
.fc-guc-dolgu.seviye-2 { width: 50%;  background: var(--mud-palette-warning); }
.fc-guc-dolgu.seviye-3 { width: 75%;  background: var(--mud-palette-info); }
.fc-guc-dolgu.seviye-4 { width: 100%; background: var(--mud-palette-success); }

.fc-guc-yazi {
  display: block;
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--fc-metin-ikincil);
}


/* Secim sutunundaki kutucuk: satir yuksekligini (38px) buyutmesin. */
.mud-data-grid tbody td:first-child .mud-checkbox,
.mud-data-grid thead th:first-child .mud-checkbox { margin: 0; }
.mud-data-grid tbody td:first-child .mud-icon-button,
.mud-data-grid thead th:first-child .mud-icon-button { padding: 4px; }


/* ── Bilet aşaması ───────────────────────────────────────────────────────────
   Aşama SAKLANMAZ, uçuş tarihinden türer (bkz. Bilet.Asama). Tabloda 12. sütuna
   yer yok — içerik zaten 456px taşıyor — bu yüzden satır rengiyle anlatılıyor.
   🚨 Seçili satır mavisi bunların ÜSTÜNE binmeli: seçim anlık bir eylem,
   aşama ise kalıcı bir durum. Sıralama bu yüzden önemli, seçili en sonda. */

/* Faturalandı: iş bitti, toplu işlem dokunmuyor — geri planda dursun. */
.mud-table-row.fc-asama-faturalandi > td {
  background: rgba(100, 116, 139, .07);
  color: var(--fc-metin-ikincil);
}
/* İptal / iade: dikkat çekmeli, para geri gidiyor. */
.mud-table-row.fc-asama-iptal > td {
  background: rgba(220, 38, 38, .05);
}
/* Bekliyor: uçuş henüz olmadı; sessiz bir işaret yeter. */
.mud-table-row.fc-asama-bekliyor > td {
  background: rgba(217, 119, 6, .05);
}

html.fc-koyu .mud-table-row.fc-asama-faturalandi > td { background: rgba(148, 163, 184, .08); }
html.fc-koyu .mud-table-row.fc-asama-iptal > td       { background: rgba(239, 68, 68, .09); }
html.fc-koyu .mud-table-row.fc-asama-bekliyor > td    { background: rgba(245, 158, 11, .08); }

/* Filtre çubuğunda öbek ayıracı. */
.fc-filtre-ayirac {
  width: 1px;
  height: 18px;
  margin: 0 2px;
  background: var(--fc-kenar-ince);
  flex: 0 0 auto;
}

/* ── Seçili satır ────────────────────────────────────────────────────────────
   Toplu fiyatlama ve firma atama secim uzerinden yurudugu icin hangi satirlarin
   secili oldugu BIR BAKISTA gorunmeli; 25 satirda kutucuklari tek tek okumak
   hata kaynagi. Kanal serit rengi solda duruyor, bu yuzden dolgu saydam bir
   vurgu; serit kaybolmuyor. */
.mud-table-row.fc-satir-secili > td {
  background: rgba(2, 132, 199, .10) !important;
}
.mud-table-row.fc-satir-secili:hover > td {
  background: rgba(2, 132, 199, .16) !important;
}
html.fc-koyu .mud-table-row.fc-satir-secili > td {
  background: rgba(56, 189, 248, .16) !important;
}
html.fc-koyu .mud-table-row.fc-satir-secili:hover > td {
  background: rgba(56, 189, 248, .22) !important;
}

/* ── Tehlikeli bölge ─────────────────────────────────────────────────────────
   Veri silme. Sayfanın en altında, kırmızı çerçeveli, kendi başına duran bir
   bölge — yanlışlıkla basılacak bir yerde DEĞİL. */
.fc-tehlike-bolge {
  border: 1px solid rgba(220, 38, 38, .35);
  border-radius: 8px;
  overflow: hidden;
}
.fc-tehlike-baslik {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--mud-palette-error);
  background: rgba(220, 38, 38, .06);
  border-bottom: 1px solid rgba(220, 38, 38, .2);
}
.fc-tehlike-govde {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  flex-wrap: wrap;
}
.fc-tehlike-ad { font-size: 13.5px; font-weight: 700; color: var(--fc-metin-ana); }
.fc-tehlike-aciklama { font-size: 12px; color: var(--fc-metin-ikincil); margin-top: 2px; }

.fc-silinecek { width: 100%; border-collapse: collapse; font-size: 13px; }
.fc-silinecek td { padding: 5px 0; border-bottom: 1px solid var(--fc-kenar-ince); }
.fc-silinecek td:last-child { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.fc-silinecek tr:last-child td { border-bottom: 0; }

/* Havayolu filtresi: iş filtrelerinden AYRI bir eksen olduğu için kendi
   satırında ve marka renkleriyle duruyor — aynı çubuğa karışsaydı hangisinin
   neyle birleştiği anlaşılmazdı. */
.fc-kanal-bar { margin-top: -4px; }
.fc-kanal-chip .fc-rozet-nokta {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
  background: currentColor;
}

/* ── Geniş ekran (≥1600px) sütun dengesi ─────────────────────────────────────
   🚨 SORUN: ≥960 kuralında PARKUR tek esnek sütundu (width:auto) ve artan TÜM
   alanı o yutuyordu — 1280'de 66px alırken 1920'de 706px alıyordu, para
   sütunları 86px'te kalıyordu. Bir tablonun tek esnek sütunu olmamalı.
   ÇÖZÜM: geniş ekranda her sütuna açık genişlik. Artan alan, fixed düzende
   hepsine ORANTILI dağılır; hiçbir sütun tek başına şişmez.
   Ölçülen içerik ihtiyaçları: yolcu 181, parkur 259, maliyet 168, bilet no 115. */
@media (min-width: 1600px) {
  .fc-tablo .fc-col-tarih   { width: 62px  !important; min-width: 62px  !important; max-width: 62px  !important; }
  .fc-tablo .fc-col-kanal   { width: 100px !important; min-width: 100px !important; max-width: 100px !important; }
  .fc-tablo .fc-col-pnr     { width: 96px  !important; min-width: 96px  !important; max-width: 96px  !important; }
  .fc-tablo .fc-col-biletno { width: 126px !important; min-width: 126px !important; max-width: 126px !important; }
  .fc-tablo .fc-col-yolcu   { width: 190px !important; min-width: 190px !important; max-width: 190px !important; }
  .fc-tablo .fc-col-parkur  { width: 250px !important; min-width: 250px !important; max-width: 250px !important; }
  .fc-tablo .fc-col-maliyet { width: 172px !important; min-width: 172px !important; max-width: 172px !important; }
  .fc-tablo .fc-col-firma   { width: 120px !important; min-width: 120px !important; max-width: 120px !important; }
  .fc-tablo .fc-col-satis   { width: 108px !important; min-width: 108px !important; max-width: 108px !important; }
  .fc-tablo .fc-col-kar     { width: 106px !important; min-width: 106px !important; max-width: 106px !important; }
}

/* --------------------------------------------------------------------------
   14. KULLANICI YÖNETİMİ VE YETKİ KONTROLÜ
   -------------------------------------------------------------------------- */
.fc-rol-rozet {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.2;
}

.fc-rol-rozet.fc-rol-admin {
  background: rgba(99, 102, 241, 0.12);
  color: #4F46E5;
  border: 1px solid rgba(99, 102, 241, 0.28);
}
html.fc-koyu .fc-rol-rozet.fc-rol-admin {
  background: rgba(129, 140, 248, 0.18);
  color: #A5B4FC;
  border-color: rgba(129, 140, 248, 0.35);
}

.fc-rol-rozet.fc-rol-supervisor {
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
  border: 1px solid rgba(2, 132, 199, 0.28);
}
html.fc-koyu .fc-rol-rozet.fc-rol-supervisor {
  background: rgba(56, 189, 248, 0.18);
  color: #7DD3FC;
  border-color: rgba(56, 189, 248, 0.35);
}

.fc-rol-rozet.fc-rol-operator {
  background: rgba(100, 116, 139, 0.12);
  color: #475569;
  border: 1px solid rgba(100, 116, 139, 0.28);
}
html.fc-koyu .fc-rol-rozet.fc-rol-operator {
  background: rgba(148, 163, 184, 0.18);
  color: #CBD5E1;
  border-color: rgba(148, 163, 184, 0.35);
}

.fc-durum-rozet {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
}
.fc-durum-rozet .fc-nokta {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
}
.fc-durum-rozet.aktif { color: #059669; }
.fc-durum-rozet.aktif .fc-nokta { background: #059669; }
.fc-durum-rozet.pasif { color: #94A3B8; }
.fc-durum-rozet.pasif .fc-nokta { background: #94A3B8; }
.fc-durum-rozet.davet { color: #D97706; }
.fc-durum-rozet.davet .fc-nokta { background: #D97706; }

.fc-yetki-ozet-grup {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.fc-yetki-fark-rozet {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.3;
}
.fc-yetki-fark-rozet.ek {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
  border: 1px solid rgba(5, 150, 105, 0.25);
}
html.fc-koyu .fc-yetki-fark-rozet.ek {
  background: rgba(52, 211, 153, 0.18);
  color: #6EE7B7;
  border-color: rgba(52, 211, 153, 0.35);
}
.fc-yetki-fark-rozet.kisit {
  background: rgba(217, 119, 6, 0.12);
  color: #D97706;
  border: 1px solid rgba(217, 119, 6, 0.25);
}
html.fc-koyu .fc-yetki-fark-rozet.kisit {
  background: rgba(251, 191, 36, 0.18);
  color: #FCD34D;
  border-color: rgba(251, 191, 36, 0.35);
}

.fc-yetki-kart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
}

.fc-yetki-karti {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 10px 12px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  transition: border-color 0.15s ease, background-color 0.15s ease;
  cursor: pointer;
  user-select: none;
}
.fc-yetki-karti:hover {
  border-color: var(--mud-palette-primary);
}
.fc-yetki-karti.secili {
  border-color: rgba(2, 132, 199, 0.4);
  background: rgba(2, 132, 199, 0.03);
}
html.fc-koyu .fc-yetki-karti.secili {
  border-color: rgba(56, 189, 248, 0.4);
  background: rgba(56, 189, 248, 0.05);
}
.fc-yetki-karti.tehlikeli {
  border-color: rgba(220, 38, 38, 0.35);
  background: rgba(220, 38, 38, 0.02);
}
.fc-yetki-karti.tehlikeli:hover {
  border-color: var(--mud-palette-error);
}
.fc-yetki-karti.tehlikeli.secili {
  background: rgba(220, 38, 38, 0.06);
  border-color: rgba(220, 38, 38, 0.5);
}
.fc-yetki-karti.kilitli {
  opacity: 0.65;
  cursor: not-allowed;
}

.fc-bilgi-karti {
  background: rgba(2, 132, 199, 0.06);
  border: 1px solid rgba(2, 132, 199, 0.22);
  border-radius: 8px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  color: var(--fc-metin-ana);
}
html.fc-koyu .fc-bilgi-karti {
  background: rgba(56, 189, 248, 0.08);
  border-color: rgba(56, 189, 248, 0.25);
}

/* --------------------------------------------------------------------------
   15. TALEPLER VE GERİ BİLDİRİM EKRANI
   -------------------------------------------------------------------------- */
.fc-talep-kart {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 12px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.fc-talep-kart:hover {
  border-color: rgba(2, 132, 199, 0.35);
}
.fc-talep-kart.yanitlandi {
  border-left: 4px solid var(--mud-palette-success);
}

.fc-talep-tur-rozet {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.2;
}
.fc-talep-tur-rozet.hata {
  background: rgba(220, 38, 38, 0.12);
  color: #DC2626;
  border: 1px solid rgba(220, 38, 38, 0.28);
}
html.fc-koyu .fc-talep-tur-rozet.hata {
  background: rgba(248, 113, 113, 0.18);
  color: #FCA5A5;
  border-color: rgba(248, 113, 113, 0.35);
}

.fc-talep-tur-rozet.istek {
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
  border: 1px solid rgba(2, 132, 199, 0.28);
}
html.fc-koyu .fc-talep-tur-rozet.istek {
  background: rgba(56, 189, 248, 0.18);
  color: #7DD3FC;
  border-color: rgba(56, 189, 248, 0.35);
}

.fc-talep-tur-rozet.soru {
  background: rgba(147, 51, 234, 0.12);
  color: #9333EA;
  border: 1px solid rgba(147, 51, 234, 0.28);
}
html.fc-koyu .fc-talep-tur-rozet.soru {
  background: rgba(192, 132, 252, 0.18);
  color: #D8B4FE;
  border-color: rgba(192, 132, 252, 0.35);
}

.fc-talep-durum-rozet {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
}
.fc-talep-durum-rozet.yeni {
  background: rgba(100, 116, 139, 0.12);
  color: #64748B;
}
html.fc-koyu .fc-talep-durum-rozet.yeni {
  background: rgba(148, 163, 184, 0.18);
  color: #94A3B8;
}
.fc-talep-durum-rozet.inceleniyor {
  background: rgba(217, 119, 6, 0.12);
  color: #D97706;
}
html.fc-koyu .fc-talep-durum-rozet.inceleniyor {
  background: rgba(251, 191, 36, 0.18);
  color: #FCD34D;
}
.fc-talep-durum-rozet.planlandi {
  background: rgba(99, 102, 241, 0.12);
  color: #6366F1;
}
html.fc-koyu .fc-talep-durum-rozet.planlandi {
  background: rgba(129, 140, 248, 0.18);
  color: #A5B4FC;
}
.fc-talep-durum-rozet.yapildi {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
}
html.fc-koyu .fc-talep-durum-rozet.yapildi {
  background: rgba(52, 211, 153, 0.18);
  color: #6EE7B7;
}
.fc-talep-durum-rozet.reddedildi {
  background: rgba(220, 38, 38, 0.12);
  color: #DC2626;
}
html.fc-koyu .fc-talep-durum-rozet.reddedildi {
  background: rgba(248, 113, 113, 0.18);
  color: #FCA5A5;
}

.fc-yanit-kutusu {
  background: rgba(5, 150, 105, 0.05);
  border: 1px solid rgba(5, 150, 105, 0.25);
  border-radius: 8px;
  padding: 12px 14px;
  margin-top: 12px;
}
html.fc-koyu .fc-yanit-kutusu {
  background: rgba(52, 211, 153, 0.08);
  border-color: rgba(52, 211, 153, 0.3);
}

.fc-yanit-baslik {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--mud-palette-success);
  margin-bottom: 6px;
}

.fc-talep-aciklama {
  font-size: 13px;
  color: var(--fc-metin-ana);
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}

.fc-tur-secici-grup {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.fc-tur-secici-kart {
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 10px;
  text-align: center;
  cursor: pointer;
  transition: all 0.15s ease;
  background: var(--fc-kart);
}
.fc-tur-secici-kart:hover {
  border-color: var(--mud-palette-primary);
}
.fc-tur-secici-kart.secili {
  border-color: var(--mud-palette-primary);
  background: rgba(2, 132, 199, 0.06);
}
html.fc-koyu .fc-tur-secici-kart.secili {
  background: rgba(56, 189, 248, 0.1);
}

/* Platform Talep Yönetimi */
.fc-acente-etiket {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 700;
  background: rgba(99, 102, 241, 0.12);
  color: #6366F1;
  border: 1px solid rgba(99, 102, 241, 0.28);
}
html.fc-koyu .fc-acente-etiket {
  background: rgba(129, 140, 248, 0.18);
  color: #A5B4FC;
  border-color: rgba(129, 140, 248, 0.35);
}

.fc-hata-ayiklama-kutu {
  background: rgba(100, 116, 139, 0.05);
  border: 1px dashed var(--fc-kenar-ince);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  color: var(--fc-metin-ikincil);
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 8px;
}

/* KDV hesaplanamadı: 0'dan (KDV yok) görsel olarak AYRI durmalı — biri bilgi,
   diğeri eksiklik. Sarı uyarı rengi, üstü çizili değil. */
.fc-kdv-rozet.bilinmiyor {
  color: var(--mud-palette-warning);
  background: rgba(217, 119, 6, .10);
  font-weight: 700;
}

/* Manuel Bilet Rozet & Satır Stilleri */
.fc-rozet-manuel {
  background: rgba(100, 116, 139, 0.12);
  color: #64748B;
  border: 1px solid rgba(100, 116, 139, 0.28);
}
html.fc-koyu .fc-rozet-manuel {
  background: rgba(148, 163, 184, 0.18);
  color: #CBD5E1;
  border-color: rgba(148, 163, 184, 0.35);
}

.fc-tablo tr.fc-kanal-serit-manuel > td:first-child,
.fc-tablo .mud-table-body tr.fc-kanal-serit-manuel > td:first-child {
  box-shadow: inset 3px 0 0 #64748B !important;
}

.fc-iade-vurgu {
  border-color: rgba(220, 38, 38, 0.4) !important;
  background: rgba(220, 38, 38, 0.03);
}
html.fc-koyu .fc-iade-vurgu {
  background: rgba(220, 38, 38, 0.06);
}

/* --------------------------------------------------------------------------
   8. BAŞLANGIÇ LİSTESİ (TASARIM 31 - ONBOARDING CHECKLIST)
   -------------------------------------------------------------------------- */
.fc-baslangic-kart {
  background: var(--fc-kart);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

.fc-baslangic-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--fc-kenar-ince);
}

.fc-baslangic-ikon-ana {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
html.fc-koyu .fc-baslangic-ikon-ana {
  background: rgba(56, 189, 248, 0.15);
  color: #38BDF8;
}

.fc-baslangic-sayac {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 12px;
  background: rgba(2, 132, 199, 0.12);
  color: #0284C7;
  letter-spacing: 0.02em;
}
html.fc-koyu .fc-baslangic-sayac {
  background: rgba(56, 189, 248, 0.15);
  color: #38BDF8;
}

.fc-baslangic-cubuk-alani {
  min-width: 180px;
  max-width: 240px;
  flex-grow: 1;
}

.fc-baslangic-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 10px;
}

.fc-baslangic-madde {
  background: var(--fc-zemin, #F8FAFC);
  border: 1px solid var(--fc-kenar-ince);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  transition: all 0.15s ease;
}

.fc-baslangic-madde:hover {
  border-color: var(--fc-kenar-orta);
}

.fc-baslangic-madde.tamam {
  background: rgba(5, 150, 105, 0.03);
  border-color: rgba(5, 150, 105, 0.2);
}
html.fc-koyu .fc-baslangic-madde.tamam {
  background: rgba(16, 185, 129, 0.05);
  border-color: rgba(16, 185, 129, 0.25);
}

.fc-baslangic-madde.yetkisiz {
  opacity: 0.85;
}

.fc-baslangic-madde-sol {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.fc-baslangic-sira {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.18);
  color: var(--fc-metin-ana);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.fc-baslangic-sira.tamam {
  background: #059669;
  color: #FFFFFF;
}
html.fc-koyu .fc-baslangic-sira.tamam {
  background: #10B981;
}

.fc-baslangic-madde-icerik {
  min-width: 0;
}

.fc-baslangic-baslik {
  font-size: 13px;
  font-weight: 700;
  color: var(--fc-metin-ana);
  line-height: 1.3;
}

.fc-baslangic-madde.tamam .fc-baslangic-baslik {
  color: var(--fc-metin-ikincil);
}

.fc-baslangic-aciklama {
  font-size: 11px;
  color: var(--fc-metin-ikincil);
  line-height: 1.35;
  margin-top: 2px;
}

.fc-baslangic-istege-bagli {
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 4px;
  background: rgba(148, 163, 184, 0.15);
  color: var(--fc-metin-ikincil);
}

.fc-baslangic-madde-sag {
  flex-shrink: 0;
}

.fc-baslangic-durum-etiket {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.fc-baslangic-durum-etiket.tamam {
  color: #059669;
}
html.fc-koyu .fc-baslangic-durum-etiket.tamam {
  color: #10B981;
}

.fc-baslangic-durum-etiket.yetkisiz {
  color: var(--fc-metin-ikincil);
  font-size: 11px;
}

.fc-baslangic-aksiyon-btn {
  text-transform: none;
  font-weight: 600;
  font-size: 12px;
  padding: 4px 12px;
  border-radius: 6px;
}