/* ==========================================================================
   Araç Talep Sistemi — kurumsal "prestij" tema katmanı
   site.css'in ÜSTÜNE yüklenir (bkz. _Layout.cshtml); yalnızca görünümü değiştirir.

   Kimlik: gece laciverti + rafine altın. Başlıklarda serif (Cormorant Garamond), arayüz
   ve verilerde durak/yol tabelalarının DIN karakterini taşıyan Barlow ailesi. İmza öğeler:
   Türk tescil plakası, hat haritası çizgileri (giriş ekranı, karşılama bandı) ve talep
   akışını duraklarla gösteren hat şeridi. Mobilde uygulama düzeni: lacivert üst çubuk,
   alt sekme çubuğu, ana ekranda büyük işlem kutuları, kart listesine dönüşen tablolar.
   Durum renkleri (--ton-*) altından ayrı ve her ekranda aynı anlamdadır.
   ========================================================================== */

/* ---------- Yazı tipleri (sunucuda barınır, CDN yok; OFL lisansları lib/barlow ve lib/cormorant altında) ---------- */

@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("../lib/barlow/barlow-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("../lib/barlow/barlow-latin-400-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("../lib/barlow/barlow-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("../lib/barlow/barlow-latin-500-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/barlow/barlow-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/barlow/barlow-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/barlow/barlow-semi-condensed-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/barlow/barlow-semi-condensed-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-semi-condensed-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-semi-condensed-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-condensed-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/barlow/barlow-condensed-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-ext-600-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 600; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-600-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 700; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-700-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 600; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-ext-600-italic.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 600; font-display: swap; src: url("../lib/cormorant/cormorant-garamond-latin-600-italic.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ---------- Tokenlar ---------- */

:root {
  /* Marka: gece laciverti yapıyı taşır; altın, prestij vurgusudur (aktif menü, karşılama
     bandı, giriş manşeti). Durum renkleri ayrı bir settir (--ton-*) ve altınla karışmaz. */
  --btt-gece: #061526;
  --btt-lacivert-koyu: #0b3d66;
  --btt-lacivert: #0f4c80;
  --btt-lacivert-acik: #2f73b3;
  --btt-altin: #c9a14a;
  --btt-altin-acik: #e5c47e;
  --btt-altin-koyu: #94702a;
  --btt-amber: #f5a524;
  --btt-amber-koyu: #c98106;

  --btt-bg: #f2f4f7;
  --btt-yuzey: #ffffff;
  --btt-yuzey-alt: #f7f9fb;
  --btt-cizgi: #e1e6ed;
  --btt-cizgi-guclu: #c8d1db;
  --btt-metin: #142130;
  --btt-metin-ikincil: #586677;
  --btt-metin-soluk: #8a96a5;
  --btt-baslik: #0b2d4d;
  --btt-vurgu-metin: #1f5f96;

  --ton-bekleyen-zemin: #fdf1dc; --ton-bekleyen-metin: #7a4b08; --ton-bekleyen-cizgi: #efc98a;
  --ton-aktif-zemin: #e5eef9; --ton-aktif-metin: #0b3d66; --ton-aktif-cizgi: #a9c6e6;
  --ton-tamam-zemin: #e3f3e9; --ton-tamam-metin: #1a5a33; --ton-tamam-cizgi: #9fd0b1;
  --ton-red-zemin: #fce8e6; --ton-red-metin: #8d201b; --ton-red-cizgi: #eeb0aa;
  --ton-notr-zemin: #eef1f5; --ton-notr-metin: #475463; --ton-notr-cizgi: #cfd7e0;

  --btt-kc-zemin: linear-gradient(180deg, #071b30 0%, #0a2b49 100%);
  --btt-bant-zemin:
    radial-gradient(640px 300px at 100% 0%, rgba(201, 161, 74, .22), transparent 62%),
    radial-gradient(560px 380px at 0% 120%, rgba(47, 115, 179, .38), transparent 60%),
    linear-gradient(135deg, #0b3d66 0%, #072642 52%, #061526 100%);

  --btt-yazi-govde: "Barlow", "Segoe UI", system-ui, sans-serif;
  --btt-yazi-baslik: "Barlow Semi Condensed", "Barlow", "Segoe UI", system-ui, sans-serif;
  --btt-yazi-serif: "Cormorant Garamond", "Georgia", "Times New Roman", serif;
  --btt-yazi-plaka: "Barlow Condensed", "Barlow Semi Condensed", "Arial Narrow", sans-serif;

  /* Gölgeler lacivert tonludur; seviye 1 yüzeyler, 2 üzerine gelinen kartlar, 3 açılan katmanlar */
  --btt-golge-1: 0 1px 2px rgba(6, 21, 38, .05), 0 2px 8px -2px rgba(6, 21, 38, .06);
  --btt-golge-2: 0 2px 4px rgba(6, 21, 38, .05), 0 14px 32px -14px rgba(6, 21, 38, .22);
  --btt-golge-3: 0 4px 12px rgba(6, 21, 38, .08), 0 24px 56px -18px rgba(6, 21, 38, .38);
  --btt-kart-golge: var(--btt-golge-1);
  --btt-kart-golge-hover: var(--btt-golge-2);

  /* Köşe kuralı: yüzeyler 14px, kontroller ve düğmeler 10px, durum etiketleri tam yuvarlak */
  --btt-radius: 14px;
  --btt-radius-kontrol: 10px;
  --btt-hareket: cubic-bezier(.2, .7, .2, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) {
    --btt-bg: #09111b;
    --btt-yuzey: #0f1b28;
    --btt-yuzey-alt: #142231;
    --btt-cizgi: #1f3043;
    --btt-cizgi-guclu: #2e445a;
    --btt-metin: #e4eaf1;
    --btt-metin-ikincil: #9cabbb;
    --btt-metin-soluk: #6c7b8c;
    --btt-baslik: #f1f5f9;
    --btt-vurgu-metin: #9cc7ef;
    --btt-lacivert-acik: #5b9bd8;

    --ton-bekleyen-zemin: #372a12; --ton-bekleyen-metin: #f2c878; --ton-bekleyen-cizgi: #6b5220;
    --ton-aktif-zemin: #14304b; --ton-aktif-metin: #acd0f3; --ton-aktif-cizgi: #2b5a88;
    --ton-tamam-zemin: #133322; --ton-tamam-metin: #98d8b0; --ton-tamam-cizgi: #2a6443;
    --ton-red-zemin: #3a1917; --ton-red-metin: #f2aaa4; --ton-red-cizgi: #773330;
    --ton-notr-zemin: #1d2b3a; --ton-notr-metin: #b9c4d0; --ton-notr-cizgi: #33475b;

    --btt-kc-zemin: linear-gradient(180deg, #08121d 0%, #0b1a2a 100%);
    --btt-golge-1: 0 1px 2px rgba(0, 0, 0, .35);
    --btt-golge-2: 0 2px 4px rgba(0, 0, 0, .3), 0 16px 36px -14px rgba(0, 0, 0, .7);
    --btt-golge-3: 0 4px 12px rgba(0, 0, 0, .4), 0 28px 60px -18px rgba(0, 0, 0, .8);
  }
}

:root[data-tema="koyu"] {
  --btt-bg: #09111b;
  --btt-yuzey: #0f1b28;
  --btt-yuzey-alt: #142231;
  --btt-cizgi: #1f3043;
  --btt-cizgi-guclu: #2e445a;
  --btt-metin: #e4eaf1;
  --btt-metin-ikincil: #9cabbb;
  --btt-metin-soluk: #6c7b8c;
  --btt-baslik: #f1f5f9;
  --btt-vurgu-metin: #9cc7ef;
  --btt-lacivert-acik: #5b9bd8;

  --ton-bekleyen-zemin: #372a12; --ton-bekleyen-metin: #f2c878; --ton-bekleyen-cizgi: #6b5220;
  --ton-aktif-zemin: #14304b; --ton-aktif-metin: #acd0f3; --ton-aktif-cizgi: #2b5a88;
  --ton-tamam-zemin: #133322; --ton-tamam-metin: #98d8b0; --ton-tamam-cizgi: #2a6443;
  --ton-red-zemin: #3a1917; --ton-red-metin: #f2aaa4; --ton-red-cizgi: #773330;
  --ton-notr-zemin: #1d2b3a; --ton-notr-metin: #b9c4d0; --ton-notr-cizgi: #33475b;

  --btt-kc-zemin: linear-gradient(180deg, #08121d 0%, #0b1a2a 100%);
  --btt-golge-1: 0 1px 2px rgba(0, 0, 0, .35);
  --btt-golge-2: 0 2px 4px rgba(0, 0, 0, .3), 0 16px 36px -14px rgba(0, 0, 0, .7);
  --btt-golge-3: 0 4px 12px rgba(0, 0, 0, .4), 0 28px 60px -18px rgba(0, 0, 0, .8);
}

/* ---------- Tipografi ---------- */

body {
  font-family: var(--btt-yazi-govde);
  background: var(--btt-bg);
  color: var(--btt-metin);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: 0;
}

h1, h3, h5, h6,
.btn,
.table thead th,
.form-label,
.kc-marka-metin small {
  font-family: var(--btt-yazi-baslik);
}

/* Sayfa başlıkları ve bölüm başlıkları serif; veri ve arayüz Barlow */
h2,
h4 {
  font-family: var(--btt-yazi-serif);
  font-weight: 700;
  color: var(--btt-baslik);
  letter-spacing: -.005em;
  text-wrap: balance;
}

/* Cormorant'ın varsayılan "eski usul" rakamları talep numaralarını dağınık gösterir */
h1, h2, h4,
.btt-karsilama-baslik,
.giris-manset,
.btt-durum-kod,
.modal-title {
  font-variant-numeric: lining-nums;
}

h2 {
  font-size: clamp(1.85rem, 1.45rem + 1vw, 2.35rem);
  line-height: 1.1;
}

/* Sayfa başlığının altındaki kısa altın çizgi */
.app-icerik main h2:not(.btt-karsilama-baslik)::after {
  content: "";
  display: block;
  width: 2.75rem;
  height: 2px;
  margin-top: .6rem;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--btt-altin), rgba(201, 161, 74, 0));
}

h4 {
  font-size: 1.5rem;
  line-height: 1.2;
}

h5,
.card .card-body h5,
.card .card-title {
  font-family: var(--btt-yazi-baslik);
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--btt-baslik);
}

.table,
.stat-card-value,
.rapor-bar-deger,
.rapor-trend-deger,
time {
  font-variant-numeric: tabular-nums;
}

.text-muted {
  color: var(--btt-metin-ikincil) !important;
}

a {
  color: var(--btt-vurgu-metin);
  text-underline-offset: .18em;
}

::selection {
  background: rgba(201, 161, 74, .3);
}

.btt-sayfa-baslik {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  margin-bottom: 1.5rem;
}

.btt-sayfa-baslik h2 {
  margin: 0;
}

.btt-sayfa-baslik-islemler {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

@media (max-width: 767.98px) {
  .btt-sayfa-baslik {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    margin-bottom: 1.25rem;
  }

  .btt-sayfa-baslik-islemler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    align-items: start;
  }

  .btt-sayfa-baslik > .btn,
  .btt-sayfa-baslik-islemler > .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    height: 48px;
    padding-block: 0;
    font-size: .95rem;
    line-height: 1.1;
    white-space: nowrap;
  }
}

.btt-detay-baslik {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .6rem 1rem;
  margin-bottom: 1rem;
}

.btt-detay-baslik h4 {
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .btt-detay-baslik {
    flex-direction: column;
    align-items: flex-start;
  }

  .btt-detay-baslik h4 {
    font-size: 1.4rem;
  }
}

.btt-bolum-baslik {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin: .5rem 0 .9rem;
}

.btt-bolum-baslik h4 {
  margin: 0;
}

.btt-bolum-link {
  font-family: var(--btt-yazi-baslik);
  font-weight: 600;
  font-size: .95rem;
  color: var(--btt-altin-koyu);
  text-decoration: none;
  white-space: nowrap;
}

.btt-bolum-link::after {
  content: " \2192";
}

.btt-bolum-link:hover {
  color: var(--btt-baslik);
}

/* ---------- Kenar çubuğu: gece laciverti, altın aktif sekme ---------- */

.kc {
  background: radial-gradient(420px 280px at 0% 0%, rgba(201, 161, 74, .10), transparent 62%), var(--btt-kc-zemin);
  border-right: 1px solid rgba(255, 255, 255, .06);
  box-shadow: none;
}

.kc-baslik {
  padding: 1.1rem .95rem;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  min-height: 72px;
}

.kc-marka-rozet {
  border-radius: 10px;
  padding: .32rem .45rem;
  box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .6);
}

.kc-marka-metin strong {
  font-family: var(--btt-yazi-serif);
  font-size: 1.28rem;
  font-weight: 700;
  line-height: 1.02;
}

@media (min-width: 992px) {
  html:not([data-kc="dar"]) .kc-baslik {
    align-items: flex-start;
  }

  html:not([data-kc="dar"]) .kc-marka {
    flex-direction: column;
    align-items: flex-start;
    gap: .7rem;
  }

  html:not([data-kc="dar"]) .kc-marka-metin strong {
    overflow: visible;
  }

  /* Logo, üst alanın genişliğine oturur */
  html:not([data-kc="dar"]) .kc-marka {
    flex: 1;
  }

  html:not([data-kc="dar"]) .kc-marka-rozet {
    width: 100%;
    justify-content: center;
    padding: .55rem .75rem;
  }

  html:not([data-kc="dar"]) .kc-marka-rozet img {
    height: 2.5rem;
  }
}

/* Mobil çekmece */
@media (max-width: 991.98px) {
  .kc-marka-rozet img {
    height: 2.1rem;
  }

  /* 100vh, adres çubuğu açıkken görünen alandan uzundur; alttaki profil bölümü ekran dışında
     kalıyordu. Çekmece görünen yüksekliğe (dvh) oturur, yalnızca menü listesi kendi içinde kayar. */
  .kc {
    height: 100vh;
    height: 100dvh;
    overflow-y: hidden;
  }

  .kc-baslik {
    padding-top: calc(1.1rem + env(safe-area-inset-top));
  }

  .kc-nav {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .kc-alt {
    padding-bottom: calc(.8rem + env(safe-area-inset-bottom));
  }
}

/* Firma adı logonun içinde zaten yazıyor; altta yalnızca "Sistemi" etiketi durur */
.kc-marka-metin small {
  margin-top: .15rem;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--btt-altin-acik);
}

.kc-daralt,
.kc-kapat {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 10px;
  color: rgba(255, 255, 255, .8);
}

.kc-daralt:hover,
.kc-kapat:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.kc-nav {
  padding: .5rem .6rem 1rem;
  gap: .1rem;
}

.kc-bolum {
  font-family: var(--btt-yazi-baslik);
  font-size: .64rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .42);
  padding: 1rem .8rem .4rem;
  white-space: nowrap;
}

.kc-nav > .kc-bolum:first-child {
  padding-top: .55rem;
}

.kc-link {
  color: rgba(255, 255, 255, .74);
  opacity: 1;
  padding: .6rem .8rem;
  border-radius: 10px;
  font-size: .96rem;
  font-weight: 500;
  transition: background-color .15s ease, color .15s ease;
}

.kc-link svg {
  opacity: .75;
  transition: opacity .15s ease, color .15s ease;
}

.kc-link:hover {
  background: rgba(255, 255, 255, .06);
  color: #fff;
}

.kc-link:hover svg {
  opacity: 1;
}

.kc-link.active {
  background: linear-gradient(90deg, rgba(201, 161, 74, .24), rgba(201, 161, 74, .05));
  color: #fff;
  font-weight: 600;
}

.kc-link.active svg {
  color: var(--btt-altin-acik);
  opacity: 1;
}

.kc-link.active::before {
  width: 3px;
  height: 62%;
  left: -.6rem;
  border-radius: 0 3px 3px 0;
  background: var(--btt-altin);
  box-shadow: 0 0 12px rgba(201, 161, 74, .55);
}

.kc-alt {
  border-top: 1px solid rgba(255, 255, 255, .07);
  background: rgba(0, 0, 0, .14);
  padding: .8rem .95rem;
}

.kc-avatar {
  font-family: var(--btt-yazi-baslik);
  font-size: .9rem;
  background: linear-gradient(135deg, var(--btt-altin-acik), var(--btt-altin));
  color: #0b2d4d;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .12);
}

.btt-profil-avatar {
  background: linear-gradient(135deg, var(--btt-altin-acik), var(--btt-altin));
  color: #0b2d4d;
  font-family: var(--btt-yazi-serif);
}

.kc-kullanici strong {
  font-size: .88rem;
}

.kc-kullanici span {
  color: var(--btt-altin-acik);
  opacity: .85;
}

.kc-cikis {
  background: rgba(255, 255, 255, .07);
  border-radius: 10px;
}

.tooltip.kc-ipucu {
  --bs-tooltip-bg: #0b2d4d;
  --bs-tooltip-border-radius: 8px;
}

/* Daraltılmış çubukta bölüm etiketleri ince ayraca dönüşür */
@media (min-width: 992px) {
  html[data-kc="dar"] .kc-bolum {
    font-size: 0;
    padding: 0;
    margin: .55rem .7rem;
    border-top: 1px solid rgba(255, 255, 255, .1);
  }

  html[data-kc="dar"] .kc-nav > .kc-bolum:first-child {
    border-top: 0;
    margin: .2rem 0;
  }

  html[data-kc="dar"] .kc-link.active::before {
    left: -.6rem;
  }
}

/* ---------- Üst çubuk ---------- */

.ust-cubuk {
  height: 64px;
  background: color-mix(in srgb, var(--btt-yuzey) 86%, transparent);
  -webkit-backdrop-filter: saturate(1.3) blur(10px);
  backdrop-filter: saturate(1.3) blur(10px);
  border-bottom: 1px solid var(--btt-cizgi);
  box-shadow: none;
  padding: 0 clamp(1rem, 2.5vw, 2.25rem);
}

.ust-cubuk-baslik {
  font-family: var(--btt-yazi-baslik);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--btt-metin-ikincil);
}

.ust-cubuk-tarih {
  font-size: .86rem;
  font-weight: 500;
  color: var(--btt-metin-ikincil);
  padding: .38rem .8rem;
  border: 1px solid var(--btt-cizgi);
  border-radius: 999px;
  background: var(--btt-yuzey-alt);
  white-space: nowrap;
}

.ust-cubuk .btt-tema-buton,
.btt-zil-buton {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--btt-cizgi);
  background: var(--btt-yuzey);
  color: var(--btt-metin-ikincil);
  box-shadow: none;
}

.ust-cubuk .btt-tema-buton:hover,
.btt-zil-buton:hover {
  background: var(--btt-yuzey-alt);
  color: var(--btt-baslik);
  border-color: var(--btt-cizgi-guclu);
}

.app-icerik {
  padding: 1.75rem clamp(1rem, 2.5vw, 2.25rem) 5rem;
}

/* Anonim sayfaların gezinme çubuğu */
.btt-navbar {
  padding-top: calc(.65rem + env(safe-area-inset-top));
  background: linear-gradient(90deg, #061526, #0b3d66);
  border-bottom: 1px solid rgba(201, 161, 74, .35);
  box-shadow: none;
}

.btt-logo-chip {
  border-radius: 10px;
  box-shadow: none;
}

/* ---------- Kartlar ---------- */

.card,
.card.shadow-sm,
.card.shadow {
  background: var(--btt-yuzey);
  border: 1px solid var(--btt-cizgi);
  border-radius: var(--btt-radius);
  box-shadow: var(--btt-golge-1) !important;
}

.card > .card-body {
  padding: 1.35rem 1.5rem;
}

.card > .card-header {
  background: var(--btt-yuzey-alt);
  border-bottom-color: var(--btt-cizgi);
  font-family: var(--btt-yazi-baslik);
  font-weight: 700;
  color: var(--btt-baslik);
}

.card > .card-header:first-child {
  border-radius: calc(var(--btt-radius) - 1px) calc(var(--btt-radius) - 1px) 0 0;
}

.list-group-item {
  border-color: var(--btt-cizgi);
  background: transparent;
  color: var(--btt-metin);
}

/* Detay sayfalarındaki etiket–değer listeleri: satır aralarında ince çizgi */
.card dl.row {
  --bs-gutter-x: 0;
}

@media (min-width: 576px) {
  .card dl.row > dd {
    padding-left: 1rem;
  }
}

.card dl.row > dt,
.card dl.row > dd {
  margin: 0;
  padding-block: .6rem;
  border-bottom: 1px solid var(--btt-cizgi);
}

.card dl.row > dt {
  font-family: var(--btt-yazi-baslik);
  font-weight: 600;
  font-size: .94rem;
  color: var(--btt-metin-ikincil);
}

.card dl.row > :nth-last-child(-n + 2) {
  border-bottom: 0;
}

@media (max-width: 575.98px) {
  .card dl.row > dt {
    border-bottom: 0;
    padding-bottom: 0;
  }
}

/* ---------- Tablolar ---------- */

.table {
  --bs-table-striped-bg: transparent;
  --bs-table-hover-bg: color-mix(in srgb, var(--btt-altin) 7%, var(--btt-yuzey));
  margin-bottom: 0;
}

.table-responsive {
  background: var(--btt-yuzey);
  border: 1px solid var(--btt-cizgi);
  border-radius: var(--btt-radius);
  box-shadow: var(--btt-golge-1);
  padding: 0;
}

.card .table-responsive {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.table thead th {
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--btt-metin-ikincil);
  background: var(--btt-yuzey-alt);
  border-bottom: 1px solid var(--btt-cizgi);
  white-space: nowrap;
}

.table > :not(caption) > * > * {
  padding: .85rem 1rem;
  vertical-align: middle;
  border-color: var(--btt-cizgi);
}

.table > tbody > tr:last-child > * {
  border-bottom: 0;
}

.table tbody tr[data-durum-renk] {
  box-shadow: none;
}

.table > tbody > tr > td:first-child {
  white-space: nowrap;
  font-weight: 600;
  color: var(--btt-baslik);
  font-variant-numeric: tabular-nums;
}

/* Tablo içindeki satır işlemi düğmeleri sade kalır */
.table .btn-outline-primary {
  border-color: var(--btt-cizgi-guclu);
  color: var(--btt-baslik);
  background: var(--btt-yuzey);
}

.table .btn-outline-primary:hover {
  background: var(--btt-lacivert-koyu);
  border-color: var(--btt-lacivert-koyu);
  color: #fff;
}

/* DataTables arama/sayfalama satırları kartın içinde nefes alır */
.table-responsive .dt-layout-row {
  margin: 0 !important;
  padding: .85rem 1rem;
}

.table-responsive .dt-layout-row.dt-layout-table {
  padding: 0;
}

.dt-search input,
.dt-length select {
  border-radius: 999px !important;
  padding: .4rem .9rem !important;
  min-height: 38px;
}

/* Boş liste: kesikli çerçeveli sakin bir kutu */
.btt-bos-durum {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.35rem 1.5rem;
  border: 1px dashed var(--btt-cizgi-guclu);
  border-radius: var(--btt-radius);
  background: color-mix(in srgb, var(--btt-yuzey) 60%, transparent);
  color: var(--btt-metin-ikincil);
}

.btt-bos-durum .btt-ikon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  padding: 9px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--btt-lacivert-koyu) 8%, var(--btt-yuzey));
  color: var(--btt-lacivert-acik);
}

.btt-bos-durum p {
  margin: 0;
}

@media (max-width: 767.98px) {
  .dt-search {
    display: flex;
    align-items: center;
    gap: .6rem;
  }

  .dt-search input {
    flex: 1;
    margin-left: 0 !important;
  }
}

/* ---------- Durum etiketleri: noktalı, tam yuvarlak ---------- */

.badge {
  display: inline-flex;
  align-items: center;
  gap: .42em;
  font-family: var(--btt-yazi-govde);
  font-weight: 600;
  font-size: .78rem;
  letter-spacing: .01em;
  line-height: 1.2;
  padding: .36em .75em .36em .65em;
  border-radius: 999px;
  border: 1px solid transparent;
  box-shadow: none;
  white-space: nowrap;
}

.badge[class*="bg-"]:not(.rounded-pill)::before {
  content: "";
  width: .45em;
  height: .45em;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

.badge.fs-6 {
  font-size: .9rem !important;
  padding: .45em .9em .45em .8em;
}

.badge.bg-warning { background-color: var(--ton-bekleyen-zemin) !important; color: var(--ton-bekleyen-metin) !important; border-color: var(--ton-bekleyen-cizgi); }
.badge.bg-primary,
.badge.bg-info { background-color: var(--ton-aktif-zemin) !important; color: var(--ton-aktif-metin) !important; border-color: var(--ton-aktif-cizgi); }
.badge.bg-success { background-color: var(--ton-tamam-zemin) !important; color: var(--ton-tamam-metin) !important; border-color: var(--ton-tamam-cizgi); }
.badge.bg-danger { background-color: var(--ton-red-zemin) !important; color: var(--ton-red-metin) !important; border-color: var(--ton-red-cizgi); }
.badge.bg-secondary,
.badge.bg-dark,
.badge.bg-light { background-color: var(--ton-notr-zemin) !important; color: var(--ton-notr-metin) !important; border-color: var(--ton-notr-cizgi) !important; }

/* Sayaç rozetleri (menüde bekleyen sayısı gibi) dolu kalır */
.badge.rounded-pill.bg-danger {
  background-color: #c8372f !important;
  color: #fff !important;
  border-color: transparent;
}

.btt-rol-admin,
.btt-rol-sorumlu,
.btt-rol-teslimgorevlisi,
.btt-rol-personel {
  background: var(--ton-notr-zemin);
  color: var(--ton-notr-metin);
  border-color: var(--ton-notr-cizgi);
}

.btt-rol-admin {
  background: var(--ton-aktif-zemin);
  color: var(--ton-aktif-metin);
  border-color: var(--ton-aktif-cizgi);
}

/* ---------- Düğmeler ---------- */

.btn {
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: .02em;
  border-radius: var(--btt-radius-kontrol);
  padding: .56rem 1.15rem;
  background-image: none;
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .1s ease;
}

.btn-sm {
  font-size: .88rem;
  padding: .3rem .75rem;
  border-radius: 8px;
}

.btn:active {
  transform: translateY(1px);
}

.btn-primary {
  background-color: var(--btt-lacivert-koyu);
  border-color: var(--btt-lacivert-koyu);
  color: #fff;
  box-shadow: 0 1px 2px rgba(6, 21, 38, .16), 0 8px 18px -10px rgba(11, 61, 102, .7);
}

.btn-primary:hover,
.btn-primary:focus-visible {
  background-color: var(--btt-lacivert);
  border-color: var(--btt-lacivert);
  color: #fff;
}

.btn-outline-primary {
  color: var(--btt-lacivert-koyu);
  border-color: var(--btt-cizgi-guclu);
  background-color: var(--btt-yuzey);
}

.btn-outline-primary:hover {
  background-color: var(--btt-lacivert-koyu);
  border-color: var(--btt-lacivert-koyu);
  color: #fff;
}

.btn-outline-secondary,
.btn-outline-dark {
  color: var(--btt-metin);
  border-color: var(--btt-cizgi-guclu);
  background-color: var(--btt-yuzey);
}

.btn-outline-secondary:hover,
.btn-outline-dark:hover {
  background-color: var(--btt-yuzey-alt);
  border-color: var(--btt-metin-soluk);
  color: var(--btt-baslik);
}

.btn-outline-danger {
  background-color: var(--btt-yuzey);
}

.btn-warning {
  background-color: var(--btt-amber);
  border-color: var(--btt-amber);
  color: #3b2400;
}

.btn-warning:hover {
  background-color: #e8960f;
  border-color: #e8960f;
  color: #3b2400;
}

/* Altın: karşılama bandındaki birincil işlem */
.btn-altin {
  background: linear-gradient(180deg, #e6c27a 0%, #c99f48 100%);
  border: 0;
  color: #0b2d4d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 10px 22px -10px rgba(201, 161, 74, .8);
}

.btn-altin:hover,
.btn-altin:focus-visible {
  background: linear-gradient(180deg, #ecca87 0%, #d2a852 100%);
  color: #061526;
}

/* Cam: koyu zemin üzerindeki ikincil işlem */
.btn-cam {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.btn-cam:hover,
.btn-cam:focus-visible {
  background: rgba(255, 255, 255, .16);
  border-color: rgba(255, 255, 255, .34);
  color: #fff;
}

.btn.btt-gonderiliyor {
  cursor: progress;
  opacity: .7;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .btn-primary { background-color: #2b6cb0; border-color: #2b6cb0; }
  :root:not([data-tema="acik"]) .btn-primary:hover { background-color: #3579c0; border-color: #3579c0; }
  :root:not([data-tema="acik"]) .btn-outline-primary,
  :root:not([data-tema="acik"]) .table .btn-outline-primary { color: var(--btt-vurgu-metin); }
}

:root[data-tema="koyu"] .btn-primary { background-color: #2b6cb0; border-color: #2b6cb0; }
:root[data-tema="koyu"] .btn-primary:hover { background-color: #3579c0; border-color: #3579c0; }
:root[data-tema="koyu"] .btn-outline-primary,
:root[data-tema="koyu"] .table .btn-outline-primary { color: var(--btt-vurgu-metin); }

/* ---------- Form kontrolleri ---------- */

.form-control,
.form-select {
  min-height: 46px;
  border-radius: var(--btt-radius-kontrol);
  border: 1px solid var(--btt-cizgi-guclu);
  background-color: var(--btt-yuzey);
  box-shadow: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

textarea.form-control {
  min-height: auto;
}

.form-control-sm,
.form-select-sm {
  min-height: 34px;
  border-radius: 8px;
}

.form-control:hover,
.form-select:hover {
  border-color: var(--btt-metin-soluk);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--btt-lacivert-acik);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--btt-lacivert-acik) 18%, transparent);
}

.input-group > .btn {
  border-radius: 0 var(--btt-radius-kontrol) var(--btt-radius-kontrol) 0;
  border-color: var(--btt-cizgi-guclu);
}

.form-label {
  font-size: .94rem;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--btt-metin-ikincil);
  margin-bottom: .4rem;
}

.form-text {
  color: var(--btt-metin-soluk);
}

.form-check-input:checked {
  background-color: var(--btt-lacivert-koyu);
  border-color: var(--btt-lacivert-koyu);
}

/* Takvim (Flatpickr) kutuları: kütüphane onları salt-okunur yapar; genel "readonly" grisi
   devre dışı gibi gösterdiği için beyaz zemin, el imleci ve sağda takvim simgesi verilir. */
.form-control.flatpickr-input[readonly],
.flatpickr-input + .form-control[readonly] {
  background-color: var(--btt-yuzey);
  cursor: pointer;
  padding-right: 2.6rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a96a5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16.5' rx='2'/%3E%3Cpath d='M16 2.5v4M8 2.5v4M3 10h18'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .85rem center;
  background-size: 1.15rem;
}

/* ---------- Plaka: Türk tescil plakası (mavi TR şeridi, yıldızsız) ---------- */

.plaka-rozeti {
  display: inline-flex;
  align-items: stretch;
  height: 1.8rem;
  border: 1.5px solid #1b2430;
  border-radius: 5px;
  overflow: hidden;
  background: #1b2430;
  box-shadow: 0 1px 2px rgba(6, 21, 38, .22);
  font-family: var(--btt-yazi-plaka);
  vertical-align: middle;
  flex-shrink: 0;
}

.plaka-rozeti-tr {
  width: 1.05rem;
  background: #1f4fbf;
  color: #fff;
  font-family: var(--btt-yazi-plaka);
  font-size: .55rem;
  font-weight: 700;
  justify-content: flex-end;
  padding-bottom: .12rem;
}

.plaka-rozeti-tr::before {
  content: none;
}

.plaka-rozeti-no {
  font-family: var(--btt-yazi-plaka);
  font-weight: 700;
  font-size: 1.02rem;
  letter-spacing: .07em;
  padding: 0 .55rem;
  color: #11161d;
  background: #fff;
  border: 0;
  white-space: nowrap;
}

.plaka-rozeti-bos {
  display: inline-block;
  font-style: normal;
  font-size: .84rem;
  color: var(--btt-metin-ikincil);
  padding: .14rem .6rem;
  border: 1px dashed var(--btt-cizgi-guclu);
  border-radius: 999px;
  white-space: nowrap;
}

/* Plaka bir görsel etikettir; fareyle seçilip kopyalanmaz */
.plaka-rozeti,
.plaka-rozeti * {
  -webkit-user-select: none;
  user-select: none;
}

/* ---------- Karşılama bandı (ana paneller) ---------- */

.btt-karsilama {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 1.5rem;
  padding: clamp(1.5rem, 3vw, 2.4rem) clamp(1.4rem, 3vw, 2.6rem);
  border-radius: 18px;
  background: var(--btt-bant-zemin);
  color: #fff;
  box-shadow: var(--btt-golge-2);
}

/* İnce ızgara dokusu, sağa doğru belirginleşir */
.btt-karsilama::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(90deg, transparent 20%, #000 75%);
  mask-image: linear-gradient(90deg, transparent 20%, #000 75%);
}

.btt-karsilama-hat {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: min(44%, 540px);
  height: 100%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 38%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 38%);
}

.btt-karsilama-hat path {
  fill: none;
  stroke: rgba(255, 255, 255, .16);
  stroke-width: 2.5;
  stroke-linejoin: round;
  stroke-dasharray: 900;
  stroke-dashoffset: 900;
  animation: btt-hat-ciz 1.8s var(--btt-hareket) .15s forwards;
}

.btt-karsilama-hat .btt-karsilama-hat-altin {
  stroke: rgba(229, 196, 126, .6);
  animation-delay: .35s;
}

.btt-karsilama-hat circle {
  fill: #0a2b49;
  stroke: rgba(255, 255, 255, .4);
  stroke-width: 2;
}

.btt-karsilama-hat .btt-karsilama-durak-altin {
  fill: var(--btt-altin-acik);
  stroke: rgba(255, 255, 255, .7);
}

.btt-karsilama-icerik {
  position: relative;
  max-width: 40rem;
  animation: btt-yuksel .6s var(--btt-hareket) backwards;
}

.btt-karsilama-etiket {
  margin: 0 0 .65rem;
  font-family: var(--btt-yazi-baslik);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--btt-altin-acik);
}

.btt-karsilama-baslik {
  margin: 0;
  font-family: var(--btt-yazi-serif);
  font-size: clamp(2.1rem, 1.55rem + 1.7vw, 3rem);
  font-weight: 600;
  line-height: 1.02;
  color: #fff;
}

.btt-karsilama-baslik em {
  font-style: italic;
  color: var(--btt-altin-acik);
}

.btt-karsilama-ozet {
  margin: .75rem 0 1.4rem;
  max-width: 36rem;
  font-size: 1.05rem;
  color: rgba(255, 255, 255, .8);
}

.btt-karsilama-islemler {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

.btt-karsilama-islemler .btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.btt-karsilama-islemler .btt-ikon {
  width: 18px;
  height: 18px;
}

.btt-karsilama-sayi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.4rem;
  height: 1.4rem;
  padding: 0 .38rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .2);
  font-size: .76rem;
  font-weight: 700;
}

.btn-altin .btt-karsilama-sayi {
  background: rgba(11, 45, 77, .16);
}

@keyframes btt-hat-ciz {
  to { stroke-dashoffset: 0; }
}

@keyframes btt-yuksel {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

/* ---------- Hızlı işlem kutuları (yalnızca mobil/tablet) ---------- */

.btt-hizli {
  display: none;
}

@media (max-width: 991.98px) {
  .btt-karsilama-islemler {
    display: none;
  }

  /* Telefonda bant dar; çizgiler yazının üstüne binmesin */
  .btt-karsilama-hat {
    display: none;
  }

  .btt-hizli {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: -.25rem 0 1.5rem;
  }
}

.btt-hizli-kutu {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: .85rem;
  min-height: 108px;
  padding: 1rem;
  background: var(--btt-yuzey);
  border: 1px solid var(--btt-cizgi);
  border-radius: 16px;
  box-shadow: var(--btt-golge-1);
  color: var(--btt-metin);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s ease, box-shadow .15s ease;
}

.btt-hizli-kutu:active {
  transform: scale(.98);
}

.btt-hizli-ikon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--btt-lacivert-koyu) 9%, var(--btt-yuzey));
  color: var(--btt-lacivert-koyu);
}

.btt-hizli-ikon .btt-ikon {
  width: 22px;
  height: 22px;
}

.btt-hizli-etiket {
  font-family: var(--btt-yazi-baslik);
  font-size: 1.04rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--btt-baslik);
}

.btt-hizli-sayi {
  position: absolute;
  top: .85rem;
  right: .85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.65rem;
  height: 1.65rem;
  padding: 0 .4rem;
  border-radius: 999px;
  background: var(--btt-altin);
  color: #0b2d4d;
  font-size: .8rem;
  font-weight: 700;
}

.btt-hizli-birincil {
  background: var(--btt-bant-zemin);
  border-color: transparent;
  box-shadow: var(--btt-golge-2);
}

.btt-hizli-birincil .btt-hizli-ikon {
  background: rgba(255, 255, 255, .12);
  color: var(--btt-altin-acik);
}

.btt-hizli-birincil .btt-hizli-etiket {
  color: #fff;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .btt-hizli-ikon { color: var(--btt-vurgu-metin); }
}

:root[data-tema="koyu"] .btt-hizli-ikon { color: var(--btt-vurgu-metin); }

/* ---------- Sayaç kartları ---------- */

.stat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .2rem;
  height: 100%;
  padding: 1.15rem 1.3rem 1.2rem;
  background: var(--btt-yuzey);
  border: 1px solid var(--btt-cizgi);
  border-radius: var(--btt-radius);
  box-shadow: var(--btt-golge-1);
  color: var(--btt-metin);
  overflow: hidden;
  transform: none;
}

.stat-card::after {
  content: none;
}

.stat-card .stat-card-label {
  font-family: var(--btt-yazi-baslik);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--btt-metin-ikincil);
}

.stat-card .stat-card-value {
  margin-top: .35rem;
  font-family: var(--btt-yazi-plaka);
  font-size: 2.7rem;
  font-weight: 700;
  line-height: 1;
  color: var(--btt-baslik);
  text-shadow: none;
}

.stat-card-aciklama {
  font-size: .88rem;
  color: var(--btt-metin-soluk);
}

.stat-card-sifir .stat-card-value {
  color: var(--btt-metin-soluk);
}

/* İşleminizi bekleyen sayaç: üstte altın şerit, değer altın tonunda */
.stat-card-dikkat-warning::before,
.stat-card-dikkat-danger::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--btt-altin), var(--btt-altin-acik));
}

.stat-card-dikkat-danger::before {
  background: #c8372f;
}

.stat-card-dikkat-warning .stat-card-value {
  color: var(--btt-altin-koyu);
}

.stat-card-dikkat-danger .stat-card-value {
  color: var(--ton-red-metin);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .stat-card-dikkat-warning .stat-card-value { color: var(--btt-altin-acik); }
}

:root[data-tema="koyu"] .stat-card-dikkat-warning .stat-card-value { color: var(--btt-altin-acik); }

.btt-stat-link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
  border-radius: var(--btt-radius);
}

.btt-stat-link .stat-card {
  transition: transform .2s var(--btt-hareket), box-shadow .2s ease, border-color .2s ease;
}

.btt-stat-link .stat-card-label::after {
  content: "\2192";
  position: absolute;
  top: 1.05rem;
  right: 1.2rem;
  font-size: 1rem;
  letter-spacing: 0;
  color: var(--btt-metin-soluk);
  transition: transform .2s var(--btt-hareket), color .2s ease;
}

.btt-stat-link:hover .stat-card,
.btt-stat-link:focus-visible .stat-card {
  transform: translateY(-2px);
  box-shadow: var(--btt-golge-2);
  border-color: var(--btt-cizgi-guclu);
}

.btt-stat-link:hover .stat-card-label::after {
  transform: translateX(3px);
  color: var(--btt-altin-koyu);
}

/* ---------- Talep akışı: hat haritası ---------- */

.btt-hat {
  list-style: none;
  margin: .25rem 0 1.5rem;
  padding: 1rem .5rem .9rem;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  background: var(--btt-yuzey-alt);
  border: 1px solid var(--btt-cizgi);
  border-radius: 12px;
}

.btt-hat-durak {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  text-align: center;
  padding: 0 .25rem;
}

.btt-hat-durak + .btt-hat-durak::before {
  content: "";
  position: absolute;
  top: 6px;
  right: calc(50% + 9px);
  left: calc(-50% + 9px);
  height: 3px;
  border-radius: 2px;
  background: var(--btt-cizgi-guclu);
}

.btt-hat-gecti + .btt-hat-durak::before,
.btt-hat-gecti::before {
  background: var(--btt-lacivert-koyu);
}

.btt-hat-nokta {
  position: relative;
  z-index: 1;
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  border-radius: 50%;
  border: 3px solid var(--btt-cizgi-guclu);
  background: var(--btt-yuzey);
}

.btt-hat-ad {
  font-size: .82rem;
  line-height: 1.25;
  color: var(--btt-metin-soluk);
}

.btt-hat-gecti .btt-hat-nokta {
  border-color: var(--btt-lacivert-koyu);
  background: var(--btt-lacivert-koyu);
}

.btt-hat-gecti .btt-hat-ad {
  color: var(--btt-metin-ikincil);
}

.btt-hat-simdi .btt-hat-nokta {
  border-color: var(--btt-altin);
  background: var(--btt-yuzey);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--btt-altin) 28%, transparent);
}

.btt-hat-simdi .btt-hat-ad {
  color: var(--btt-baslik);
  font-weight: 700;
}

.btt-hat-red .btt-hat-nokta {
  border-color: #c8372f;
  background: #c8372f;
}

.btt-hat-red .btt-hat-ad {
  color: var(--ton-red-metin);
  font-weight: 700;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .btt-hat-gecti .btt-hat-nokta,
  :root:not([data-tema="acik"]) .btt-hat-gecti + .btt-hat-durak::before,
  :root:not([data-tema="acik"]) .btt-hat-gecti::before { background: #5b9bd8; border-color: #5b9bd8; }
}

:root[data-tema="koyu"] .btt-hat-gecti .btt-hat-nokta,
:root[data-tema="koyu"] .btt-hat-gecti + .btt-hat-durak::before,
:root[data-tema="koyu"] .btt-hat-gecti::before { background: #5b9bd8; border-color: #5b9bd8; }

@media (max-width: 575.98px) {
  .btt-hat {
    grid-auto-flow: row;
    gap: .55rem;
    padding: .9rem 1rem;
  }

  .btt-hat-durak {
    flex-direction: row;
    text-align: left;
    padding: 0;
  }

  .btt-hat-durak + .btt-hat-durak::before {
    top: calc(-.55rem - 2px);
    bottom: calc(100% - 2px);
    left: 6px;
    right: auto;
    width: 3px;
    height: auto;
  }
}

/* ---------- Giriş ekranı: iki bölmeli tam ekran ---------- */

.btt-tam-ekran {
  min-height: 100vh;
  min-height: 100dvh;
}

.giris {
  -webkit-user-select: none;
  user-select: none;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  min-height: 100vh;
  min-height: 100dvh;
}

.giris-sahne {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  padding: clamp(2rem, 4vw, 3.5rem) clamp(2rem, 5vw, 4.5rem);
  color: #fff;
  background:
    radial-gradient(900px 600px at 0% 0%, rgba(47, 115, 179, .45), transparent 62%),
    radial-gradient(700px 520px at 100% 100%, rgba(201, 161, 74, .16), transparent 60%),
    linear-gradient(160deg, #0b3d66 0%, #072642 45%, #061526 100%);
}

.giris-sahne::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse at 60% 70%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse at 60% 70%, #000 20%, transparent 75%);
}

.giris-hat {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  -webkit-mask-image: linear-gradient(105deg, transparent 30%, rgba(0, 0, 0, .35) 52%, #000 78%);
  mask-image: linear-gradient(105deg, transparent 30%, rgba(0, 0, 0, .35) 52%, #000 78%);
}

.giris-hat path {
  fill: none;
  stroke: rgba(255, 255, 255, .13);
  stroke-width: 3;
  stroke-linejoin: round;
  stroke-dasharray: 1400;
  stroke-dashoffset: 1400;
  animation: btt-hat-ciz 2.4s var(--btt-hareket) .2s forwards;
}

.giris-hat .giris-hat-altin {
  stroke: rgba(229, 196, 126, .55);
  animation-delay: .5s;
}

.giris-hat circle {
  fill: #072642;
  stroke: rgba(255, 255, 255, .35);
  stroke-width: 2.5;
}

.giris-hat .giris-durak-altin {
  fill: var(--btt-altin-acik);
  stroke: rgba(255, 255, 255, .75);
}

.giris-logo {
  display: inline-flex;
  padding: .75rem 1.15rem;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 16px 36px -16px rgba(0, 0, 0, .75);
}

.giris-logo img {
  display: block;
  height: 3.6rem;
  width: auto;
}

.giris-sahne-orta {
  max-width: 34rem;
  animation: btt-yuksel .8s var(--btt-hareket) .1s backwards;
}

.giris-rozet {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 1.5rem;
  padding: .4rem .95rem;
  border: 1px solid rgba(229, 196, 126, .45);
  border-radius: 999px;
  background: rgba(201, 161, 74, .1);
  font-family: var(--btt-yazi-baslik);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--btt-altin-acik);
}

.giris-rozet span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--btt-altin-acik);
  box-shadow: 0 0 10px rgba(229, 196, 126, .8);
}

.giris-manset {
  margin: 0;
  font-family: var(--btt-yazi-serif);
  font-size: clamp(2.4rem, 1.4rem + 2.6vw, 3.7rem);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -.01em;
  color: #fff;
  text-wrap: balance;
}

.giris-manset em {
  font-style: italic;
  color: var(--btt-altin-acik);
}

.giris-manset::after {
  content: "";
  display: block;
  width: 3.5rem;
  height: 2px;
  margin: 1.5rem 0 2rem;
  background: linear-gradient(90deg, var(--btt-altin), rgba(201, 161, 74, 0));
}

/* Giriş plakası: krom çerçeveli, parlak siyah "özel plaka". Yazılar kabartma gümüş,
   iç kenarda ince altın çizgi, iki yanda krom vida başı. */
.giris-plaka {
  height: 3.7rem;
  padding: 3px;
  border: 0;
  border-radius: 9px;
  background: linear-gradient(145deg, #f5f7f9 0%, #9aa3ad 28%, #eef1f4 48%, #6f7984 72%, #d9dee3 100%);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, .45),
    0 28px 52px -20px rgba(0, 0, 0, .9);
}

.giris-plaka .plaka-rozeti-tr {
  width: 2.1rem;
  border-radius: 6px 0 0 6px;
  background: linear-gradient(180deg, #2457c9 0%, #173e98 100%);
  font-size: .86rem;
  letter-spacing: .02em;
  padding-bottom: .38rem;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .35);
}

.giris-plaka .plaka-rozeti-no {
  position: relative;
  padding: 0 1.45rem;
  border-radius: 0 6px 6px 0;
  background:
    radial-gradient(circle at 11px 50%, #e9edf1 0 1.6px, #7c8691 2.2px, #2a3037 3.4px, transparent 4px),
    radial-gradient(circle at calc(100% - 11px) 50%, #e9edf1 0 1.6px, #7c8691 2.2px, #2a3037 3.4px, transparent 4px),
    radial-gradient(130% 160% at 28% -10%, #2c323a 0%, #111418 48%, #050607 100%);
  color: #f1f3f6;
  font-size: 2.15rem;
  letter-spacing: .1em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .28), 0 -1px 0 rgba(0, 0, 0, .95), 0 0 14px rgba(255, 255, 255, .08);
  box-shadow: inset 0 0 0 1px rgba(201, 161, 74, .6), inset 0 0 0 3px #0a0c0f;
}

/* Akrilik yüzeyin üst yarısındaki parlama */
.giris-plaka .plaka-rozeti-no::after {
  content: "";
  position: absolute;
  inset: 3px 3px 50% 3px;
  border-radius: 0 4px 0 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.giris-sahne-alt {
  margin: 0;
  font-size: .8rem;
  color: rgba(255, 255, 255, .45);
}

.giris-form-alani {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: clamp(2rem, 5vw, 4rem) clamp(1.25rem, 5vw, 4rem);
  background-color: var(--btt-yuzey);
  background-image: radial-gradient(color-mix(in srgb, var(--btt-metin-soluk) 22%, transparent) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* Üst kenarda lacivertten altına ince şerit */
.giris-form-alani::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--btt-lacivert-koyu), var(--btt-altin));
}

.giris-tema {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--btt-cizgi);
  background: var(--btt-yuzey);
  color: var(--btt-metin-ikincil);
}

.giris-kutu {
  width: 100%;
  max-width: 25rem;
  animation: btt-yuksel .6s var(--btt-hareket) .15s backwards;
}

.giris-ust-etiket {
  margin: 0 0 .5rem;
  font-family: var(--btt-yazi-baslik);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--btt-altin-koyu);
}

.giris-baslik {
  margin: 0;
  font-family: var(--btt-yazi-serif);
  font-size: clamp(2.2rem, 1.8rem + 1vw, 2.75rem);
  font-weight: 700;
  line-height: 1.05;
  color: var(--btt-baslik);
}

.giris-alt-baslik {
  margin: .6rem 0 1.75rem;
  color: var(--btt-metin-ikincil);
}

.giris-kutu .form-label {
  font-size: .76rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--btt-metin-ikincil);
}

.giris input,
.giris textarea {
  -webkit-user-select: text;
  user-select: text;
}

.giris-kutu .form-control {
  min-height: 50px;
  background-color: var(--btt-yuzey-alt);
}

.giris-kutu .form-control:focus {
  background-color: var(--btt-yuzey);
}

.giris-etiket-satiri {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}

.giris-etiket-satiri a {
  font-size: .88rem;
  font-weight: 500;
  text-decoration: none;
}

.giris-etiket-satiri a:hover {
  text-decoration: underline;
}

.giris-dugme {
  width: 100%;
  min-height: 50px;
  font-size: 1.05rem;
}

.giris-ayrac {
  height: 1px;
  margin: 1.75rem 0 1.25rem;
  background: linear-gradient(90deg, transparent, var(--btt-cizgi-guclu), transparent);
}

.giris-hesap-talebi {
  margin: 0;
  text-align: center;
  color: var(--btt-metin-ikincil);
}

.giris-yardim {
  margin: 0;
  font-size: .82rem;
  color: var(--btt-metin-soluk);
  text-align: center;
}

.giris-kutu .alert {
  margin-bottom: 1.25rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .giris-ust-etiket { color: var(--btt-altin-acik); }
}

:root[data-tema="koyu"] .giris-ust-etiket { color: var(--btt-altin-acik); }

/* Telefonda sahne üstte kısa bir marka bandına dönüşür, form hemen altından başlar */
@media (max-width: 991.98px) {
  .giris {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }

  .giris-sahne {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: calc(1.1rem + env(safe-area-inset-top)) 1.25rem calc(1.1rem + 3px);
  }

  .giris-sahne-orta {
    animation: none;
  }

  .giris-rozet,
  .giris-manset,
  .giris-aciklama,
  .giris-sahne-alt {
    display: none;
  }

  .giris-logo {
    padding: .45rem .7rem;
  }

  .giris-logo img {
    height: 2.3rem;
  }

  .giris-plaka {
    height: 2.5rem;
    padding: 2px;
    border-radius: 7px;
  }

  .giris-plaka .plaka-rozeti-no {
    font-size: 1.4rem;
    padding: 0 1rem;
    background:
      radial-gradient(circle at 7px 50%, #e9edf1 0 1.1px, #7c8691 1.6px, #2a3037 2.4px, transparent 2.9px),
      radial-gradient(circle at calc(100% - 7px) 50%, #e9edf1 0 1.1px, #7c8691 1.6px, #2a3037 2.4px, transparent 2.9px),
      radial-gradient(130% 160% at 28% -10%, #2c323a 0%, #111418 48%, #050607 100%);
  }

  .giris-plaka .plaka-rozeti-tr {
    width: 1.45rem;
    font-size: .62rem;
    padding-bottom: .2rem;
  }

  .giris-form-alani {
    justify-content: flex-start;
    padding-top: 2.25rem;
  }

  .giris-tema {
    top: .9rem;
    right: .9rem;
  }
}

/* ---------- Mobil: uygulama gibi üst çubuk ve alt sekme çubuğu ---------- */

.alt-sekme {
  display: none;
}

@media (max-width: 991.98px) {
  .ust-cubuk {
    height: calc(58px + env(safe-area-inset-top));
    padding-top: env(safe-area-inset-top);
    background: linear-gradient(135deg, #0b3d66, #072642);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom: 1px solid rgba(201, 161, 74, .35);
    color: #fff;
  }

  .ust-cubuk-baslik {
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: .01em;
  }

  .ust-cubuk-tarih {
    display: none;
  }

  .ust-cubuk .btt-tema-buton,
  .ust-cubuk .btt-zil-buton,
  .kc-mobil-ac {
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .16);
    color: #fff;
  }

  .kc-mobil-ac {
    width: 38px;
    height: 38px;
    border-radius: 10px;
  }

  .ust-cubuk .btt-tema-buton:hover,
  .ust-cubuk .btt-zil-buton:hover,
  .kc-mobil-ac:hover {
    background: rgba(255, 255, 255, .18);
    color: #fff;
  }

  .app-icerik {
    padding: 1.25rem 1rem calc(96px + env(safe-area-inset-bottom));
  }

  .app-icerik main h2 {
    font-size: 1.85rem;
  }

  /* Alt sekme çubuğu varken sabit alt bilgi şeridi gizlenir */
  .icerik-alani .btt-alt-bilgi {
    display: none;
  }

  .alt-sekme {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1020;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: end;
    height: calc(66px + env(safe-area-inset-bottom));
    padding: 0 .35rem env(safe-area-inset-bottom);
    background: color-mix(in srgb, var(--btt-yuzey) 94%, transparent);
    -webkit-backdrop-filter: saturate(1.4) blur(14px);
    backdrop-filter: saturate(1.4) blur(14px);
    border-top: 1px solid var(--btt-cizgi);
    box-shadow: 0 -10px 28px -16px rgba(6, 21, 38, .35);
  }

  .alt-sekme-link,
  .alt-sekme-ana {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 66px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--btt-metin-soluk);
    font-family: var(--btt-yazi-baslik);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .02em;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }

  .alt-sekme-link .btt-ikon {
    width: 23px;
    height: 23px;
  }

  .alt-sekme-link span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .alt-sekme-link.active {
    color: var(--btt-lacivert-koyu);
  }

  .alt-sekme-link.active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 26px;
    height: 3px;
    margin-left: -13px;
    border-radius: 0 0 3px 3px;
    background: var(--btt-altin);
  }

  .alt-sekme-ana {
    justify-content: flex-end;
    padding-bottom: 9px;
    color: var(--btt-baslik);
  }

  .alt-sekme-ana-daire {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin-bottom: 2px;
    border-radius: 50%;
    border: 4px solid var(--btt-yuzey);
    background: linear-gradient(180deg, #e6c27a 0%, #c99f48 100%);
    color: #0b2d4d;
    box-shadow: 0 10px 22px -8px rgba(201, 161, 74, .85);
    transform: translateY(-10px);
  }

  .alt-sekme-ana-daire .btt-ikon {
    width: 26px;
    height: 26px;
    stroke-width: 2.4;
  }

  .alt-sekme-ana:active .alt-sekme-ana-daire {
    transform: translateY(-10px) scale(.96);
  }

  .alt-sekme-link:active {
    transform: scale(.96);
  }
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .alt-sekme-link.active { color: var(--btt-altin-acik); }
}

:root[data-tema="koyu"] .alt-sekme-link.active { color: var(--btt-altin-acik); }

/* ---------- Telefonda form düğmeleri tam genişlik ---------- */

@media (max-width: 767.98px) {
  .app-icerik main form > .btn:not(.btn-sm),
  .app-icerik main form > a.btn:not(.btn-sm) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 50px;
    margin: .6rem 0 0 !important;
    font-size: 1.02rem;
  }
}

/* ---------- Telefonda tablolar kart listesine dönüşür (bkz. site.js "data-etiket") ---------- */

@media (max-width: 767.98px) {
  .table-responsive:has(.table-mobil-kart) {
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
  }

  .table-mobil-kart,
  .table-mobil-kart > tbody {
    display: block;
    width: 100%;
  }

  .table-mobil-kart > thead {
    display: none;
  }

  .table-mobil-kart > tbody > tr {
    display: block;
    margin-bottom: .8rem;
    padding: .35rem 1rem;
    background: var(--btt-yuzey);
    border: 1px solid var(--btt-cizgi);
    border-radius: var(--btt-radius);
    box-shadow: var(--btt-golge-1);
  }

  /* Bir hücrede birden fazla etiket varsa (ör. "Tahsisli" + "Havuza Açık") taşmak yerine alt satıra geçer */
  .table-mobil-kart > tbody > tr > td {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .4rem 1rem;
    padding: .6rem 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--btt-cizgi) !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: right;
    white-space: normal !important;
  }

  .table-mobil-kart > tbody > tr > td:last-child {
    border-bottom: 0 !important;
  }

  .table-mobil-kart > tbody > tr > td::before {
    content: attr(data-etiket);
    flex-shrink: 0;
    margin-right: auto;
    font-family: var(--btt-yazi-baslik);
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-align: left;
    color: var(--btt-metin-ikincil);
  }

  .table-mobil-kart > tbody > tr > td:first-child {
    font-size: 1.02rem;
  }

  /* Bilgisi olmayan hucreler (orn. bostaki aracin "Kimde") kartta satir kalabaligi yapmasin */
  .table-mobil-kart > tbody > tr > td.btt-hucre-bos {
    display: none;
  }

  .table-mobil-kart > tbody > tr > td[data-etiket=""]::before {
    content: none;
  }

  .table-mobil-kart > tbody > tr > td[data-etiket=""] {
    justify-content: flex-end;
  }

  .table-mobil-kart > tbody > tr > td[data-etiket=""] > .btn,
  .table-mobil-kart > tbody > tr > td[data-etiket=""] > a.btn {
    flex: 1;
  }
}

/* ---------- "Bildirimleri açın" daveti ---------- */

.btt-bildirim-davet {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 1040;
  display: flex;
  gap: .9rem;
  width: min(380px, calc(100vw - 2rem));
  padding: 1.1rem 1.2rem;
  border-radius: 16px;
  background: var(--btt-bant-zemin);
  color: #fff;
  box-shadow: var(--btt-golge-3);
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .3s ease, transform .3s var(--btt-hareket);
}

.btt-bildirim-davet.btt-bildirim-davet-gorunur {
  opacity: 1;
  transform: none;
}

.btt-bildirim-davet-ikon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .12);
  color: var(--btt-altin-acik);
}

.btt-bildirim-davet-ikon svg {
  width: 24px;
  height: 24px;
}

.btt-bildirim-davet-metin strong {
  display: block;
  font-family: var(--btt-yazi-serif);
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.15;
}

.btt-bildirim-davet-metin p {
  margin: .35rem 0 .85rem;
  font-size: .92rem;
  color: rgba(255, 255, 255, .8);
}

.btt-bildirim-davet-dugmeler {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.btt-bildirim-davet-sonra {
  color: rgba(255, 255, 255, .8);
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .25);
}

.btt-bildirim-davet-sonra:hover {
  color: #fff;
  background: rgba(255, 255, 255, .1);
}

/* Telefonda alt sekme çubuğunun hemen üstünde, tam genişlik */
@media (max-width: 991.98px) {
  .btt-bildirim-davet {
    left: .75rem;
    right: .75rem;
    bottom: calc(76px + env(safe-area-inset-bottom));
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btt-bildirim-davet {
    transition: none;
  }
}

/* ---------- Durum / hata sayfaları ---------- */

.btt-durum-sayfasi {
  max-width: 34rem;
  margin: 3rem auto;
  padding: 2.5rem 2rem;
  text-align: center;
  background: var(--btt-yuzey);
  border: 1px solid var(--btt-cizgi);
  border-radius: 18px;
  box-shadow: var(--btt-golge-2);
}

.btt-durum-kod {
  margin-bottom: .5rem;
  font-family: var(--btt-yazi-serif);
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
  color: var(--btt-altin);
}

.btt-durum-baslik {
  font-family: var(--btt-yazi-serif);
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--btt-baslik);
  text-wrap: balance;
}

.btt-durum-aciklama {
  max-width: 28rem;
  margin: .75rem auto 1.5rem;
  color: var(--btt-metin-ikincil);
}

.btt-durum-kimlik code {
  font-size: .8rem;
}

.btt-durum-aksiyonlar {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .6rem;
}

/* ---------- Bildirimler, menüler, modallar ---------- */

.btt-zil-rozet {
  background: #c8372f;
  box-shadow: 0 0 0 2px var(--btt-yuzey);
  animation: none;
}

.btt-bildirim-menu,
.dropdown-menu {
  border: 1px solid var(--btt-cizgi);
  border-radius: var(--btt-radius);
  box-shadow: var(--btt-golge-3);
}

.btt-bildirim-baslik {
  background: var(--btt-bant-zemin);
  color: #fff;
  border-bottom: 0;
}

.btt-bildirim-baslik strong {
  font-family: var(--btt-yazi-serif);
  font-size: 1.2rem;
  font-weight: 700;
}

.btt-bildirim-sayac {
  background: rgba(229, 196, 126, .2);
  color: var(--btt-altin-acik);
}

.btt-bildirim-satir-ust strong {
  font-family: var(--btt-yazi-baslik);
  font-size: .94rem;
  font-weight: 700;
}

.btt-bildirim-mesaj {
  font-size: .86rem;
}

.btt-bildirim-mesaj-tam {
  font-size: .94rem;
}

.btt-bildirim-git {
  display: inline-block;
  margin-top: .35rem;
  font-size: .86rem;
  font-weight: 600;
  color: var(--btt-altin-koyu);
}

.btt-bildirim-liste .btt-bildirim-satir {
  padding: 1rem 1.25rem;
}

.modal-content {
  border: 1px solid var(--btt-cizgi);
  border-radius: 18px;
  box-shadow: var(--btt-golge-3);
}

.modal-title {
  font-family: var(--btt-yazi-serif);
  font-weight: 700;
  font-size: 1.45rem;
  color: var(--btt-baslik);
}

/* ---------- Uyarı kutuları ---------- */

.alert {
  border-radius: 12px;
  border: 1px solid;
  box-shadow: none;
  font-weight: 500;
}

.alert-success { background: var(--ton-tamam-zemin); color: var(--ton-tamam-metin); border-color: var(--ton-tamam-cizgi); }
.alert-danger { background: var(--ton-red-zemin); color: var(--ton-red-metin); border-color: var(--ton-red-cizgi); }
.alert-warning { background: var(--ton-bekleyen-zemin); color: var(--ton-bekleyen-metin); border-color: var(--ton-bekleyen-cizgi); }
.alert-info { background: var(--ton-aktif-zemin); color: var(--ton-aktif-metin); border-color: var(--ton-aktif-cizgi); }

/* ---------- Raporlar ---------- */

.rapor-bar-satiri {
  grid-template-columns: minmax(7rem, 15rem) 1fr 2.5rem;
}

.rapor-bar-etiket {
  white-space: normal;
  overflow: visible;
  line-height: 1.25;
}

.rapor-bar-yol {
  height: .55rem;
  border-radius: 999px;
}

.rapor-bar-dolgu {
  border-radius: 999px;
  background: linear-gradient(90deg, var(--btt-lacivert-koyu), var(--btt-lacivert-acik));
}

.rapor-bar-dolgu-amber {
  background: linear-gradient(90deg, var(--btt-altin-koyu), var(--btt-altin));
}

.rapor-trend-bar {
  border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, var(--btt-lacivert-acik), var(--btt-lacivert-koyu));
}

.rapor-trend-deger {
  font-family: var(--btt-yazi-plaka);
  font-size: .95rem;
}

.rapor-trend-etiket {
  text-transform: none;
  letter-spacing: 0;
  font-size: .84rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .rapor-bar-dolgu,
  :root:not([data-tema="acik"]) .rapor-trend-bar { background: linear-gradient(90deg, #2f73b3, #5b9bd8); }
}

:root[data-tema="koyu"] .rapor-bar-dolgu,
:root[data-tema="koyu"] .rapor-trend-bar { background: linear-gradient(90deg, #2f73b3, #5b9bd8); }

/* ---------- Alt bilgi ---------- */

.btt-alt-bilgi {
  font-size: .8rem;
  background: var(--btt-yuzey);
  border-top: 1px solid var(--btt-cizgi);
}

.btt-alt-bilgi strong {
  color: var(--btt-baslik);
}

/* ---------- Klavye odağı: her zaman görünür ---------- */

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.kc-link:focus-visible,
a.btt-bildirim-satir:focus-visible {
  outline: 2px solid var(--btt-lacivert-acik);
  outline-offset: 2px;
  box-shadow: none;
}

.kc a:focus-visible,
.kc button:focus-visible,
.btt-karsilama a:focus-visible,
.giris-sahne a:focus-visible {
  outline-color: var(--btt-altin-acik);
}

/* ---------- Hareket azaltma tercihi ---------- */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-delay: 0s !important;
    transition-duration: .01ms !important;
  }

  .btt-karsilama-hat path,
  .giris-hat path {
    stroke-dashoffset: 0;
  }
}

/* ---------- Renk semasi ---------- */
/* Tarayiciya hangi temanin cizildigini soyler: yerel kontroller (secim listeleri, kaydirma
   cubugu, otomatik doldurma) temaya uyar. Acik temada "only light": telefondaki otomatik koyu
   mod (Chrome, Samsung Internet) sayfayi kendi basina karartmaz; koyu temayi site kendisi ciziyor. */
:root { color-scheme: only light; }
:root[data-tema="koyu"] { color-scheme: dark; }

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) { color-scheme: dark; }
}
