/* =====================================================================
   Havuz Yönetim — Tasarım Sistemi
   ===================================================================== */
:root{
  --primary:#0891b2; --primary-600:#0e7490; --primary-700:#155e75;
  --primary-50:#ecfeff; --primary-100:#cffafe;
  --accent:#f59e0b;
  --ink:#0f172a; --ink-2:#334155; --muted:#64748b; --muted-2:#94a3b8;
  --line:#e2e8f0; --line-2:#eef2f6;
  --bg:#f1f5f9; --card:#ffffff;
  --sidebar-1:#0f172a; --sidebar-2:#1e293b;
  --success:#059669; --success-bg:#ecfdf5;
  --danger:#dc2626;  --danger-bg:#fef2f2;
  --warn:#d97706;    --warn-bg:#fffbeb;
  --info:#2563eb;    --info-bg:#eff6ff;
  --radius:14px; --radius-sm:10px; --radius-lg:20px;
  --shadow:0 1px 2px rgba(15,23,42,.04),0 4px 16px rgba(15,23,42,.06);
  --shadow-lg:0 10px 40px rgba(15,23,42,.12);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--ink);
  font-size:14.5px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.01em}

/* ---------- Uygulama kabuğu ---------- */
.app-shell{display:flex;min-height:100vh}

/* ---------- Kenar çubuğu ---------- */
.sidebar{
  width:256px;flex-shrink:0;
  background:linear-gradient(180deg,var(--sidebar-1),var(--sidebar-2));
  color:#cbd5e1;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;
  /* iOS Safari'de 100vh adres çubuğu AÇIKKEN gerçek ekrandan uzundur: menünün
     dibi (Yönetici + Çıkış) çubuğun arkasında kalıyordu. dvh gerçek yüksekliği
     izler; eski tarayıcılar üstteki 100vh ile çalışmaya devam eder. */
  height:100dvh;
}
.sidebar-brand{
  display:flex;align-items:center;gap:11px;
  padding:20px 20px 18px;color:#fff;
}
.sidebar-brand .logo{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:linear-gradient(135deg,var(--primary),#22d3ee);
  display:grid;place-items:center;box-shadow:0 4px 14px rgba(8,145,178,.45);
}
.sidebar-brand b{font-size:16px;font-weight:800;letter-spacing:-.02em;display:block;line-height:1.1}
.sidebar-brand span{font-size:11px;color:#94a3b8;font-weight:500}
/* min-height:0 ŞART: kolon flex'te ögenin varsayılan min-height'ı "auto"dur,
   içerik uzayınca .nav küçülmeyi reddedip alt bölümü ekran dışına itiyordu —
   kısa telefon ekranında Çıkış düğmesine hiç ulaşılamıyordu. */
.nav{padding:8px 12px;overflow-y:auto;flex:1;min-height:0}
.nav-group{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:#64748b;
  padding:14px 12px 6px;font-weight:700}
.nav a{
  display:flex;align-items:center;gap:11px;
  padding:9px 12px;border-radius:10px;color:#cbd5e1;
  font-weight:500;margin-bottom:2px;transition:.15s;
}
.nav a svg{width:18px;height:18px;flex-shrink:0;opacity:.85}
.nav a .nav-badge{margin-left:auto;background:var(--danger);color:#fff;font-size:11px;font-weight:700;
  min-width:19px;height:19px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.nav a.active{background:linear-gradient(135deg,var(--primary),var(--primary-600));color:#fff;
  box-shadow:0 4px 14px rgba(8,145,178,.4)}
.nav a.active svg{opacity:1}
/* Çentikli iPhone'larda ana ekran çizgisi düğmenin üstüne biniyordu. */
.sidebar-foot{padding:14px;padding-bottom:max(14px, env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.07)}
.user-chip{display:flex;align-items:center;gap:10px}
.user-chip .avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--primary),#22d3ee);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:14px}
.user-chip .meta{flex:1;min-width:0}
.user-chip .meta b{color:#fff;font-size:13px;font-weight:600;display:block;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-chip .meta span{font-size:11px;color:#94a3b8}

/* ---------- Ana içerik ---------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  height:64px;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:16px;padding:0 26px;
  position:sticky;top:0;z-index:20;
}
.topbar h1{font-size:19px}
.topbar .sub{color:var(--muted);font-size:12.5px;margin-top:1px}
.topbar-spacer{flex:1}
.menu-toggle{display:none;background:none;border:0;cursor:pointer;color:var(--ink)}
.content{padding:26px;max-width:1360px;width:100%}

/* ---------- Butonlar ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;justify-content:center;
  padding:9px 16px;border-radius:10px;border:1px solid transparent;
  font-weight:600;font-size:14px;cursor:pointer;transition:.15s;white-space:nowrap;
}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 2px 8px rgba(8,145,178,.35)}
.btn-primary:hover{background:var(--primary-600)}
.btn-light{background:#fff;color:var(--ink-2);border-color:var(--line)}
.btn-light:hover{background:var(--bg);border-color:var(--muted-2)}
.btn-danger{background:var(--danger);color:#fff}
.btn-ghost{background:transparent;color:var(--muted)}
.btn-ghost:hover{background:var(--bg);color:var(--ink)}
.btn-sm{padding:6px 11px;font-size:12.5px;border-radius:8px}

/* ---------- Kartlar ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow)}
.card-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line-2)}
.card-head h3{font-size:15.5px}
.card-head .sub{color:var(--muted);font-size:12.5px}
.card-body{padding:20px}
.card-pad{padding:20px}

/* ---------- Erişilebilirlik ----------
   Klavyeyle gezerken hiçbir buton/link/ızgara hücresi odak göstermiyordu; kullanıcı
   nerede olduğunu göremiyordu. :focus-visible yalnız klavye odağında görünür,
   fare tıklamasında çıkmaz. */
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:6px}
.btn:focus-visible,a:focus-visible,.slot-empty:focus-visible,.slot-busy:focus-visible,
summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* "İçeriğe atla": normalde görünmez, yalnız klavyeyle odaklanınca belirir.
   Aksi hâlde her sayfada 14 menü bağlantısı tek tek geçilmek zorundaydı. */
.skip-link{position:absolute;left:-9999px;top:0;z-index:1000}
.skip-link:focus{left:8px;top:8px;padding:10px 16px;background:var(--primary);color:#fff;
  border-radius:8px;font-weight:600;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.2)}

/* ---------- İstatistik kutuları ---------- */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:22px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;box-shadow:var(--shadow);position:relative;overflow:hidden;
  display:block;color:inherit;text-decoration:none;transition:box-shadow .15s,border-color .15s}
a.stat:hover{border-color:var(--primary);box-shadow:var(--shadow-lg)}
.stat .ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;margin-bottom:12px}
.stat .ico svg{width:22px;height:22px}
.stat .val{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1}
.stat .lbl{color:var(--muted);font-size:12.5px;margin-top:5px;font-weight:500}
.stat.c-cyan .ico{background:var(--primary-50);color:var(--primary)}
.stat.c-green .ico{background:var(--success-bg);color:var(--success)}
.stat.c-amber .ico{background:var(--warn-bg);color:var(--warn)}
.stat.c-red .ico{background:var(--danger-bg);color:var(--danger)}
.stat.c-blue .ico{background:var(--info-bg);color:var(--info)}

/* ---------- Tablolar ---------- */
.table-wrap{overflow-x:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
table.tbl th{
  text-align:left;padding:11px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);font-weight:700;border-bottom:1px solid var(--line);background:#fafbfc;white-space:nowrap}
table.tbl td{padding:12px 16px;border-bottom:1px solid var(--line-2);vertical-align:middle}
table.tbl tbody tr:hover{background:#fafcfd}
table.tbl tbody tr:last-child td{border-bottom:0}
.num{text-align:right;font-variant-numeric:tabular-nums}

/* ---------- Rozetler ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;
  font-size:11.5px;font-weight:600}
.badge-green{background:var(--success-bg);color:var(--success)}
.badge-red{background:var(--danger-bg);color:var(--danger)}
.badge-gray{background:#f1f5f9;color:var(--muted)}
.badge-blue{background:#e0f2fe;color:#0369a1}
.badge-cyan{background:var(--primary-50);color:var(--primary-700)}
.badge-amber{background:var(--warn-bg);color:var(--warn)}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block}

/* ---------- Formlar ---------- */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.form-control{
  width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:10px;
  font-size:14.5px;font-family:inherit;background:#fff;transition:.15s;color:var(--ink)}
.form-control:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}
.form-row{display:grid;gap:14px}
.hint{font-size:12px;color:var(--muted);margin-top:5px}

/* ---------- Uyarılar ---------- */
/* display:flex DEĞİL: uyarı kutularının içi düz cümle (araya <b>, <a>, tarih giren
   metinler). Flex'te her metin parçası ayrı bir öge olup sütunlara bölünüyor ve
   "Kayıtlı kurs | Başlangıç: | 5 Ağustos 2026" gibi okunmaz satırlar çıkıyordu.
   İkon+metin hizası gereken tek kutu (bookings/form.php #moveWarn) display:flex'i
   kendi satır içi stilinde veriyor. */
.alert{padding:12px 16px;border-radius:11px;font-size:13.5px;font-weight:500;
  margin-bottom:14px;display:block;line-height:1.5;border:1px solid}
.alert-success{background:var(--success-bg);color:#065f46;border-color:#a7f3d0}
.alert-error{background:var(--danger-bg);color:#991b1b;border-color:#fecaca}
.alert-info{background:var(--info-bg);color:#1e40af;border-color:#bfdbfe}

/* ---------- Giriş ekranı ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;
  background:radial-gradient(1200px 600px at 20% -10%,#155e75 0%,transparent 55%),
             radial-gradient(1000px 500px at 100% 100%,#0891b2 0%,transparent 50%),
             linear-gradient(135deg,#0f172a,#1e293b)}
.login-card{width:100%;max-width:410px;background:#fff;border-radius:20px;
  box-shadow:var(--shadow-lg);padding:38px 34px}
.login-brand{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:26px}
.login-brand .logo{width:56px;height:56px;border-radius:16px;margin-bottom:14px;
  background:linear-gradient(135deg,var(--primary),#22d3ee);display:grid;place-items:center;
  box-shadow:0 8px 24px rgba(8,145,178,.4)}
.login-brand h2{font-size:22px}
.login-brand p{color:var(--muted);font-size:13px;margin-top:4px}
.login-card .btn-primary{width:100%;padding:12px;font-size:15px;margin-top:6px}
.login-foot{text-align:center;margin-top:20px;font-size:12px;color:var(--muted-2)}

/* ---------- Girişsiz randevu sayfası ---------- */
.pub-wrap{max-width:960px;margin:0 auto;padding:22px 18px 40px}
.pub-head{display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.pub-brand{display:flex;align-items:center;gap:12px;flex:1;min-width:220px}
.pub-brand .logo{width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,var(--primary),#22d3ee);
  display:grid;place-items:center;box-shadow:0 6px 18px rgba(8,145,178,.35);flex-shrink:0}
.pub-brand h1{font-size:19px;line-height:1.2}
.pub-brand .sub{color:var(--muted);font-size:13px}
.pub-foot{text-align:center;margin-top:22px;font-size:12px;color:var(--muted-2)}
.pub-cal th.today{color:var(--primary)}
.pub-cal .pub-slot{font-weight:600;white-space:nowrap;color:var(--muted)}
.pub-cell{display:block;width:100%;border:0;border-radius:8px;padding:8px 4px;font-size:12.5px;
  font-weight:600;text-align:center;font-family:inherit}
.pub-free{background:var(--success-50,#ecfdf5);color:#047857;cursor:pointer;transition:filter .12s}
.pub-free:hover{filter:brightness(.96)}
.pub-full{background:#fef2f2;color:#b91c1c;cursor:not-allowed}
.pub-hol{background:var(--line-2,#f1f5f9);color:var(--muted);cursor:not-allowed}
.pub-radio{flex:1;min-width:200px;display:flex;gap:10px;align-items:flex-start;padding:12px;
  border:1px solid var(--line);border-radius:10px;cursor:pointer;font-weight:500}
.pub-lane{display:flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid var(--line);
  border-radius:9px;cursor:pointer;font-weight:600}
.flash-focus{outline:2px solid var(--primary);outline-offset:1px}

/* ---------- Yardımcılar ---------- */
.page-actions{display:flex;align-items:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.page-actions .spacer{flex:1}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
/* Izgara ögesinin varsayılan min-width'i "auto"dur: içindeki en geniş öge (uzun bir
   tablo satırı, geniş bir form-row) sütunu 1fr'in altına inmeye bırakmaz ve TÜM SAYFA
   yatay kayar. 375 px'te ölçüldü: /collections 509 px (134 px taşma), /groups/{id}
   460 px. min-width:0 ile taşma sıfırlanıyor, iç tablolar zaten .table-wrap içinde. */
.grid-2>*,.grid-3>*{min-width:0}
.empty{text-align:center;padding:44px 20px;color:var(--muted)}
.empty svg{width:44px;height:44px;opacity:.35;margin-bottom:10px}
.text-muted{color:var(--muted)}
.text-right{text-align:right}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.stub{display:grid;place-items:center;min-height:52vh;text-align:center;color:var(--muted)}
.stub .logo{width:64px;height:64px;border-radius:18px;margin:0 auto 16px;
  background:var(--primary-50);color:var(--primary);display:grid;place-items:center}

/* Kapsam seçimi (kulvar düzenleme: yalnız bu gün / tüm seri) */
.scope-pick{display:flex;align-items:center;gap:8px;padding:9px 13px;background:#fff;
  border:1px solid var(--primary-100);border-radius:10px;cursor:pointer;font-size:13px;font-weight:500}
.scope-pick:hover{border-color:var(--primary)}
.scope-pick:has(input:checked){border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}

/* ---------- Planlama takvimi ---------- */
.week-strip{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.week-strip a{flex:1;min-width:92px;text-align:center;padding:10px 6px;border:1px solid var(--line);
  border-radius:12px;background:#fff;transition:.15s}
.week-strip a:hover{border-color:var(--primary);background:var(--primary-50)}
.week-strip a.active{background:linear-gradient(135deg,var(--primary),var(--primary-600));color:#fff;border-color:transparent;box-shadow:0 4px 14px rgba(8,145,178,.35)}
.week-strip a.today:not(.active){border-color:var(--primary);color:var(--primary-700)}
.week-strip .dn{font-size:11px;text-transform:uppercase;letter-spacing:.04em;opacity:.85}
.week-strip .dd{font-size:19px;font-weight:800;line-height:1.1;margin-top:2px}

.grid-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
table.plan{width:100%;border-collapse:collapse;min-width:640px;table-layout:fixed}
table.plan th{background:#fafbfc;border-bottom:1px solid var(--line);border-right:1px solid var(--line-2);
  padding:11px 8px;font-size:12px;font-weight:700;color:var(--ink-2);text-align:center}
table.plan th.time-col,table.plan td.time-col{width:74px;background:#fafbfc;font-size:12px;color:var(--muted);
  font-weight:600;text-align:center;border-right:1px solid var(--line);white-space:nowrap}
table.plan td{border-bottom:1px solid var(--line-2);border-right:1px solid var(--line-2);height:52px;
  padding:3px;vertical-align:top}
.slot-empty{display:flex;align-items:center;justify-content:center;height:100%;border-radius:8px;
  color:transparent;transition:.12s;font-size:20px;font-weight:400}
.slot-empty:hover{background:var(--primary-50);color:var(--primary)}
.slot-busy{height:100%;border-radius:8px;padding:6px 8px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;line-height:1.25}
.slot-busy.ext{background:linear-gradient(135deg,#cffafe,#ecfeff);border:1px solid #a5f3fc}
.slot-busy.int{background:#f1f5f9;border:1px solid var(--line)}
.slot-busy.grp{background:linear-gradient(135deg,#ede9fe,#f5f3ff);border:1px solid #ddd6fe}
.slot-busy .cn{font-weight:700;font-size:12.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Renkli zemin üzerinde --muted (#64748b) 3:1'in altında kalıyordu; hücre
   zeminleri kimliği taşısın diye koyulaştırılınca ikinci satır iyice okunmaz
   oluyordu. --ink-2 hem beyazda hem renkli zeminde rahat okunuyor. */
.slot-busy .mt{font-size:11px;color:var(--ink-2);margin-top:1px}
.slot-cover{height:100%;border-radius:8px;background:repeating-linear-gradient(45deg,#f8fafc,#f8fafc 6px,#f1f5f9 6px,#f1f5f9 12px)}

/* ---- Planlama takvimi: dar kulvarlar + donuk (sticky) üst satır + sola sabit saat ---- */
/* Tablo KENDİ kutusunda kayar; kutunun alt kenarı ekranın altına oturtulur ki
   takvime bakarken SAYFA hiç kaymasın. Sabit "100vh - 232px" varsayımı yanlıştı:
   üstteki alan (hafta şeridi, tatil uyarısı) büyüyünce kutu ekrandan taşıyor,
   sayfa kayıyor ve yapışık başlık üst çubuğun ALTINA girip kayboluyordu.
   Gerçek değeri JS ölçüp --plan-h'ye yazar (bkz. planning/index.php); JS yoksa
   buradaki değer devreye girer. */
.plan-scroll{max-height:var(--plan-h,calc(100vh - 232px));overflow:auto}
/* Seçicilik notu: "table.plan" (0,1,1) "..plan-day" (0,1,0)'dan güçlü olduğu için
   width:100% kazanıyor ve tablo ekranı doldurup hücreleri yayvanlaştırıyordu.
   Bu yüzden kural aynı seçicilikte yazılır: table.plan.plan-day */
/* width:auto, "table-layout:fixed"i fiilen devre dışı bırakıyor (genişlik auto ise
   tarayıcı otomatik düzene döner) ve sütunlar sıkışıp hücreler yamuluyordu.
   max-content: tablo tam sütun toplamı kadar olur → hücreler gerçekten KARE kalır. */
table.plan.plan-day{width:max-content;min-width:0;table-layout:auto}
/* HÜCRELER KARE: genişlik = yükseklik. Takvim yayvan olmuyor, 5 kulvar + saat
   sütunu 600 px altına iniyor. */
.plan-day th,.plan-day td{width:104px;min-width:104px;max-width:104px}
.plan-day tbody td{height:104px}
.plan-day th.time-col,.plan-day td.time-col{width:56px;min-width:56px;max-width:56px}
.plan-day thead th{position:sticky;top:0;z-index:3;box-shadow:0 1px 0 var(--line)}  /* üst satır dondurulur */
.plan-day td.time-col{position:sticky;left:0;z-index:2} /* saat sütunu sola sabit (bonus) */
.plan-day thead th.time-col{z-index:4}
/* Saat aralıklı tatil (ör. ÖSYM sınavı): gün açık, o satır kapalı */
.plan-day tr.row-closed td{background:repeating-linear-gradient(135deg,
  var(--bg-2,#f6f7f9) 0 8px, transparent 8px 16px)}
.plan-day tr.row-closed td.time-col{color:var(--danger);font-weight:700}

/* TELEFON: kareler küçülür, 5 kulvar + saat sütunu ~360 px'e sığar.
   (5 × 60 + 44 = 344 px) Yazılar da hücreye göre küçülür. */
@media (max-width:640px){
  .plan-day th,.plan-day td{width:56px;min-width:56px;max-width:56px}
  .plan-day tbody td{height:56px}
  .plan-day th.time-col,.plan-day td.time-col{width:40px;min-width:40px;max-width:40px;font-size:10px}
  table.plan th{padding:7px 2px;font-size:10.5px}
  table.plan td{padding:2px}
  .slot-busy{padding:3px 4px;border-radius:6px}
  .slot-busy .cn{font-size:9.5px;line-height:1.15}
  .slot-busy .mt{font-size:8.5px;line-height:1.15}
  .plan-scroll{max-height:var(--plan-h,70vh)}
}

/* ---------- Kulvar bazında kişi girişi ---------- */
.lane-entry{display:flex;gap:6px;justify-content:flex-end;align-items:flex-end;flex-wrap:wrap}
.lane-in{display:flex;flex-direction:column;align-items:center;gap:2px}
.lane-in span{font-size:10.5px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.lane-in .form-control{width:52px;padding:6px 4px;text-align:center;font-weight:700}
/* Toplam rozeti kulvar kutularıyla aynı düzende: üstte etiket, altta sayı.
   Eskiden "=16" yazıyordu ve o boyutta EKSİ işareti gibi okunuyordu. */
.lane-sum b{display:grid;place-items:center;min-width:52px;padding:6px 4px;
  border-radius:9px;background:var(--bg-2,#f1f5f9);border:1px solid var(--line);
  font-weight:800;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}

/* ---------- Yoklama matrisi (8 ders × öğrenci) ---------- */
/* table.tbl ile eşit özgüllük (0,1,2) — yoksa 16px'lik genel padding kazanıyor
   ve 8 ders × öğrenci matrisi gereksiz genişleyip yatay kayıyordu. */
table.tbl.att-tbl td,table.tbl.att-tbl th{padding-left:6px;padding-right:6px}
.att-tbl .att-sel{width:56px;padding:5px 6px;text-align:center;font-weight:700}

/* ---------- Ekstre ----------
   Belge SADE: üstte 4 özet kutusu, altında TEK kronolojik döküm. Eskiden aynı
   kayıtlar iki tabloda tekrar ediliyor, altına 40 satırlık rezerve listesi
   ekleniyordu; üç ekran boyu bir belge kimse okumuyordu. */
.stmt-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 18px}
.stmt-sum .s{border:1px solid var(--line);border-radius:12px;padding:11px 13px;background:#fafbfc;
  border-top:3px solid var(--line)}
.stmt-sum .s.a{border-top-color:var(--primary)}
.stmt-sum .s.b{border-top-color:var(--warn)}
.stmt-sum .s.c{border-top-color:var(--info)}
/* Manuel borç / iade kutusu — yalnız kayıt varsa basılır (bkz. statements/index.php) */
.stmt-sum .s.d{border-top-color:var(--muted)}
.stmt-sum .s.t{border-top-color:var(--ink);background:#fff}
.stmt-sum .s span{display:block;font-size:11.5px;color:var(--muted);font-weight:700}
.stmt-sum .s b{display:block;font-size:20px;margin:3px 0 1px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.stmt-sum .s i{display:block;font-size:10.5px;color:var(--muted-2);font-style:normal}

/* Özet kutuları aynı zamanda filtre düğmesi (bkz. statements/index.php) */
.stmt-sum .s[data-filt]{cursor:pointer;transition:box-shadow .12s,border-color .12s}
.stmt-sum .s[data-filt]:hover{border-color:var(--primary)}
.stmt-sum .s.sel{box-shadow:0 0 0 2px var(--primary);border-color:var(--primary)}

/* Döküm filtresi */
.stmt-filt{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:0 0 12px}
.stmt-filt .chip{border:1px solid var(--line);background:#fff;border-radius:999px;
  padding:6px 13px;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.stmt-filt .chip:hover{border-color:var(--primary)}
.stmt-filt .chip.on{background:var(--primary);border-color:var(--primary);color:#fff}
.stmt-filt .chip span{opacity:.7;margin-left:4px;font-variant-numeric:tabular-nums}
/* Süzülmüş listede yürüyen bakiye yanıltıcı olur → sütun gizlenir */
.stmt-tbl.filt-on .bakiye-col{display:none}
/* Bugün ayracı: gerçekleşen hesap ile rezerve günleri ayırır */
.stmt-tbl tr.stmt-split{background:#eef6ff;border-top:2px solid var(--primary);
  border-bottom:1px solid var(--primary-100)}
.stmt-tbl tr.stmt-split td{padding:10px 12px;font-size:12.5px}
.stmt-tbl tr.stmt-future td{color:var(--muted)}
.stmt-tbl tr.stmt-future td:first-child{opacity:.75}

/* ÖZGÜLLÜK: table.tbl td = (0,1,2). Bu kural (0,1,1) yazılınca dosyada SONRA
   gelmesine rağmen kaybediyor ve hiç uygulanmıyordu (aynı tuzak plan-day'de de
   yaşanmıştı). Kanıtı dosyanın kendisinde: tfoot kuralı (0,1,2) olduğu için
   çalışıyor, gövde çalışmıyordu. table.tbl ile eşitlenir. */
table.tbl.stmt-tbl td,table.tbl.stmt-tbl th{padding:9px 12px}
.stmt-tbl tfoot tr{border-top:2px solid var(--ink);font-weight:800;background:#fafbfc}
table.tbl.stmt-tbl tfoot td{padding:11px 12px}   /* (0,2,3): gövde kuralını ezmeli */
.stmt-note{margin-top:14px;padding:10px 13px;border-radius:10px;background:#fafbfc;
  border:1px solid var(--line);font-size:12.5px;line-height:1.65}

@media (max-width:640px){
  .stmt-sum{grid-template-columns:repeat(2,1fr);gap:8px}
  .stmt-sum .s b{font-size:17px}
  table.tbl.stmt-tbl{font-size:12.5px}   /* (0,2,1): table.tbl font-size'unu ezer */
  table.tbl.stmt-tbl td,table.tbl.stmt-tbl th{padding:7px 8px}   /* özgüllük: bkz. satır 379 */
}
@media print{.stmt-sum .s,.stmt-note{background:#fff}}

/* ---------- Sayfalama ---------- */
.pager{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 20px;border-top:1px solid var(--line-2)}
.pager-info{font-size:12.5px;color:var(--muted)}
.pager-nav{display:flex;gap:4px;align-items:center}
.pg{min-width:34px;height:34px;padding:0 9px;border-radius:9px;border:1px solid var(--line);
  background:#fff;color:var(--ink-2);display:inline-flex;align-items:center;justify-content:center;
  font-weight:600;font-size:13px;transition:.12s}
a.pg:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-50)}
.pg.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.pg.disabled{opacity:.4;cursor:default}
.pg.dots{border:0;background:none;min-width:22px}

/* ---------- Yazdırma (ekstre) ---------- */
@media print{
  /* .alert eklendi: bir tahsilat girip ekstreye geçince "Tahsilat kaydedildi: 1.000 ₺"
     bildirimi MÜŞTERİYE GİDEN kağıdın tepesine basılıyordu. */
  .sidebar,.topbar,.page-actions,.no-print,.alert{display:none !important}
  .content{padding:0}
  .card{box-shadow:none;border:1px solid #ccc}
  body{background:#fff}
  /* Ekranda gizli, yalnız kağıtta çıkan kurum başlığı ve imza bloğu */
  .print-only{display:block !important}
  /* Çok sayfalı tabloda başlık her sayfada tekrarlansın, satır ortadan bölünmesin */
  thead{display:table-header-group}
  tr,td,th{page-break-inside:avoid}
  @page{margin:14mm}
}
.print-only{display:none}

/* ---------- Mobil ---------- */
.backdrop{display:none}
@media(max-width:900px){
  .sidebar{position:fixed;left:0;top:0;z-index:60;transform:translateX(-100%);transition:.25s;box-shadow:var(--shadow-lg)}
  body.nav-open .sidebar{transform:none}
  body.nav-open .backdrop{display:block;position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:50}
  .menu-toggle{display:grid;place-items:center}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .content{padding:18px}
}

/* ===================== Panel (dashboard) — premium ===================== */
.dash-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:16px;margin-bottom:16px}
.dash-kpi{position:relative;overflow:hidden;isolation:isolate;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px 22px;box-shadow:var(--shadow);
  display:block;color:inherit;text-decoration:none;
  transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .18s}
a.dash-kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.dash-kpi::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;
  background:linear-gradient(90deg,var(--kpi),var(--kpi2))}
.dash-kpi .wm{position:absolute;right:-16px;bottom:-22px;width:104px;height:104px;color:var(--kpi);opacity:.07;z-index:-1}
.dash-kpi .wm svg{width:100%;height:100%}
.dash-kpi .chip{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;margin-bottom:14px;
  color:#fff;background:linear-gradient(135deg,var(--kpi),var(--kpi2));box-shadow:0 6px 15px -5px var(--kpi)}
.dash-kpi .chip svg{width:22px;height:22px}
.dash-kpi .kval{font-size:29px;font-weight:800;letter-spacing:-.025em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.dash-kpi .klbl{color:var(--muted);font-size:12.5px;margin-top:7px;font-weight:600;line-height:1.35}
.dash-kpi .klbl small{display:block;font-weight:400;color:var(--muted-2);font-size:11.5px;margin-top:1px}
.dash-kpi.k-cyan {--kpi:#0891b2;--kpi2:#22d3ee}
.dash-kpi.k-blue {--kpi:#2563eb;--kpi2:#60a5fa}
.dash-kpi.k-amber{--kpi:#d97706;--kpi2:#f59e0b}
.dash-kpi.k-green{--kpi:#059669;--kpi2:#34d399}
.dash-kpi.k-red  {--kpi:#dc2626;--kpi2:#f87171}

/* Bu ay tahsilat oranı — ölçer */
.dash-meter{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);
  padding:20px 24px;margin-bottom:18px;display:grid;grid-template-columns:128px 1fr;gap:24px;align-items:center}
.dash-meter .mrate .pct{font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.dash-meter .mrate .pl{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-top:5px}
.dash-meter .mbody{min-width:0}
.dash-meter .mhead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.dash-meter .mhead h3{font-size:15px;margin:0}
.dash-meter .mhead .ms{font-size:12px;color:var(--muted)}
.dash-meter .bar{height:12px;border-radius:999px;background:var(--line-2);overflow:hidden}
.dash-meter .bar>i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--primary-700),#22d3ee);box-shadow:0 1px 4px rgba(8,145,178,.35)}
.dash-meter .mfoot{display:flex;gap:20px;flex-wrap:wrap;margin-top:12px}
.dash-meter .mf{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted);font-weight:500}
.dash-meter .mf b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.dash-meter .mf .dot{width:9px;height:9px;border-radius:3px}

/* premium kart başlığı ikonu */
.card-ico{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--primary-50);color:var(--primary);flex:none;margin-right:10px}
.card-ico svg{width:17px;height:17px}

/* profesyonel özet + aksiyon satırı */
.dash-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.dash-sum{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-2);font-weight:500}
.dash-sum .lead{width:9px;height:9px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px var(--success-bg);flex:none}
.dash-sum b{color:var(--ink);font-weight:700}
.dash-acts{display:flex;gap:8px;flex-wrap:wrap}
/* KPI tıklanabilirlik göstergesi (profesyonel mikro-etkileşim) */
.dash-kpi::after{content:"↗";position:absolute;top:14px;right:18px;font-size:15px;font-weight:700;
  color:var(--muted-2);opacity:0;transition:opacity .18s,transform .18s}
a.dash-kpi:hover::after{opacity:.9;transform:translate(2px,-2px)}

@media(max-width:640px){
  .dash-meter{grid-template-columns:1fr;gap:12px}
  .dash-meter .mrate{display:flex;align-items:baseline;gap:10px}
  .dash-meter .mrate .pl{margin-top:0}
}

/* ===================== Mobil (telefon) düzeltmeleri ===================== */
/* Izgara ögesinin varsayılan min-width'i "auto"dur: içindeki date/select kendi
   içerik genişliğinin (~150px) altına inmez ve iki kolonlu form satırı 375px'te
   kartı taşırıp "kutucuklarda kayma" yapıyordu. Aynı düzeltme .grid-2/.grid-3
   için satır 237'de zaten vardı; .form-row dışarıda kalmıştı. */
.form-row>*{min-width:0}
.form-control{min-width:0;max-width:100%}
/* Uzun alt başlık kart başlığını eziyordu; başlık sarabilmeli. */
.card-head{flex-wrap:wrap}
/* entries/holidays'te kullanılıyor ama tanımı hiç yoktu; kutu etiketinden kopuyordu. */
.check{display:inline-flex;align-items:center;gap:7px}
/* Menü açıkken arka plan kaymasın. */
body.nav-open{overflow:hidden}
@media(max-width:900px){
  /* 22px'lik menü düğmesi dokunma hedefi olarak küçüktü (öneri 44px). */
  .menu-toggle{width:42px;height:42px}
}
@media(max-width:640px){
  /* Kolon sayısı 40+ yerde satır içi stille verildiği için !important şart:
     çok kolonlu form satırları telefonda tek kolona düşer. */
  .form-row{grid-template-columns:1fr !important;gap:10px}
  /* iOS Safari 16px'ten küçük yazılı alana odaklanınca sayfayı yakınlaştırır
     ve geri çıkmaz; "ekran büyüyüp kaydı" şikâyetinin kaynağı. 16px kapatır. */
  .form-control{font-size:16px}
  /* Hafta şeridi: min-width:92px yedi günü 3 satıra sarıyordu, gün rakamı
     19px telefonda iri duruyordu. Tek satır + daha ufak rakam. */
  .week-strip{gap:4px;flex-wrap:nowrap;margin-bottom:12px}
  .week-strip a{min-width:0;flex:1 1 0;padding:7px 2px;border-radius:9px}
  .week-strip .dn{font-size:9.5px;letter-spacing:0}
  .week-strip .dd{font-size:14px}
  /* Tablo yoğunluğu: yalnız ekstreye uygulanan küçültme (bkz. stmt-tbl) tüm
     tablolara genişletilir; 8-10 kolonlu listeler gereksiz yere kayıyordu. */
  table.tbl{font-size:13px}
  table.tbl td,table.tbl th{padding:9px 10px}
  .table-wrap{-webkit-overflow-scrolling:touch}
  /* Kart içi boşluk: 40px yatay padding 375px'te alanın %12'siydi. */
  .card-body,.card-pad{padding:14px}
  .card-head{padding:13px 14px}
  /* Panel sayıları telefonda taşkın görünüyordu. */
  .stat .val{font-size:21px}
  .dash-kpi .kval{font-size:23px}
  .dash-meter .mrate .pct{font-size:28px}
  /* 31px'lik küçük düğmeler yan yana yanlış basmaya yol açıyordu. */
  .btn-sm{padding:8px 12px}
  /* Üst çubuk içerikle hizalansın (content 18px'e iner, topbar 26px kalıyordu). */
  .topbar{padding:0 14px;gap:10px}
  .topbar h1{font-size:16px;line-height:1.2}
  /* Girişsiz randevu takvimi: 8 kolon × 80px'in yarıdan fazlası ekran
     dışında kalıyordu; hücreler küçültülür. */
  table.plan.pub-cal{min-width:520px}
  .pub-cell{font-size:11px;padding:6px 2px}
  /* width:auto filtre kutusu en uzun kulüp adı kadar genişleyip sayfayı
     yatay kaydırıyordu (kişi girişi ekranı). */
  .page-actions .form-control[style*="width:auto"]{width:100% !important}
}
