/* Kazancan işletme defteri — arayüz.
   2026-08-24 yeniden tasarım.

   ÖNCEKİ TASARIMIN HATASI: sadeleştirme uğruna anlam silinmişti. Etiketsiz satırlar,
   tek kelimelik sekme adları, sütun başlıksız listeler. Kullanıcı ekrana bakıp
   "burada ne yapıyorum" sorusuna cevap bulamıyordu.

   YENİ KURAL: her şeyin adı yazar. Her sayfa ne işe yaradığını bir cümleyle söyler,
   her sütunun başlığı vardır, her sayının birimi bellidir. */

:root{
  /* Tek sıcak gri ailesi. Soğuk grilerle karıştırılmaz. */
  --zemin:#F6F2EE;
  --zemin-koyu:#EDE6DF;
  --kart:#FFFFFF;
  --metin:#241014;
  --metin2:#6A5C55;
  --soluk:#96897F;

  --mur:#6B1E2E;            /* TEK aksan rengi */
  --mur-acik:#8A2C3E;
  --mur-soluk:#F3E8EA;
  --koyu:#2A1015;

  --yesil:#2F6B3A;
  --yesil-soluk:#EAF3EB;
  --kirmizi:#A82820;
  --kirmizi-soluk:#FBEDEB;
  --sari-soluk:#FDF4E3;
  --sari-koyu:#8A5A12;

  --cizgi:#E4DAD2;
  --cizgi-koyu:#D3C5BA;

  /* Sıcak zemine sıcak gölge. Siyah gölge bu paletin üstünde kirli durur. */
  --golge-1:0 1px 2px rgba(60,35,25,.05);
  --golge-2:0 2px 4px rgba(60,35,25,.06), 0 8px 20px rgba(60,35,25,.05);
  --golge-3:0 12px 40px rgba(60,35,25,.14);

  --r-kucuk:6px; --r-orta:10px; --r-buyuk:14px;
  --tepe:64px;
  --z-tepe:20; --z-serit:15; --z-perde:40; --z-tost:50; --z-pin:60;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:var(--zemin);color:var(--metin);
  font-family:Karla,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15.5px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
  padding-top:var(--tepe);
}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:none;cursor:pointer}
.sayi{font-variant-numeric:tabular-nums}
[hidden]{display:none !important}
:focus-visible{outline:2px solid var(--mur);outline-offset:2px;border-radius:3px}

.atla{position:absolute;left:-999px;top:0;background:var(--koyu);color:#fff;
  padding:10px 16px;z-index:100;border-radius:0 0 var(--r-orta) 0}
.atla:focus{left:0}

/* ============================================================ tepe */

.tepe{
  position:fixed;top:0;left:0;right:0;z-index:var(--z-tepe);height:var(--tepe);
  background:var(--koyu);
}
.tepe-ic{
  max-width:1180px;margin:0 auto;height:100%;padding:0 24px;
  display:flex;align-items:center;gap:36px;
}
.marka{display:flex;flex-direction:column;justify-content:center;flex:none}
.marka-ad{
  font-family:"Playfair Display",Georgia,serif;font-weight:700;
  font-size:21px;color:#F6F2EE;letter-spacing:.01em;line-height:1.1;
}
.marka-alt{font-size:11px;color:#A99A90;letter-spacing:.09em;text-transform:uppercase}

.menu{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.menu::-webkit-scrollbar{display:none}
.menu button{
  padding:9px 15px;border-radius:var(--r-kucuk);white-space:nowrap;
  font-size:14.5px;font-weight:500;color:#BCAAA0;
  transition:background .18s ease,color .18s ease;
}
.menu button:hover{color:#F6F2EE;background:rgba(246,242,238,.08)}
.menu button.acik{color:var(--koyu);background:#E8DCD2;font-weight:600}

/* ============================================================ sayfa */

main{padding:30px 0 80px}
.sayfa{max-width:1180px;margin:0 auto;padding:0 24px}
/* Aylık çizelgede 31 gün sütunu var; sayfa 1180'de kalırsa ay yatay kayıyor. */
.sayfa.genis{max-width:1560px}

.sayfa-bas{
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;
  flex-wrap:wrap;padding-bottom:20px;margin-bottom:24px;
  border-bottom:1px solid var(--cizgi);
}
.sayfa-bas h1{
  font-size:27px;font-weight:700;letter-spacing:-.02em;line-height:1.15;
  margin-bottom:5px;text-wrap:balance;
}
.sayfa-bas p{font-size:14.5px;color:var(--metin2);max-width:62ch}

/* dönem seçici: sayfanın başında, adı yazan bir kontrol */
.donem{flex:none}
.donem-etiket{font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--soluk);display:block;margin-bottom:6px}
.donem-kutu{
  display:flex;align-items:stretch;background:var(--kart);
  border:1px solid var(--cizgi-koyu);border-radius:var(--r-orta);
  box-shadow:var(--golge-1);overflow:hidden;
}
.donem-ok{
  width:42px;display:grid;place-items:center;font-size:19px;color:var(--mur);
  transition:background .16s ease;
}
.donem-ok:hover{background:var(--zemin-koyu)}
.donem-ok:disabled{color:var(--cizgi-koyu);cursor:default;background:none}
.donem-orta{
  padding:9px 16px;min-width:172px;text-align:center;
  border-left:1px solid var(--cizgi);border-right:1px solid var(--cizgi);
  font-weight:600;font-size:15px;transition:background .16s ease;
}
.donem-orta small{display:block;font-size:11.5px;font-weight:400;color:var(--soluk)}
.donem-orta:hover{background:var(--zemin-koyu)}

/* ============================================================ ortak parçalar */

.kutu{background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r-buyuk);
  box-shadow:var(--golge-1)}
.kutu-bas{padding:17px 20px;border-bottom:1px solid var(--cizgi)}
.kutu-bas h2{font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.kutu-bas p{font-size:13px;color:var(--metin2);margin-top:3px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 20px;border-radius:var(--r-orta);
  background:var(--mur);color:#F6F2EE;font-size:15px;font-weight:600;
  transition:background .18s ease,transform .1s ease,box-shadow .18s ease;
  box-shadow:var(--golge-1);
}
.btn:hover{background:var(--mur-acik);box-shadow:var(--golge-2)}
.btn:active{transform:translateY(1px)}
.btn.hat{background:var(--kart);color:var(--metin);border:1px solid var(--cizgi-koyu);box-shadow:none}
.btn.hat:hover{background:var(--zemin-koyu);border-color:var(--soluk)}
.btn.tehlike{background:var(--kart);color:var(--kirmizi);border:1px solid rgba(168,40,32,.35);box-shadow:none}
.btn.tehlike:hover{background:var(--kirmizi-soluk)}
.btn.genis{width:100%}
.btn.kucuk{min-height:36px;padding:0 14px;font-size:13.5px}

.rozet{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:var(--r-kucuk);
  font-size:12.5px;font-weight:600;letter-spacing:.01em;
}
.rozet.tamam{background:var(--yesil-soluk);color:var(--yesil)}
.rozet.eksik{background:var(--kirmizi-soluk);color:var(--kirmizi)}
.rozet.bos{background:var(--zemin-koyu);color:var(--soluk)}
.rozet.uyari{background:var(--sari-soluk);color:var(--sari-koyu)}

.bos-durum{
  background:var(--kart);border:1px dashed var(--cizgi-koyu);border-radius:var(--r-buyuk);
  padding:60px 32px;text-align:center;
}
.bos-durum h2{font-size:19px;font-weight:700;margin-bottom:8px}
.bos-durum p{font-size:14.5px;color:var(--metin2);max-width:44ch;margin:0 auto 22px}

/* ============================================================ ilerleme */

.ozet{
  display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;
  background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r-buyuk);
  padding:18px 22px;margin-bottom:20px;box-shadow:var(--golge-1);
}
.ozet.bitti{background:var(--yesil-soluk);border-color:rgba(47,107,58,.28)}
.ozet-baslik{font-size:18px;font-weight:700;letter-spacing:-.01em;margin-bottom:4px}
.ozet.bitti .ozet-baslik{color:var(--yesil)}
.ozet-alt{font-size:13.5px;color:var(--metin2)}
.ozet-cubuk{width:220px;height:9px;border-radius:5px;background:var(--zemin-koyu);overflow:hidden}
.ozet-dolu{height:100%;background:var(--mur);border-radius:5px;transition:width .3s ease}
.ozet.bitti .ozet-dolu{background:var(--yesil)}

/* ============================================================ tablo */

.tablo-sar{background:var(--kart);border:1px solid var(--cizgi);
  border-radius:var(--r-buyuk);box-shadow:var(--golge-1);overflow:hidden}
table.veri{width:100%;border-collapse:collapse}
table.veri thead th{
  background:var(--zemin-koyu);text-align:left;padding:11px 20px;
  font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--metin2);border-bottom:1px solid var(--cizgi);white-space:nowrap;
}
table.veri td{padding:13px 20px;border-bottom:1px solid var(--cizgi);vertical-align:middle}
table.veri tbody tr:last-child td{border-bottom:none}
table.veri tbody tr{transition:background .14s ease}
table.veri tbody tr:hover{background:var(--zemin)}
table.veri tr.bekliyor{background:var(--kirmizi-soluk)}
table.veri tr.bekliyor:hover{background:#F8E4E1}
.hucre-sag{text-align:right}
.hucre-orta{text-align:center}

.firma-ad{font-size:16px;font-weight:600;letter-spacing:-.01em}
.firma-alt{font-size:12.5px;color:var(--soluk);margin-top:2px}

/* sayaç: tablonun içinde, etiketi sütun başlığında yazıyor */
.sayac{display:inline-flex;align-items:center;gap:0;
  border:1px solid var(--cizgi-koyu);border-radius:var(--r-orta);overflow:hidden;
  background:var(--kart);box-shadow:var(--golge-1)}
.sayac button{
  width:42px;height:44px;font-size:21px;font-weight:600;color:var(--mur);
  display:grid;place-items:center;transition:background .14s ease;
}
.sayac button:hover{background:var(--mur-soluk)}
.sayac button:disabled{color:var(--cizgi-koyu);cursor:default;background:none}
.sayac .deger{
  min-width:74px;height:44px;display:grid;place-items:center;
  border-left:1px solid var(--cizgi);border-right:1px solid var(--cizgi);
  font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;
  transition:background .14s ease;
}
.sayac .deger:hover{background:var(--zemin-koyu)}
.sayac .deger.yok{color:var(--soluk);font-weight:400;font-size:14px}

/* ============================================================ aylık çizelge

   OKUNAKLILIK KURALI (kurucu, 2026-08-24): "yaşlı insanlar da bakacak."
   Bu ekranda sıkıştırma yok. Rakam 16 px, satır 46 px, gün adı ÜÇ HARF yazılır:
   tek harfle yazınca "P" pazartesi mi perşembe mi pazar mı belli olmuyordu.
   Satırlar bir açık bir koyu, her pazartesinin soluna kalın çizgi (ay hafta
   bloklarına ayrılır), fare hangi sütundaysa o sütunun tamamı boyanır.
   Firma sütunu sola, aylık toplam sütunu sağa yapışır: kaydırırken ikisi de kaybolmaz. */

.izgara-sar{overflow:auto;-webkit-overflow-scrolling:touch;background:var(--kart);
  border:1px solid var(--cizgi-koyu);border-radius:var(--r-buyuk);box-shadow:var(--golge-1)}
table.izgara{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%}
table.izgara th,table.izgara td{
  border-right:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);
  padding:0;text-align:center}
table.izgara tr>*:last-child{border-right:0}
table.izgara tfoot tr>*{border-bottom:0}

/* --- başlık satırı: gün numarası büyük, gün adı altında --- */
table.izgara thead th{position:sticky;top:0;z-index:2;background:var(--zemin-koyu);
  min-width:38px;height:52px;padding:5px 2px;line-height:1.1;
  border-bottom:2px solid var(--cizgi-koyu)}
table.izgara thead th .gun-no{display:block;font-size:15px;font-weight:700;color:var(--metin)}
table.izgara thead th .gun-ad{display:block;font-size:10.5px;font-weight:600;margin-top:3px;
  text-transform:uppercase;letter-spacing:.03em;color:var(--soluk)}
table.izgara thead th.hs{background:#E5DAD0}
table.izgara thead th.hs .gun-no{color:var(--metin2)}
table.izgara thead th.bugun{background:var(--mur)}
table.izgara thead th.bugun .gun-no,table.izgara thead th.bugun .gun-ad{color:#FFF}

/* --- firma sütunu: sola yapışır --- */
table.izgara th.ad{position:sticky;left:0;z-index:3;background:var(--kart);
  text-align:left;padding:0 14px;min-width:184px;max-width:184px;
  font-size:15px;font-weight:600;color:var(--metin);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;text-transform:none;letter-spacing:0;
  border-right:2px solid var(--cizgi-koyu)}
table.izgara thead th.ad{z-index:4;background:var(--zemin-koyu);font-size:11.5px;
  font-weight:700;color:var(--metin2);text-transform:uppercase;letter-spacing:.08em}

/* --- gövde --- */
table.izgara tbody td{height:46px;min-width:38px}
table.izgara tbody tr:nth-child(even) th.ad,
table.izgara tbody tr:nth-child(even) td{background:#FBF7F3}
table.izgara td.hs{background:#F2EBE4}
table.izgara tbody tr:nth-child(even) td.hs{background:#EEE6DE}
table.izgara td.bugun{background:var(--mur-soluk)}
table.izgara td.eksik{background:var(--kirmizi-soluk);
  box-shadow:inset 0 0 0 1px rgba(168,40,32,.4)}
table.izgara th.hafta-bas,table.izgara td.hafta-bas{border-left:2px solid var(--cizgi-koyu)}
table.izgara td button{width:100%;height:100%;font-size:16px;font-weight:600;
  color:var(--metin);font-variant-numeric:tabular-nums;cursor:pointer;
  transition:box-shadow .12s ease}
table.izgara td.sifir button{color:var(--metin2);font-weight:500}
table.izgara td.eksik button{color:var(--kirmizi);font-weight:700;font-size:17px}
table.izgara td.eksik button::after{content:"!"}
table.izgara td button:focus-visible,
table.izgara td button:hover{box-shadow:inset 0 0 0 2px var(--mur);outline:none}

/* --- aylık toplam sütunu: sağa yapışır --- */
table.izgara .toplam{position:sticky;right:0;z-index:2;min-width:88px;
  background:var(--zemin-koyu);border-left:2px solid var(--cizgi-koyu);
  font-variant-numeric:tabular-nums;font-size:16px;color:var(--metin)}
table.izgara thead th.toplam{z-index:4;font-size:11.5px;font-weight:700;line-height:1.3;
  text-transform:uppercase;letter-spacing:.05em;color:var(--metin2);padding:0 10px}
table.izgara tbody td.toplam b{font-weight:700}

/* --- alt toplam satırı: koyu bant, ızgaranın bittiği yer belli olsun --- */
table.izgara tfoot th,table.izgara tfoot td{background:var(--koyu);color:#F4EAE4;
  height:48px;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums;
  border-top:2px solid var(--cizgi-koyu);border-right-color:rgba(255,255,255,.12)}
table.izgara tfoot th.ad{background:var(--koyu);color:#F4EAE4;font-size:14px;
  border-right:2px solid rgba(255,255,255,.25)}
table.izgara tfoot td.toplam{background:#3A1A20;color:#F4EAE4;
  border-left-color:rgba(255,255,255,.25)}
table.izgara tfoot td.hafta-bas{border-left-color:rgba(255,255,255,.18)}

/* --- satır ve sütun vurgusu (en sonda: diğer zeminleri bilerek ezer) --- */
table.izgara tbody tr:hover th.ad{background:var(--zemin-koyu)}
table.izgara tbody tr:hover td{background:#F7EFE9}
table.izgara tbody td.sutun-vurgu{background:#F7EFE9}
table.izgara thead th.sutun-vurgu{background:var(--cizgi-koyu)}
table.izgara thead th.bugun.sutun-vurgu{background:var(--mur-acik)}
table.izgara tbody tr:hover td.eksik,
table.izgara tbody td.eksik.sutun-vurgu{background:#F7E2DE}
table.izgara tbody tr:hover td.bugun,
table.izgara tbody td.bugun.sutun-vurgu{background:#EEDCE0}

/* --- açıklama şeridi: renk tek başına bilgi taşımaz, her işaretin adı yazar --- */
.aciklama{display:grid;gap:12px 28px;margin-top:18px;
  grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  font-size:14px;line-height:1.5;color:var(--metin2)}
.aciklama span{display:flex;align-items:flex-start;gap:10px}
.aciklama em{font-style:normal}
.aciklama b{color:var(--metin);font-weight:600}
.aciklama i{width:22px;height:22px;flex:none;margin-top:1px;border-radius:5px;
  border:1px solid var(--cizgi-koyu);background:var(--kart);
  display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:12px;font-weight:700;color:var(--metin2)}
.aciklama i.eksik{background:var(--kirmizi-soluk);border-color:rgba(168,40,32,.45);color:var(--kirmizi)}
.aciklama i.hs{background:#E5DAD0}
.aciklama i.bugun{background:var(--mur);border-color:var(--mur)}
.aciklama i.bos{background:var(--kart)}
.aciklama i.toplam-ornek{background:var(--zemin-koyu);border-left:2px solid var(--cizgi-koyu)}

/* ============================================================ fatura dökümü

   KURUCU (2026-08-24): "genel bir yoğunluk var, çok sayı her yer."
   Doğruydu. Eski hâlde her firma bir kart, her kartın içinde yirmi gün rozeti
   vardı: on firma çarpı yirmi gün, ekranda dört yüz sayı. Üstelik kartlar
   yan yana dizildiği için sayılar hizasızdı, göz karşılaştıramıyordu.

   YENİ DÜZEN:
   1. Tek büyük rakam yukarıda: bu ay tahsil edilecek tutar. Yanında dört küçük.
   2. Firmalar KART DEĞİL, tek tablo. Para sütunu alt alta hizalı; asıl iş
      "hangi firma ne kadar" karşılaştırması ve bu ancak hizalı sütunda yapılır.
   3. Gün gün liste KAPALI gelir, satırdaki düğmeyle açılır. Müşteri itiraz
      etmedikçe kimse yirmi günün tek tek sayısına bakmıyor.
   4. Rozet sadece BİR ŞEY TERS gittiğinde çıkar (eksik gün, fiyat değişti).
      "Her şey yolunda" rozeti gürültüdür, yokluğu zaten iyi haberdir. */

.dokum-ozet{
  background:var(--koyu);color:#F6F2EE;border-radius:var(--r-buyuk);
  padding:24px 28px;margin-bottom:18px;
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px 40px;
}
.dokum-ozet .etiket{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:#B4A399;margin-bottom:8px}
.dokum-ozet .tutar{display:block;font-size:38px;font-weight:700;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;line-height:1.05}
.dokum-ozet .ozet-sag{display:flex;flex-wrap:wrap;gap:14px 34px}
.dokum-ozet .ozet-sag span{display:block;font-size:11.5px;letter-spacing:.08em;
  text-transform:uppercase;color:#B4A399;margin-bottom:4px}
.dokum-ozet .ozet-sag b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}

.uyari-kutu{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;
  background:var(--kirmizi-soluk);border:1px solid rgba(168,40,32,.3);
  border-radius:var(--r-buyuk);padding:18px 22px;margin-bottom:18px;
}
.uyari-baslik{font-size:17px;font-weight:700;color:var(--kirmizi)}
.uyari-alt{font-size:14px;color:var(--metin2);margin-top:4px;max-width:70ch;line-height:1.5}
/* Kapatılmış ay şeridi: kırmızı değil yeşil, çünkü bu bir hata değil güvence. */
.uyari-kutu.kilitli{background:var(--yesil-soluk);border-color:rgba(47,107,58,.35)}
.uyari-kutu.kilitli .uyari-baslik{color:var(--yesil)}
.uyari-kutu.notr{background:var(--kart);border-color:var(--cizgi-koyu)}
.uyari-kutu.notr .uyari-baslik{color:var(--metin)}
.son-degisiklik{font-size:12.5px;color:var(--soluk);margin:-6px 0 14px}

.dokum-sar{overflow-x:auto;background:var(--kart);border:1px solid var(--cizgi-koyu);
  border-radius:var(--r-buyuk);box-shadow:var(--golge-1)}
table.dokum{width:100%;border-collapse:separate;border-spacing:0;min-width:640px}
table.dokum th,table.dokum td{text-align:left;padding:0 18px;vertical-align:middle}
table.dokum .sag{text-align:right;font-variant-numeric:tabular-nums}
table.dokum .ac{width:150px;text-align:right;padding-right:18px}
.gizli-yazi{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

table.dokum thead th{height:46px;background:var(--zemin-koyu);color:var(--metin2);
  font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;
  border-bottom:2px solid var(--cizgi-koyu)}
table.dokum thead th:first-child{border-top-left-radius:var(--r-buyuk)}
table.dokum thead th:last-child{border-top-right-radius:var(--r-buyuk)}

table.dokum tbody tr.satir>*{height:62px;border-bottom:1px solid var(--cizgi);font-size:15.5px}
table.dokum tbody tr.satir:hover>*{background:var(--zemin)}
table.dokum .firma-ad{display:block;font-size:16px;font-weight:600;color:var(--metin)}
table.dokum .rozetler{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
table.dokum td.para{font-size:19px;font-weight:700;color:var(--metin);white-space:nowrap}
table.dokum td.sag{color:var(--metin2)}
table.dokum td.sag.para{color:var(--metin)}

table.dokum .detay-ac{
  border:1px solid var(--cizgi-koyu);border-radius:var(--r-orta);background:var(--kart);
  padding:8px 13px;font-size:13.5px;font-weight:600;color:var(--metin2);white-space:nowrap;
  transition:border-color .14s ease,color .14s ease;
}
table.dokum .detay-ac:hover{border-color:var(--mur);color:var(--mur)}
table.dokum .detay-ac.acik{background:var(--mur);border-color:var(--mur);color:#F6F2EE}

table.dokum tr.detay td{background:var(--zemin);border-bottom:1px solid var(--cizgi-koyu);
  padding:18px}
.detay-ic{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:22px 30px}
.detay-hesap{background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r-orta);
  padding:6px 16px;align-self:start}
.detay-hesap div{display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  padding:9px 0;border-bottom:1px solid var(--cizgi);font-size:14px;color:var(--metin2)}
.detay-hesap div:last-child{border-bottom:none}
.detay-hesap b{font-size:15px;font-weight:600;color:var(--metin);font-variant-numeric:tabular-nums}
.detay-hesap div.son{padding-top:11px}
.detay-hesap div.son b{font-size:18px;font-weight:700}
.detay-baslik{font-size:11.5px;font-weight:700;color:var(--metin2);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px}
.bos-not{font-size:14px;color:var(--soluk)}

/* Gün kutuları: küçük rakam ayın günü, büyük rakam o gün giden kişi sayısı. */
.gun-serit{display:flex;flex-wrap:wrap;gap:6px}
.gun-serit b{
  background:var(--kart);border:1px solid var(--cizgi-koyu);border-radius:var(--r-kucuk);
  padding:5px 10px;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;
  color:var(--metin);
}
.gun-serit b i{color:var(--soluk);font-style:normal;font-weight:600;font-size:11.5px;
  margin-right:6px}
.gun-serit b.eks{background:var(--kirmizi-soluk);border-color:rgba(168,40,32,.4);color:var(--kirmizi)}
.gun-serit b.eks i{color:var(--kirmizi)}

table.dokum tfoot th,table.dokum tfoot td{height:58px;background:var(--koyu);color:#F4EAE4;
  font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
table.dokum tfoot th.ad{font-size:14px}
/* .para ve .sag renkleri gövde için koyu; koyu bantta ezilmezse yazı görünmez oluyor. */
table.dokum tfoot td.sag,table.dokum tfoot td.para,
table.dokum tfoot td.sag.para{color:#F4EAE4}
table.dokum tfoot td.para{font-size:20px}
table.dokum tfoot th:first-child{border-bottom-left-radius:var(--r-buyuk)}
table.dokum tfoot td:last-child{border-bottom-right-radius:var(--r-buyuk)}

/* ============================================================ formlar */

.alan{margin-bottom:18px}
.alan label{display:block;font-size:13px;font-weight:600;color:var(--metin2);margin-bottom:6px}
.alan .ipucu{font-size:12.5px;color:var(--soluk);margin-top:6px;line-height:1.45}
.alan input[type=text],.alan input[type=number],.alan input[type=password],
.alan input[type=date],.metin-alan{
  width:100%;min-height:44px;padding:10px 13px;
  border:1px solid var(--cizgi-koyu);border-radius:var(--r-orta);
  background:var(--kart);font-size:15.5px;transition:border-color .16s ease,box-shadow .16s ease;
}
.alan input:focus,.metin-alan:focus{outline:none;border-color:var(--mur);
  box-shadow:0 0 0 3px var(--mur-soluk)}
.metin-alan{min-height:140px;line-height:1.55;resize:vertical}

.gunler{display:flex;gap:7px;flex-wrap:wrap}
.gunler button{
  min-width:46px;height:42px;padding:0 12px;border-radius:var(--r-orta);
  border:1px solid var(--cizgi-koyu);background:var(--kart);
  font-size:13.5px;font-weight:600;color:var(--metin2);
  transition:all .16s ease;
}
.gunler button:hover{border-color:var(--soluk)}
.gunler button.secili{background:var(--mur);border-color:var(--mur);color:#F6F2EE}

/* ============================================================ liste satırı */

.liste-satir{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:15px 20px;border-bottom:1px solid var(--cizgi);transition:background .14s ease;
}
.liste-satir:last-child{border-bottom:none}
.liste-satir:hover{background:var(--zemin)}
.liste-bilgi{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--metin2);margin-top:4px}
.liste-bilgi b{color:var(--metin);font-weight:600}

/* ============================================================ senk şeridi */

.senk-serit{
  position:fixed;top:var(--tepe);left:0;right:0;z-index:var(--z-serit);
  padding:9px 24px;font-size:13.5px;font-weight:600;text-align:center;
  background:var(--zemin-koyu);color:var(--metin2);border-bottom:1px solid var(--cizgi);
}
.senk-serit.bekleyen{background:var(--sari-soluk);color:var(--sari-koyu)}
.senk-serit.hata{background:var(--kirmizi-soluk);color:var(--kirmizi)}
body.serit-var{padding-top:calc(var(--tepe) + 38px)}

/* ============================================================ alt sayfa */

.perde{position:fixed;inset:0;z-index:var(--z-perde);background:rgba(42,16,21,.42);
  display:flex;align-items:center;justify-content:center;padding:24px;
  animation:acil .18s ease}
@keyframes acil{from{opacity:0}to{opacity:1}}
.sayfa-kutu{
  background:var(--kart);width:100%;max-width:520px;max-height:88vh;overflow:auto;
  border-radius:var(--r-buyuk);box-shadow:var(--golge-3);padding:26px 26px 24px;
  animation:yuksel .22s cubic-bezier(.2,.7,.3,1);
}
@keyframes yuksel{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.sayfa-kutu h2{font-size:20px;font-weight:700;letter-spacing:-.01em}
.sayfa-kutu .alt{font-size:13.5px;color:var(--metin2);margin:3px 0 20px}
.sayfa-kutu .btn{width:100%;margin-top:10px}

.supheli{
  border:1px solid rgba(168,40,32,.35);background:var(--kirmizi-soluk);color:#7A1B15;
  border-radius:var(--r-orta);padding:13px 15px;margin:4px 0 6px;font-size:14px;line-height:1.5;
}

/* ============================================================ mesajdan aktarma */

.ms-baslik{font-size:11.5px;font-weight:700;color:var(--metin2);margin:18px 0 9px;
  letter-spacing:.08em;text-transform:uppercase}
.ms-satir{
  display:flex;align-items:flex-start;gap:11px;padding:11px 13px;margin-bottom:8px;
  border:1px solid var(--cizgi);border-radius:var(--r-orta);background:var(--kart);
  font-size:14.5px;cursor:pointer;transition:border-color .14s ease;
}
label.ms-satir:hover{border-color:var(--cizgi-koyu)}
.ms-satir input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--mur)}
.ms-ic{flex:1;line-height:1.45}
.ms-ic i{display:block;font-size:12.5px;color:var(--soluk);font-style:normal;margin-top:3px}
.ms-adet{display:inline-block;background:var(--zemin-koyu);border-radius:var(--r-kucuk);
  padding:1px 9px;font-weight:700;font-variant-numeric:tabular-nums;margin-left:5px}
.ms-satir.kusku{border-color:rgba(138,90,18,.4);background:var(--sari-soluk)}
.ms-satir.atlandi{background:var(--zemin);color:var(--soluk);cursor:default}

/* ============================================================ şifre perdesi */

.pin-perde{position:fixed;inset:0;z-index:var(--z-pin);background:var(--koyu);
  color:#F6F2EE;display:grid;place-items:center;padding:24px}
.pin-kutu{width:100%;max-width:310px;text-align:center}
.pin-marka{font-family:"Playfair Display",Georgia,serif;font-size:15px;
  color:#A99A90;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.pin-kutu h1{font-size:25px;font-weight:700;letter-spacing:-.01em;margin-bottom:6px}
.pin-kutu p{font-size:13.5px;color:#A99A90;margin-bottom:26px}
.pin-nokta{display:flex;gap:14px;justify-content:center;margin-bottom:28px}
.pin-nokta i{width:13px;height:13px;border-radius:50%;border:1.5px solid #7C6C62;
  transition:all .18s ease}
.pin-nokta i.dolu{background:#D9B98C;border-color:#D9B98C;transform:scale(1.1)}
.pin-tus{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pin-tus button{height:62px;border-radius:var(--r-orta);background:rgba(246,242,238,.08);
  font-size:23px;font-weight:600;color:#F6F2EE;transition:background .14s ease}
.pin-tus button:hover{background:rgba(246,242,238,.16)}
.pin-tus button:active{transform:scale(.97)}
.pin-hata{color:#E9A9A2;font-size:13.5px;min-height:22px;margin-top:16px}

/* ============================================================ bildirim */

.tost{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(8px);
  z-index:var(--z-tost);background:var(--koyu);color:#F6F2EE;
  padding:12px 20px;border-radius:var(--r-orta);font-size:14.5px;font-weight:600;
  box-shadow:var(--golge-3);opacity:0;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;max-width:calc(100vw - 40px);
}
.tost.gorunur{opacity:1;transform:translateX(-50%) translateY(0)}

/* ============================================================ dar ekran */

@media(max-width:820px){
  .tepe{height:auto;position:static}
  body{padding-top:0}
  body.serit-var{padding-top:0}
  .senk-serit{position:static}
  .tepe-ic{flex-direction:column;align-items:stretch;gap:0;padding:14px 16px 0}
  .marka{flex-direction:row;align-items:baseline;gap:10px;margin-bottom:12px}
  .menu{margin:0 -16px;padding:0 16px 12px}
  .sayfa{padding:0 16px}
  main{padding:22px 0 60px}
  .sayfa-bas{flex-direction:column;align-items:stretch;gap:18px}
  .sayfa-bas h1{font-size:23px}
  .donem-orta{min-width:0;flex:1}
  .ozet{grid-template-columns:1fr;gap:14px}
  .ozet-cubuk{width:100%}
  table.veri thead{display:none}
  table.veri tbody tr{display:flex;align-items:center;justify-content:space-between;
    gap:12px;padding:12px 16px}
  table.veri td{display:block;padding:0;border:none}
  table.veri td.gizle-dar{display:none}
  /* Dar ekranda gün sayısı ve kişi başı fiyat gizlenir; kalan üç sütun
     (firma, öğün, ödenecek tutar) asıl sorunun cevabı. Detayda ikisi de yazıyor. */
  table.dokum .gizle-dar{display:none}
  table.dokum{min-width:0}
  table.dokum th,table.dokum td{padding:0 12px}
  table.dokum .ac{width:auto}
  table.dokum .detay-ac{font-size:12.5px;padding:7px 10px}
  .detay-ic{grid-template-columns:1fr}
  .dokum-ozet .tutar{font-size:30px}

  /* Dar ekranda aylık toplam sütunu SAĞA YAPIŞMAZ. Yapışsaydı 390 px'in 88'ini
     kaplar ve altındaki gün sütunlarını örterdi; ölçüldü, gün 3'ten sonrası
     görünmüyordu. Burada tablonun sonunda, normal sütun olarak durur. */
  table.izgara .toplam{position:static}
  table.izgara th.ad{min-width:132px;max-width:132px;font-size:14px;padding:0 10px}
}

@media print{
  .tepe,.senk-serit,.sayfa-bas .donem,.yazdirma-disi{display:none !important}
  body{padding:0;background:#fff}
  /* Kağıda basılan şey müşteriye verilen kanıttır: gün dökümü AÇIK basılır
     (app.js onbeforeprint satırları açıyor), düğme sütunu basılmaz. */
  table.dokum .ac{display:none}
  table.dokum tbody tr.satir>*,table.dokum tr.detay>*{break-inside:avoid}
  table.dokum tfoot th,table.dokum tfoot td,
  table.dokum tfoot td.sag,table.dokum tfoot td.para,
  table.dokum tfoot td.sag.para{background:#fff;color:#241014;
    border-top:2px solid #241014}
  .dokum-ozet{background:#fff;color:#241014;border:1px solid #D3C5BA}
  .dokum-ozet .etiket,.dokum-ozet .ozet-sag span{color:#6A5C55}
  .dokum-sar{box-shadow:none}
  .detay-hesap,.gun-serit b{break-inside:avoid}
  /* Tek firma ekstresi: müşteriye giden kağıtta öteki firmalar, ayın genel toplamı
     ve iç uyarılar GÖRÜNMEZ. Ay bilgisi gün dökümü başlığında yazılıdır. */
  body.tek-yazdir .dokum-ozet,body.tek-yazdir .uyari-kutu,
  body.tek-yazdir table.dokum tfoot{display:none !important}
  body.tek-yazdir table.dokum tbody tr:not(.yazdir-hedef){display:none}
}
