/* genel-bakis-v3.css — Genel Bakış v3 · 26.09.2026 (bkz. js başlığı) */
.gb3 {
  --gb3-bordo: #681620;
  --gb3-yuzey: var(--surface, #fff);
  --gb3-zemin: var(--surface-2, #f7f4f4);
  --gb3-cizgi: var(--border, #e7e1e1);
  --gb3-yazi: var(--text, #1a1a1a);
  --gb3-yazi2: var(--text-secondary, #5b5456);
  --gb3-yazi3: var(--text-tertiary, #8a8184);
  --gb3-uyari: #b45309; --gb3-kritik: #b91c1c; --gb3-iyi: #15803d;
  --gb3-y1: #d9c7ca; --gb3-y2: #c77a86; --gb3-y3: #8f1f2e;       /* bekleme süresi: tek ton (bordo) açık→koyu */
  --gb3-f1: #15803d; --gb3-f2: #d97706; --gb3-f3: #64748b;
  --gb3-k1: #b23a48; --gb3-k2: #f59e0b; --gb3-k3: #2563eb; --gb3-k4: #0d9488; --gb3-k5: #7c3aed;
  color: var(--gb3-yazi); max-width: 1320px; margin: 0 auto; padding: 4px 0 24px;
}
body.dark .gb3, [data-theme="dark"] .gb3 {
  --gb3-zemin: rgba(255,255,255,.04); --gb3-y1: #4a3337; --gb3-y2: #9b4d5a; --gb3-y3: #d8707f;
  --gb3-k1: #c24a5b; --gb3-k2: #c98500; --gb3-k3: #3b7de0; --gb3-k4: #199e8c; --gb3-k5: #8c6ee6;
  --gb3-uyari: #f59e0b; --gb3-kritik: #f87171; --gb3-iyi: #4ade80;
}
.gb3.tazeleniyor .gb3-kart, .gb3.tazeleniyor .gb3-kutu { opacity: .6; transition: opacity .2s; }

.gb3-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.gb3-bas h1 { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -.3px; }
.gb3-bas p { margin: 2px 0 0; font-size: 13px; color: var(--gb3-yazi3); }
.gb3-yenile { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: var(--gb3-yazi2); border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 13px; cursor: pointer; min-height: 36px; }
.gb3-yenile span { font-size: 16px; }
.gb3-yenile small { font-size: 12px; font-variant-numeric: tabular-nums; }

/* ── bekleyen işler: 4 kutu ─────────────────────────────────────────────── */
.gb3-kutular { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.gb3-kutu { position: relative; display: flex; flex-direction: column; gap: 6px; text-align: left; font: inherit; color: inherit; cursor: pointer;
  background: var(--gb3-yuzey); border: 1px solid var(--gb3-cizgi); border-radius: 16px; padding: 14px 16px 14px; min-height: 132px;
  box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.gb3-kutu:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -12px rgba(104,22,32,.35); border-color: color-mix(in srgb, var(--gb3-bordo) 35%, var(--gb3-cizgi)); }
.gb3-kutu:focus-visible, .gb3-kart button:focus-visible, .gb3-vurus:focus-visible { outline: 2px solid var(--gb3-bordo); outline-offset: 2px; }
.gb3-kutu-bas { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--gb3-yazi2); }
.gb3-ik { width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--gb3-bordo) 9%, transparent); font-size: 15px; }
.gb3-ok { margin-left: auto; font-size: 20px; color: var(--gb3-yazi3); line-height: 1; }
.gb3-deger { font-size: 38px; font-weight: 800; letter-spacing: -1px; line-height: 1; color: var(--gb3-yazi); }
.gb3-deger i { font-style: normal; font-size: 20px; font-weight: 700; color: var(--gb3-yazi3); }
.gb3-deger.uyari { color: var(--gb3-bordo); }
.gb3-deger.hata { color: var(--gb3-kritik); }
.gb3-alt { font-size: 12.5px; color: var(--gb3-yazi2); line-height: 1.35; }
.gb3-alt b { color: var(--gb3-yazi); }
.gb3-yas { display: flex; gap: 2px; height: 6px; border-radius: 99px; overflow: hidden; margin-top: auto; background: var(--gb3-zemin); }
.gb3-yas i { display: block; height: 100%; }
.gb3-yas i:first-child { border-radius: 99px 0 0 99px; } .gb3-yas i:last-child { border-radius: 0 99px 99px 0; }
.y1 { background: var(--gb3-y1); } .y2 { background: var(--gb3-y2); } .y3 { background: var(--gb3-y3); }
.gb3-yas-et { display: flex; gap: 10px; flex-wrap: wrap; font-size: 11px; color: var(--gb3-yazi3); }
.gb3-yas-et span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.gb3-yas-et i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }

/* ── kartlar ────────────────────────────────────────────────────────────── */
.gb3-izgara { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; }
.gb3-kart { background: var(--gb3-yuzey); border: 1px solid var(--gb3-cizgi); border-radius: 16px; padding: 14px 16px 16px; min-width: 0; }
.gb3-wa { grid-column: span 6; } .gb3-mail { grid-column: span 6; }
.gb3-finans { grid-column: span 12; }
.gb3-fatura { grid-column: span 6; } .gb3-odeme { grid-column: span 6; }
.gb3-kart-bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.gb3-kart-bas h2 { margin: 0; font-size: 15px; font-weight: 800; }
.gb3-bag { border: 0; background: color-mix(in srgb, var(--gb3-bordo) 8%, transparent); color: var(--gb3-bordo); font: inherit; font-size: 12.5px; font-weight: 700; border-radius: 999px; padding: 6px 12px; cursor: pointer; min-height: 32px; white-space: nowrap; }
body.dark .gb3-bag, [data-theme="dark"] .gb3-bag { color: #e8a0aa; }
.gb3-bos { padding: 18px 4px; color: var(--gb3-yazi3); font-size: 13px; }
.gb3-hata { padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--gb3-kritik) 8%, transparent); color: var(--gb3-yazi); font-size: 13px; margin-bottom: 8px; }
.gb3-hata b { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--gb3-kritik); color: #fff; font-size: 12px; margin-right: 4px; }
.gb3-not { margin: 10px 0 0; font-size: 12.5px; color: var(--gb3-yazi2); }
.gb3-not.uyari { color: var(--gb3-uyari); }
.gb3-iskelet { display: grid; gap: 8px; } .gb3-iskelet i { display: block; height: 14px; border-radius: 6px; background: linear-gradient(90deg, var(--gb3-zemin), color-mix(in srgb, var(--gb3-cizgi) 60%, transparent), var(--gb3-zemin)); background-size: 200% 100%; animation: gb3Parla 1.2s linear infinite; }
.gb3-iskelet i:nth-child(2) { width: 80%; } .gb3-iskelet i:nth-child(3) { width: 55%; }
@keyframes gb3Parla { to { background-position: -200% 0; } }

/* WhatsApp sınıf çubukları (tek ölçü → tek renk; sorun/ödeme varsa uyarı tonu + ikon) */
.gb3-cubuklar { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.gb3-cubuk { display: grid; grid-template-columns: 150px minmax(0, 1fr) 40px; align-items: center; gap: 10px; width: 100%; border: 0; background: none; font: inherit; color: inherit; text-align: left; padding: 7px 6px; border-radius: 10px; cursor: pointer; min-height: 40px; }
.gb3-cubuk:hover { background: var(--gb3-zemin); }
.gb3-cubuk-ad { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb3-cubuk-iz { height: 12px; background: var(--gb3-zemin); border-radius: 99px; overflow: hidden; }
.gb3-cubuk-iz i { display: block; height: 100%; border-radius: 0 4px 4px 0; background: var(--gb3-bordo); min-width: 3px; }
.gb3-cubuk.sifir .gb3-cubuk-iz i { min-width: 0; }
.gb3-cubuk.acil .gb3-cubuk-iz i { background: var(--gb3-kritik); }
.gb3-cubuk.sonuk .gb3-cubuk-iz i { background: var(--gb3-yazi3); opacity: .55; }
body.dark .gb3-cubuk-iz i, [data-theme="dark"] .gb3-cubuk-iz i { background: #c24a5b; }
.gb3-cubuk b { text-align: right; font-size: 15px; font-variant-numeric: tabular-nums; }
.gb3-cubuk.sifir { color: var(--gb3-yazi3); }
.gb3-hatlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.gb3-hat { border: 1px solid var(--gb3-cizgi); background: var(--gb3-zemin); border-radius: 12px; padding: 8px 10px; font: inherit; color: inherit; cursor: pointer; text-align: left; display: flex; flex-direction: column; gap: 1px; min-height: 52px; }
.gb3-hat:hover { border-color: var(--gb3-bordo); }
.gb3-hat b { font-size: 18px; } .gb3-hat span { font-size: 11.5px; color: var(--gb3-yazi3); }
.gb3-hat.ozel b { color: var(--gb3-bordo); }
body.dark .gb3-hat.ozel b, [data-theme="dark"] .gb3-hat.ozel b { color: #e8a0aa; }

/* mail listesi */
.gb3-liste { list-style: none; margin: 0; padding: 0; }
.gb3-satir { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; border-bottom: 1px solid var(--gb3-cizgi); background: none; font: inherit; color: inherit; text-align: left; padding: 9px 4px; cursor: pointer; min-height: 48px; }
.gb3-liste li:last-child .gb3-satir { border-bottom: 0; }
.gb3-satir:hover { background: var(--gb3-zemin); }
.gb3-satir-ana { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.gb3-satir-ana b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb3-satir-ana small { font-size: 12px; color: var(--gb3-yazi3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb3-sure { font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 99px; background: var(--gb3-zemin); color: var(--gb3-yazi2); white-space: nowrap; }
.gb3-sure.orta { background: color-mix(in srgb, var(--gb3-uyari) 14%, transparent); color: var(--gb3-uyari); }
.gb3-sure.eski { background: color-mix(in srgb, var(--gb3-kritik) 12%, transparent); color: var(--gb3-kritik); }
.gb3-daha { min-height: 36px; margin-top: 6px; border: 0; background: none; color: var(--gb3-yazi2); font: inherit; font-size: 12.5px; cursor: pointer; padding: 6px 4px; }

/* finans */
.gb3-kpi { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.gb3-kpi div { background: var(--gb3-zemin); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gb3-kpi span { font-size: 11.5px; color: var(--gb3-yazi3); font-weight: 600; }
.gb3-kpi b { font-size: 20px; font-weight: 800; white-space: nowrap; }
.gb3-kpi b i { font-style: normal; font-size: 13px; color: var(--gb3-yazi3); }
.gb3-kpi b.arti { color: var(--gb3-iyi); } .gb3-kpi b.eksi, .gb3-tablo .eksi { color: var(--gb3-kritik); }
.gb3-lejant { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--gb3-yazi2); margin: 4px 0 2px; }
.gb3-lejant span { display: inline-flex; align-items: center; gap: 6px; }
.gb3-lejant i, .gb3-tablo th i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.gb3-grafik { width: 100%; height: auto; display: block; max-height: 260px; }
.gb3-izgara-c { stroke: var(--gb3-cizgi); stroke-width: 1; }
.gb3-eksen { fill: var(--gb3-yazi3); font-size: 11px; font-variant-numeric: tabular-nums; }
.gb3-tepe { fill: var(--gb3-yazi); font-size: 11.5px; font-weight: 700; }
.gb3-vurus { fill: transparent; cursor: pointer; }
.gb3-vurus:hover { fill: color-mix(in srgb, var(--gb3-yazi) 5%, transparent); }
.gb3-tablo-sar { overflow-x: auto; margin-top: 10px; }
.gb3-tablo { width: 100%; border-collapse: collapse; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.gb3-tablo th, .gb3-tablo td { padding: 7px 8px; text-align: right; border-bottom: 1px solid var(--gb3-cizgi); white-space: nowrap; }
.gb3-tablo th:first-child, .gb3-tablo td:first-child { text-align: left; }
.gb3-tablo th { font-size: 11.5px; color: var(--gb3-yazi3); font-weight: 700; }
.gb3-tablo th i { margin-right: 5px; vertical-align: -1px; }
.gb3-tablo tbody tr { cursor: pointer; } .gb3-tablo tbody tr:hover { background: var(--gb3-zemin); }
.gb3-tablo tfoot td { font-weight: 800; border-bottom: 0; border-top: 2px solid var(--gb3-cizgi); }
.gb3-sifir { color: var(--gb3-yazi3); }
.gb3-ipucu { position: fixed; z-index: 1300; pointer-events: none; background: var(--gb3-yuzey, #fff); color: var(--gb3-yazi); border: 1px solid var(--gb3-cizgi); border-radius: 10px; padding: 8px 10px; font-size: 12px; box-shadow: 0 10px 28px -10px rgba(0,0,0,.35); min-width: 170px; }
.gb3-ip-bas { font-weight: 800; margin-bottom: 4px; }
.gb3-ip-s { display: grid; grid-template-columns: 12px auto 1fr; gap: 6px; align-items: center; }
.gb3-ip-s i { width: 10px; height: 2px; border-radius: 1px; }
.gb3-ip-s span { color: var(--gb3-yazi3); }
.gb3-ip-t { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--gb3-cizgi); color: var(--gb3-yazi2); }

/* fatura */
.gb3-yigin { display: flex; gap: 2px; height: 14px; border-radius: 99px; overflow: hidden; background: var(--gb3-zemin); }
.gb3-yigin i { display: block; } .gb3-yigin i:first-child { border-radius: 99px 0 0 99px; } .gb3-yigin i:last-child { border-radius: 0 99px 99px 0; }
.f1 { background: var(--gb3-f1); } .f2 { background: var(--gb3-f2); } .f3 { background: var(--gb3-f3); } .gb3-yigin .bos { background: var(--gb3-zemin); }
.gb3-rakamlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.gb3-rakamlar button { border: 1px solid var(--gb3-cizgi); background: none; border-radius: 12px; padding: 10px; font: inherit; color: inherit; text-align: left; cursor: pointer; display: grid; grid-template-columns: 10px 1fr; column-gap: 8px; align-items: center; min-height: 60px; }
.gb3-rakamlar button:hover { background: var(--gb3-zemin); }
.gb3-rakamlar i { width: 10px; height: 10px; border-radius: 3px; grid-row: span 2; }
.gb3-rakamlar b { font-size: 22px; font-weight: 800; line-height: 1.05; }
.gb3-rakamlar span { font-size: 11.5px; color: var(--gb3-yazi3); grid-column: 2; }

/* ödemeler */
.gb3-odemeler { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.gb3-odemeler li { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto 36px; align-items: center; gap: 10px; padding: 6px 0; }
.gb3-od-ad { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb3-od-iz { height: 8px; background: var(--gb3-zemin); border-radius: 99px; overflow: hidden; }
.gb3-od-iz i { display: block; height: 100%; background: var(--gb3-f1); border-radius: 0 4px 4px 0; }
.gb3-odemeler b { font-size: 13.5px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.gb3-sil { width: 32px; height: 32px; border-radius: 10px; border: 1px solid var(--gb3-cizgi); background: none; color: var(--gb3-iyi); cursor: pointer; font-weight: 800; }
.gb3-sil:hover { background: color-mix(in srgb, var(--gb3-iyi) 10%, transparent); }
.gb3-toplam { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--gb3-cizgi); display: flex; justify-content: space-between; font-size: 13px; color: var(--gb3-yazi2); }
.gb3-toplam b { color: var(--gb3-yazi); font-size: 16px; }
.gb3-form { display: grid; grid-template-columns: minmax(0, 1fr) 120px auto; gap: 8px; margin-top: 10px; }
.gb3-form input { font: inherit; font-size: 16px; padding: 9px 10px; border: 1px solid var(--gb3-cizgi); border-radius: 10px; background: var(--gb3-yuzey); color: var(--gb3-yazi); min-width: 0; }
.gb3-form button { border: 0; background: var(--gb3-bordo); color: #fff; font: inherit; font-weight: 700; border-radius: 10px; padding: 0 16px; cursor: pointer; min-height: 42px; }

/* ── duyarlılık ────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .gb3-kutular { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gb3-wa, .gb3-mail, .gb3-fatura, .gb3-odeme { grid-column: span 12; }
}
@media (max-width: 768px) {
  .gb3 { padding-bottom: 96px; }
  .gb3-bas h1 { font-size: 21px; }
  .gb3-kutular { gap: 8px; }
  .gb3-kutu { padding: 12px; min-height: 118px; border-radius: 14px; }
  .gb3-deger { font-size: 30px; }
  .gb3-yas-et { display: none; }
  .gb3-kart { padding: 12px; border-radius: 14px; }
  .gb3-cubuk { grid-template-columns: 118px minmax(0, 1fr) 32px; gap: 8px; }
  .gb3-hatlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gb3-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gb3-kpi div:first-child { grid-column: span 2; }
  .gb3-rakamlar { grid-template-columns: 1fr; }
  .gb3-rakamlar button { min-height: 48px; grid-template-columns: 10px auto 1fr; }
  .gb3-rakamlar i { grid-row: auto; } .gb3-rakamlar span { grid-column: auto; }
  .gb3-form { grid-template-columns: 1fr 1fr; } .gb3-form button { grid-column: span 2; }
  .gb3-odemeler li { grid-template-columns: minmax(0, 1fr) auto 36px; } .gb3-od-iz { display: none; }
}
@media (prefers-reduced-motion: reduce) { .gb3-kutu, .gb3-iskelet i { transition: none; animation: none; } }

/* v2 (tek ekran, kaydırmasız) genel-bakis.css'i Genel Bakış'ta gövdeyi/#main'i overflow:hidden yapıyor.
   v3 kaydırılabilir bir sayfa — yalnız v3 kökü varken geri alınır (v2 seçilirse v2 kuralı aynen işler). */
body[data-page="dashboard"]:has(#gb3-root) { overflow: auto; }
body[data-page="dashboard"]:has(#gb3-root) #main { overflow: auto; }

.gb3-kart { scroll-margin-top: 72px; }
.gb3-kart.vurgu { box-shadow: 0 0 0 3px color-mix(in srgb, var(--gb3-bordo) 35%, transparent); transition: box-shadow .3s; }

/* 30.09.2026 — MOBİL DENETİM: finans tablosu kart görünümü (≤620px) + dokunma hedefleri 44px (≤768px). Masaüstü etkilenmez. */
@media (max-width: 768px) {
  .gb3-bag, .gb3-daha, .gb3-yenile { min-height: 44px; }
  .gb3-sil { width: 44px; height: 44px; }
  .gb3-odemeler li { grid-template-columns: minmax(0, 1fr) auto 44px; }
  .gb3-kutu-bas { min-width: 0; overflow-wrap: anywhere; line-height: 1.25; }
  .gb3-ik, .gb3-ok { flex-shrink: 0; }
}
@media (max-width: 620px) {
  .gb3-tablo-sar { overflow-x: visible; }
  .gb3-tablo, .gb3-tablo tbody, .gb3-tablo tfoot { display: block; width: 100%; }
  .gb3-tablo thead { display: none; }
  .gb3-tablo tbody tr, .gb3-tablo tfoot tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; padding: 10px 2px; border-bottom: 1px solid var(--gb3-cizgi); }
  .gb3-tablo td { display: block; padding: 0; border: 0; white-space: normal; text-align: left; }
  .gb3-tablo td.gb3-t-gun { order: 0; flex: 1 1 auto; min-width: 0; font-weight: 800; font-size: 14px; color: var(--gb3-yazi); }
  .gb3-tablo td.gb3-t-ciro { order: 1; flex: 0 0 auto; text-align: right; font-size: 15px; }
  .gb3-tablo td.gb3-t-ciro::before, .gb3-tablo td.gb3-t-net::before { content: attr(data-et) " "; font-size: 12px; font-weight: 600; color: var(--gb3-yazi3); }
  .gb3-tablo td.gb3-t-net { order: 2; flex: 1 1 100%; margin-top: -4px; text-align: right; font-weight: 700; font-size: 13px; color: var(--gb3-iyi); }
  .gb3-tablo td.gb3-t-net.eksi { color: var(--gb3-kritik); }
  .gb3-tablo td.gb3-t-kanal { order: 3; flex: 0 0 auto; display: inline-flex; gap: 5px; font-size: 12px; padding: 3px 8px; border-radius: 999px; background: var(--gb3-zemin); }
  .gb3-tablo td.gb3-t-kanal::before { content: attr(data-et); color: var(--gb3-yazi3); font-weight: 600; }
  .gb3-tablo td.gb3-t-bos { display: none; }
  .gb3-tablo tfoot tr { border-top: 2px solid var(--gb3-cizgi); border-bottom: 0; }
  .gb3-tablo tfoot td { border-top: 0; }
}
@media (max-width: 768px) { .gb3-form button { min-height: 44px; } }

/* 03.10.2026 — DOKUNMA HEDEFİ (Fatih §2-B kapısı: 390px'te 44px altı 0 öğe olacak).
   Ölçüldü: sekme-onizleme --genislik 390 --js genel-bakis-page.js,genel-bakis-v3.js
   -> dokunma44: 6 öğe, hepsi button.gb3-cubuk 332x40 (WhatsApp sınıf şeritleri).
   Satır 222'deki .gb3-form button kuralının aynı kalıbı. Yeni sınıf/renk/jeton YOK.
   ⏪ Geri alma: bu yorum + altındaki tek @media bloğu silinir. */
@media (max-width: 768px) {
  .gb3-cubuk { min-height: 44px; }
}

/* ── 12.10.2026 · ŞİMDİ YAPILACAKLAR — sınıf sekmeleri + gruplar + satır içi Tamam/Ertele (Fatih: «sınıf sınıf ayır») ──
   ⏪ Geri alma: bu yorumdan dosya sonuna kadar silinir + genel-bakis-v3.js içindeki kartIs bloğu .bak'tan döner. */
.gb3-is-sayac { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 12.5px; color: var(--gb3-yazi2); }
.gb3-is-rozet { font-weight: 700; padding: 2px 9px; border-radius: 99px; }
.gb3-is-rozet.kirmizi { background: color-mix(in srgb, var(--gb3-kritik) 12%, transparent); color: var(--gb3-kritik); }
.gb3-is-rozet.sari { background: color-mix(in srgb, var(--gb3-uyari) 14%, transparent); color: var(--gb3-uyari); }
.gb3-is-uyari { color: var(--gb3-uyari); }
.gb3-is-sekmeler { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 8px; scrollbar-width: thin; }
.gb3-is-sekme { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: var(--gb3-yazi2); font: inherit; font-size: 12.5px; font-weight: 600; border-radius: 999px; padding: 5px 11px; min-height: 32px; cursor: pointer; }
.gb3-is-sekme b { color: var(--gb3-yazi); }
.gb3-is-sekme:hover { background: var(--gb3-zemin); }
.gb3-is-sekme.secili { background: var(--gb3-bordo); border-color: var(--gb3-bordo); color: #fff; }
.gb3-is-sekme.secili b { color: #fff; }
.gb3-is-acil { font-style: normal; font-size: 11px; font-weight: 800; line-height: 1; min-width: 18px; padding: 3px 5px; border-radius: 99px; background: var(--gb3-kritik); color: #fff; text-align: center; }
.gb3-is-grup { margin-top: 6px; }
.gb3-is-grup + .gb3-is-grup { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--gb3-cizgi); }
.gb3-is-grup h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 4px; font-size: 13px; font-weight: 800; color: var(--gb3-yazi); }
.gb3-is-grup h3 b { font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 99px; background: var(--gb3-zemin); color: var(--gb3-yazi2); }
.gb3-is-hepsi { margin-left: auto; border: 0; background: none; color: var(--gb3-yazi3); font: inherit; font-size: 12px; cursor: pointer; padding: 4px 6px; }
.gb3-is-hepsi:hover { color: var(--gb3-bordo); }
.gb3-is-li { border-left: 4px solid #15803d; border-bottom: 1px solid var(--gb3-cizgi); }
.gb3-is-li.kirmizi { border-left-color: #b91c1c; }
.gb3-is-li.sari { border-left-color: #d97706; }
.gb3-liste .gb3-is-li:last-child { border-bottom: 0; }
.gb3-is-satir { display: flex; align-items: center; gap: 6px; }
.gb3-is-ana { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; padding: 8px 6px; cursor: pointer; }
.gb3-is-ana:hover { background: var(--gb3-zemin); }
.gb3-is-et { display: inline-block; font-weight: 700; color: var(--gb3-yazi2); }
.gb3-is-dug { display: inline-flex; gap: 4px; flex: 0 0 auto; padding-right: 4px; }
.gb3-is-dug button { border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: var(--gb3-yazi2); font: inherit; font-size: 12px; font-weight: 700; border-radius: 8px; min-width: 32px; min-height: 32px; padding: 0 8px; cursor: pointer; }
.gb3-is-dug button:hover { background: var(--gb3-zemin); color: var(--gb3-yazi); }
.gb3-is-dug button.ok { color: var(--gb3-iyi); }
.gb3-is-dug button.ok:hover { background: color-mix(in srgb, var(--gb3-iyi) 12%, transparent); }
.gb3-is-dug button:disabled { opacity: .5; cursor: wait; }
.gb3-is-geri { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; padding: 6px 10px; border-radius: 8px; background: var(--gb3-zemin); font-size: 12.5px; color: var(--gb3-yazi2); }
.gb3-is-geri button { border: 0; background: none; color: var(--gb3-bordo); font: inherit; font-weight: 800; cursor: pointer; text-decoration: underline; padding: 4px; }
body.dark .gb3-is-li, [data-theme="dark"] .gb3-is-li { border-left-color: #4ade80; }
body.dark .gb3-is-li.kirmizi, [data-theme="dark"] .gb3-is-li.kirmizi { border-left-color: #f87171; }
body.dark .gb3-is-li.sari, [data-theme="dark"] .gb3-is-li.sari { border-left-color: #f59e0b; }
body.dark .gb3-is-geri button, [data-theme="dark"] .gb3-is-geri button, body.dark .gb3-is-hepsi:hover, [data-theme="dark"] .gb3-is-hepsi:hover { color: #e8a0aa; }
@media (max-width: 768px) {
  .gb3-is-sekme, .gb3-is-dug button { min-height: 44px; }
  .gb3-is-dug button { min-width: 44px; }
  .gb3-is-hepsi { min-height: 44px; }
}
.gb3-is-hepsi { white-space: nowrap; flex: 0 0 auto; }
.gb3-is-grup h3 { flex-wrap: nowrap; min-width: 0; }
@media (max-width: 620px) {
  .gb3-is-satir:has([data-is-act="vazgec"]) { flex-wrap: wrap; }
  .gb3-is-satir:has([data-is-act="vazgec"]) .gb3-is-dug { width: 100%; justify-content: flex-end; padding: 0 4px 8px; }
}


/* ═══ 14.10.2026 — Genel Bakış v4 (Fatih: «şimdi yapılacakları profesyonel olarak sıfırdan ele al, geri kalanları güzelce dizayn et») ═══ */
.gb4 { --gb4-r: 14px; --gb4-acil: #c0262d; --gb4-yakin: #d97706; --gb4-normal: #94a3b8; --gb4-yesil: #15803d; --gb4-hover: color-mix(in srgb, var(--gb3-bordo) 5%, transparent); }
body.dark .gb4, [data-theme="dark"] .gb4 { --gb4-acil: #f87171; --gb4-yakin: #fbbf24; --gb4-normal: #64748b; --gb4-yesil: #4ade80; --gb4-hover: rgba(255,255,255,.04); }
.gb4 .gb3-bas { margin-bottom: 18px; }
.gb4-izgara { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(330px, 1fr); gap: 16px; align-items: start; }
.gb4-sag { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.gb4-tam { grid-column: 1 / -1; }
.gb4-kart { border-radius: 18px; padding: 18px 18px 14px; box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06); }
.gb4-bas { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.gb4-bas h2 { margin: 0; font-size: 17px; font-weight: 750; letter-spacing: -.2px; }
.gb4-bas p { margin: 3px 0 0; font-size: 13px; color: var(--gb3-yazi2); }
.gb4-bas p b { color: var(--gb3-yazi); font-variant-numeric: tabular-nums; }
.gb4-acil-yazi { color: var(--gb4-acil); font-weight: 650; }
.gb4-dug { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; border: 1px solid transparent; background: transparent; color: var(--gb3-yazi3); cursor: pointer; transition: background .15s, color .15s, border-color .15s; padding: 0; }
.gb4-dug:hover { background: var(--gb3-zemin); color: var(--gb3-yazi); }
.gb4-dug.cerceve { border-color: var(--gb3-cizgi); }
.gb4-dug.ok:hover { color: var(--gb4-yesil); background: color-mix(in srgb, var(--gb4-yesil) 12%, transparent); }
.gb4-dug.sil:hover { color: var(--gb4-acil); background: color-mix(in srgb, var(--gb4-acil) 10%, transparent); }
.gb4 button:focus-visible { outline: 2px solid var(--gb3-bordo); outline-offset: 2px; }
.gb4-baglanti { display: inline-flex; align-items: center; gap: 2px; border: 0; background: none; color: var(--gb3-bordo); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; padding: 4px 6px; border-radius: 8px; white-space: nowrap; }
.gb4-baglanti:hover { background: var(--gb4-hover); }
body.dark .gb4-baglanti, [data-theme="dark"] .gb4-baglanti { color: #e8a0aa; }
/* sekmeler */
.gb4-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--gb3-cizgi); }
.gb4-sekme { position: relative; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: var(--gb3-yazi2); font: inherit; font-size: 13px; font-weight: 600; padding: 6px 11px; border-radius: 999px; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.gb4-sekme:hover { border-color: color-mix(in srgb, var(--gb3-bordo) 35%, var(--gb3-cizgi)); color: var(--gb3-yazi); }
.gb4-sekme.secili { background: var(--gb3-bordo); border-color: var(--gb3-bordo); color: #fff; }
.gb4-sayi { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--gb3-zemin); color: var(--gb3-yazi2); font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.gb4-sekme.secili .gb4-sayi { background: rgba(255,255,255,.22); color: #fff; }
.gb4-nokta { position: absolute; top: -2px; right: -2px; width: 9px; height: 9px; border-radius: 50%; background: var(--gb4-acil); box-shadow: 0 0 0 2px var(--gb3-yuzey); }
/* gruplar */
.gb4-grup { padding-top: 10px; }
.gb4-grup + .gb4-grup { margin-top: 6px; border-top: 1px dashed var(--gb3-cizgi); }
.gb4-grup header { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.gb4-grup-ad { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--gb3-yazi3); }
.gb4-grup header .gb4-baglanti { margin-left: auto; font-size: 12.5px; }
.gb4-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
/* satır */
.gb4-satir { position: relative; display: flex; align-items: center; gap: 6px; border-radius: 12px; padding-left: 4px; transition: background .12s; }
.gb4-satir::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 3px; background: var(--gb4-normal); }
.gb4-satir.o-acil::before { background: var(--gb4-acil); }
.gb4-satir.o-yakin::before { background: var(--gb4-yakin); }
.gb4-satir:hover { background: var(--gb4-hover); }
.gb4-satir-ana { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; padding: 10px 8px 10px 10px; border-radius: 12px; }
.gb4-sinif { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--gb3-zemin); color: var(--gb3-yazi2); }
.gb4-sinif.s-devir { background: color-mix(in srgb, var(--gb4-acil) 11%, transparent); color: var(--gb4-acil); }
.gb4-sinif.s-imalat { background: color-mix(in srgb, #7c3aed 11%, transparent); color: #7c3aed; }
.gb4-sinif.s-aday { background: color-mix(in srgb, #0d9488 12%, transparent); color: #0d9488; }
.gb4-sinif.s-wa { background: color-mix(in srgb, #16a34a 12%, transparent); color: #16a34a; }
.gb4-sinif.s-mail { background: color-mix(in srgb, #2563eb 11%, transparent); color: #2563eb; }
.gb4-metin { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gb4-metin b { font-size: 14px; font-weight: 650; color: var(--gb3-yazi); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb4-metin b i { font-style: normal; font-weight: 500; color: var(--gb3-yazi3); font-size: 12.5px; }
.gb4-metin small { font-size: 12.5px; color: var(--gb3-yazi2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb4-et { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; margin-right: 6px; border-radius: 6px; background: var(--gb3-zemin); color: var(--gb3-yazi2); vertical-align: 1px; }
.gb4-et.acil { background: color-mix(in srgb, var(--gb4-acil) 12%, transparent); color: var(--gb4-acil); }
.gb4-yas { flex: none; font-size: 12px; font-weight: 600; color: var(--gb3-yazi3); font-variant-numeric: tabular-nums; padding: 3px 8px; border-radius: 999px; background: var(--gb3-zemin); }
.gb4-yas.orta { color: var(--gb4-yakin); background: color-mix(in srgb, var(--gb4-yakin) 12%, transparent); }
.gb4-yas.eski { color: var(--gb4-acil); background: color-mix(in srgb, var(--gb4-acil) 11%, transparent); }
.gb4-eylem { flex: none; display: flex; gap: 2px; padding-right: 6px; opacity: 0; transition: opacity .12s; }
.gb4-satir:hover .gb4-eylem, .gb4-satir:focus-within .gb4-eylem { opacity: 1; }
@media (hover: none) { .gb4-eylem { opacity: 1; } }
.gb4-ertele { flex: none; display: flex; gap: 4px; padding-right: 6px; }
.gb4-ertele button { border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: var(--gb3-yazi); font: inherit; font-size: 12.5px; font-weight: 600; padding: 5px 10px; border-radius: 999px; cursor: pointer; }
.gb4-ertele button:hover { border-color: var(--gb3-bordo); color: var(--gb3-bordo); }
.gb4-ertele button.vazgec { color: var(--gb3-yazi3); border-color: transparent; }
.gb4-daha { display: block; width: 100%; margin-top: 4px; border: 0; background: none; color: var(--gb3-yazi2); font: inherit; font-size: 13px; font-weight: 600; padding: 8px; border-radius: 10px; cursor: pointer; }
.gb4-daha:hover { background: var(--gb4-hover); color: var(--gb3-yazi); }
.gb4-geri { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 10px 0 2px; padding: 9px 12px; border-radius: 12px; background: var(--gb3-yazi); color: var(--gb3-yuzey); font-size: 13px; }
.gb4-geri button { border: 0; background: none; color: inherit; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.gb4-uyari { margin: -6px 0 10px; font-size: 12.5px; color: var(--gb3-uyari); }
.gb4-bos { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 12px; text-align: center; color: var(--gb3-yazi2); }
.gb4-bos span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: color-mix(in srgb, var(--gb4-yesil) 12%, transparent); color: var(--gb4-yesil); }
.gb4-bos b { color: var(--gb3-yazi); font-size: 15px; }
.gb4-bos small { font-size: 12.5px; max-width: 340px; }
/* faturalar */
.gb4-statlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.gb4-stat { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; border: 1px solid var(--gb3-cizgi); background: var(--gb3-yuzey); color: inherit; font: inherit; padding: 10px 12px; border-radius: 12px; cursor: pointer; transition: border-color .15s, background .15s; position: relative; overflow: hidden; }
.gb4-stat::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--gb3-f3); }
.gb4-stat.f1::after { background: var(--gb3-f1); } .gb4-stat.f2::after { background: var(--gb4-acil); }
.gb4-stat:hover { background: var(--gb4-hover); border-color: color-mix(in srgb, var(--gb3-bordo) 30%, var(--gb3-cizgi)); }
.gb4-stat b { font-size: 24px; font-weight: 800; letter-spacing: -.5px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.gb4-stat span { font-size: 12.5px; font-weight: 600; color: var(--gb3-yazi2); }
.gb4-stat small { font-size: 11px; color: var(--gb3-yazi3); }
.gb4-alt-bas { font-size: 11.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--gb3-yazi3); margin: 4px 0 4px; }
.gb4-liste.kucuk .gb4-satir-ana { padding: 8px 8px 8px 10px; }
.gb4-not { margin: 10px 2px 0; font-size: 12.5px; color: var(--gb3-yazi2); }
.gb4-not.uyari { color: var(--gb3-uyari); font-weight: 600; }
.gb4-not.iyi { color: var(--gb4-yesil); font-weight: 600; }
@media (max-width: 1080px) { .gb4-izgara { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .gb4-kart { padding: 14px 12px 10px; border-radius: 16px; }
  .gb4-sekmeler { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .gb4-sinif { width: 30px; height: 30px; }
  .gb4-statlar { gap: 6px; }
  .gb4-stat b { font-size: 20px; }
}

/* 14.10 v4 telefon düzeltmesi: butonlar satırın altına, sekmeler tek satır */
.gb4-sekme { white-space: nowrap; flex: none; }
@media (max-width: 640px) {
  .gb4-satir { flex-wrap: wrap; }
  .gb4-satir-ana { flex-basis: 100%; gap: 10px; padding-right: 6px; }
  .gb4-eylem, .gb4-ertele { width: 100%; justify-content: flex-end; padding: 0 6px 6px; margin-top: -8px; flex-wrap: wrap; }
  .gb4-dug { width: 32px; height: 32px; }
  .gb4-grup header { flex-wrap: wrap; }
}
@media (max-width: 640px) { .gb4-eylem { opacity: 1; } }