/* ==========================================================================
   mmg-module.css — Yeni modüllerin (Stok / Risk / Portföy / Tahsilat Makbuzu)
   ORTAK görünümü. Mevcut hesaplama sayfalarındaki renk değişkenleri, panel ve
   tablo diliyle birebir uyumlu tutuldu ki site tek parça hissettirsin.
   ========================================================================== */
:root{
  --bg:#0D1420; --surface:#141C2B; --surface-2:#1B2536; --hairline:#2A3448;
  --text:#EAEDF3; --muted:#8D96AC; --brass:#C6A15B; --brass-dim:#8A7440;
  --red:#E2544B; --amber:#E3A23C; --teal:#3FB68A;
  --coral:#FF6B4A; --magenta:#D6407A; --violet:#7C4DD9; --azure:#3E8FE0;
  /* 2026-08-27 görsel denetim — yarıçap/genişlik jetonları (tek kaynak) */
  --r-kart:14px; --r-dugme:8px; --r-hap:999px; --w-metin:860px; --w-modul:1480px;
}
html.theme-light{
  --bg:#F4F5F7; --surface:#FFFFFF; --surface-2:#EEF0F3; --hairline:#DCE0E6;
  --text:#1B2230; --muted:#6B7383; --brass:#9A7B3F; --brass-dim:#B8A06C;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ background:var(--bg); }
body{
  background:radial-gradient(1200px 600px at 85% -10%, rgba(198,161,91,0.08), transparent 60%),
             radial-gradient(900px 500px at -10% 20%, rgba(79,163,196,0.06), transparent 60%), var(--bg);
  color:var(--text); font-family:'Inter',sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased; padding-bottom:50px;
}
header.masthead{
  max-width:1480px; margin:0 auto; padding:28px 22px 18px; display:flex;
  justify-content:space-between; align-items:flex-end; border-bottom:1px solid var(--hairline);
  flex-wrap:wrap; gap:14px;
}
header.masthead > div:first-child{ flex:1 1 0%; min-width:0; }
@media (max-width:700px){
  header.masthead{ flex-direction:column; align-items:stretch; }
  header.masthead > div:first-child{ flex:1 1 auto; width:100%; }
  header.masthead .top-actions{ width:100%; }
}
h1.title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(22px,3.4vw,32px); letter-spacing:-0.01em; }
.subtitle{ color:var(--muted); font-size:13px; margin-top:5px; max-width:760px; }
.back-link{
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text); font-weight:600;
  text-decoration:none; border:1px solid var(--hairline); padding:8px 14px; border-radius:6px;
  white-space:nowrap; background:var(--surface-2); box-shadow:0 6px 16px rgba(0,0,0,0.35);
}
.back-link:hover{ color:var(--coral); border-color:var(--coral); }
main{ max-width:1480px; margin:0 auto; padding:20px 22px 24px; }

.panel{ background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-kart,14px); padding:16px; margin-bottom:16px; }
.panel-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; margin-bottom:2px; }
.panel-desc{ color:var(--muted); font-size:12px; margin-bottom:14px; }

.tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.tab{
  background:var(--surface-2); border:1px solid var(--hairline); color:var(--muted);
  padding:8px 14px; border-radius:var(--r-dugme,8px); font-size:13px; font-weight:600; cursor:pointer;
  font-family:'Inter',sans-serif;
}
.tab.active{ color:var(--text); border-color:var(--brass); background:rgba(198,161,91,0.12); }

/* 🔑 STANDART 3 — GİRİŞ ALANI ETİKETLERİ (2026-08-31, kullanıcı: "başlıklar kelimeler
   alt alta", "vb yi yukarı yaz"). Etiket KESİLMEZ; sığmıyorsa KELİME SINIRINDA alt
   satıra iner (harf ortasından bölünmez → `word-break:normal`, `hyphens:none`).
   📏 `min-height:2.05em` + ızgarada `align-items:end`: etiket 1 ya da 2 satır olsun,
      aynı satırdaki bütün kutular AYNI Y'de başlar. ⛔ nowrap yazma. */
label.fl{ display:block; font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:4px; font-weight:600;
  white-space:normal; overflow-wrap:break-word; word-break:normal; hyphens:none; line-height:1.2; }
input, select, textarea{
  width:100%; height:34px; background:var(--bg); border:1px solid var(--hairline); border-radius:8px;
  padding:0 10px; color:var(--text); font-family:'Inter',sans-serif; font-size:13px; outline:none;
}
textarea{ height:auto; padding:8px 10px; resize:vertical; }
input:focus, select:focus, textarea:focus{ border-color:var(--brass); box-shadow:0 0 0 3px rgba(198,161,91,0.12); }
input.num{ font-family:'JetBrains Mono',monospace; font-weight:600; text-align:right; }
/* `align-items:end` (STANDART 3): iki satırlık etiket satırı yükseltir, ama bütün
   hücreler ALTTAN hizalandığı için kutuların üst kenarı yine aynı Y'de kalır.
   `.form-grid > * { align-self:end }` — sayfanın kendi `align-self` verdiği hücreler
   hariç; onlar kendi kuralını korur (daha özgül seçici kazanır). */
.form-grid{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); align-items:end; }
.form-grid > *{ align-self:end; min-width:0; }
.form-grid label.fl{ display:flex; align-items:flex-end; min-height:2.05em; }

.btn{
  height:34px; padding:0 16px; border-radius:var(--r-dugme,8px); border:1px solid var(--hairline);
  background:var(--surface-2); color:var(--text); font-size:13px; font-weight:600; cursor:pointer;
  font-family:'Inter',sans-serif; white-space:nowrap;
}
.btn:hover{ border-color:var(--brass); }
.btn.primary{ background:var(--brass-fill,#C6A15B); border-color:var(--brass); color:var(--brass-fill-ink,#101725); }
.btn.primary:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }
/* 📏 30.08.2026 — mmg-sayfa-standart.js'teki `html.theme-light .btn:not(.ghost){color:#fff!important}`
   kuralı, DOLU OLMAYAN .btn'i de beyaza çeviriyordu: zemin var(--surface-2)=#EEF0F3 üzerinde
   beyaz yazı = 1,1 kontrast (görünmez). O kural artık gereksiz — dolu düğmeler kendi
   --brass-fill-ink yazısını taşıyor. Burada daha özgül seçiciyle sade .btn geri alınıyor. */
html.theme-light .btn:not(.primary):not(.ghost){ color:var(--text) !important; }
/* .danger kırmızısı bu !important'a kurban gitmesin — eşit özgüllük + sonra gelir.
   Açık zeminde (#EEF0F3) --red #E2544B 3,2 kontrast veriyordu; #B3261E = 5,7 (ölçüldü). */
html.theme-light .btn.danger:not(.ghost){ color:#B3261E !important; }
.btn.primary:hover{ filter:brightness(1.08); }
.btn.danger{ color:var(--red); }
.btn.danger:hover{ border-color:var(--red); }
.btn-row{ display:flex; gap:8px; flex-wrap:wrap; }

table{ width:100%; border-collapse:collapse; font-size:12.5px; }
/* 🔑 KULLANICI KURALI (2026-08-20): "BAŞLIKLAR DA HER ZAMAN ORTALI OLSUN HER YERDE,
   HATIRLATMAMA GEREK YOK." → tüm modüllerde tablo başlıkları ORTALI. Sayfa sayfa
   `text-align` yazma; tek kaynak burasıdır. Hücreler (td) hizasını korur. */
/* 🔑 STANDART 1 — TABLO BAŞLIĞI KESİLMEZ (2026-08-31, kullanıcı: "ALT ALTA YAZ KESME").
   Kanıt: "KULL. TARİ…" (Teminat listesi), "TAHSİL EDİLEN", "VADESİ GEÇEN ALACAK" dar
   sütunlarda kırpılıyordu. `white-space:nowrap` başlığı tek satıra zorluyor, dar sütunda
   `overflow:hidden` + `text-overflow:ellipsis` ile ÜÇ NOKTAYA düşüyordu.
   📏 Kural: th SARAR (iki–üç satır olabilir), ASLA kırpılmaz. Satır yüksekliği sıkı (1.15).
   📏 `vertical-align:bottom` — bir başlık iki satır olunca diğerleri KAYMASIN, hepsi
      aynı taban çizgisinden başlasın.
   ⛔ Başlıkta `text-overflow:ellipsis` YASAK. (Veri hücrelerinde serbest — orada `title`
      ile tam metin verilir.)
   ⛔ Buraya `white-space:nowrap` geri koyma; site geneli kural mmg-sayfa-standart.js
      içindeki #mmgGorunumStandardi yaprağıdır, burası onun CSS'teki tek kaynağıdır. */
thead th{
  text-align:center; font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted);
  font-weight:700; padding:8px 8px; border-bottom:1px solid var(--hairline);
  white-space:normal; overflow-wrap:break-word; word-break:normal; hyphens:auto;
  line-height:1.15; vertical-align:bottom; text-overflow:clip; overflow:visible;
}
tbody td{ padding:7px 8px; border-bottom:1px solid var(--hairline); vertical-align:middle; }
tbody tr:hover{ background:var(--surface-2); }
/* 🔑 TUTAR HÜCRELERİ TEK SATIR (2026-08-04, kullanıcı: "gereksiz TL işareti altta, yanına çek").
   Uzun tutarlarda "84.787.132,21" satıra sığıyor ama "₺" alt satıra kayıyordu. `nowrap` ile
   sayı ve para simgesi ASLA ayrılmaz. Tüm modüller bu tek kuraldan beslenir — sayfa sayfa
   düzeltme YAPMA. */
td.num{ text-align:right; font-family:'JetBrains Mono',monospace; font-weight:600; white-space:nowrap; }
/* Başlık hücresi SARAR (STANDART 1). Tek satır zorlaması yalnız VERİ hücrelerinde
   (td.num) geçerlidir — orada sayı ile para simgesi ayrılmamalı. */
th.num{ font-family:'JetBrains Mono',monospace; font-weight:700; white-space:normal; }
.table-wrap{ overflow-x:auto; }
.empty{ color:var(--muted); font-size:13px; text-align:center; padding:26px 10px; }

/* 🔑 STANDART 2 — SAYI KUTULARI "100.000.000,00 TL" SIĞDIRIR (2026-08-31,
   kullanıcı: "BU KUTULARI GENİŞLET 100.000.000,00 TL SIĞACAK ŞEKİLDE").
   ÖLÇÜLDÜ: minmax(160px) ile kart iç genişliği 160−28=132px kalıyordu; referans tutar
   20px Space Grotesk'te ~194px → sayı ile "TL" AYRI SATIRA düşüyordu.
   📏 Kural: en dar kart, referans tutarı TEK SATIRDA taşıyacak kadar geniş (200px).
   📏 Kart hâlâ dar kalırsa (sayfanın kendi ızgarası) mmg-sayfa-standart.js'teki
      `mmgSayiSigdir()` yazı boyunu ÖLÇEREK küçültür — satır ASLA bölünmez. */
.kpis{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); margin-bottom:14px; }
.kpi{ background:var(--surface-2); border:1px solid var(--hairline); border-radius:var(--r-kart,14px); padding:12px 14px; }
.kpi .k{ font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); font-weight:700; }
/* `white-space:nowrap` (2026-08-04): para simgesi alt satıra kaymaz. */
/* `white-space:nowrap` (2026-08-04): para simgesi alt satıra kaymaz.
   `tabular-nums` (2026-08-31): rakamlar eşit genişlikte → kartlar arasında sayılar
   hizalı görünür. `min-width:0` — ızgara hücresi sayıyı sıkıştırmasın, taşma
   ölçülebilsin ki `mmgSayiSigdir()` küçültmeye karar verebilsin. */
.kpi .v{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:20px; margin-top:3px; letter-spacing:-0.01em; white-space:nowrap; font-variant-numeric:tabular-nums; min-width:0; }
.kpi .v.good{ color:var(--teal); } .kpi .v.bad{ color:var(--red); } .kpi .v.warn{ color:var(--amber); }

.badge{ display:inline-block; padding:2px 8px; border-radius:var(--r-hap,999px); font-size:11px; font-weight:700; line-height:1.6; white-space:nowrap; }
.badge.ok{   background:rgba(63,182,138,0.15); color:var(--teal); }
.badge.warn{ background:rgba(227,162,60,0.15); color:var(--amber); }
.badge.bad{  background:rgba(226,84,75,0.15);  color:var(--red); }
.badge.mut{  background:rgba(141,150,172,0.15); color:var(--muted); }

.icon-btn{ background:none; border:none; color:var(--muted); cursor:pointer; font-size:15px; line-height:1; padding:2px 5px; border-radius:5px; }
.icon-btn:hover{ color:var(--red); background:rgba(226,84,75,0.12); }

@media (max-width:720px){
  header.masthead{ padding:20px 14px 14px; }
  main{ padding:16px 14px 20px; }
  .panel{ padding:13px; }
  .form-grid{ grid-template-columns:repeat(auto-fit, minmax(130px,1fr)); }
}
/* 2026-08-27 görsel/mobil denetimi — dokunma hedefi: düğmeler 44px, ikon düğmeleri 40px */
@media (max-width:760px){
  .btn{ height:44px; }
  .icon-btn{ min-width:40px; min-height:40px; }
}
