/* Papino Defter — telefon öncelikli, sıcak tema (koyu kırmızı / mangal turuncusu), koyu tema telefonu takip eder */
:root{
  --bg:#faf6f1; --kart:#ffffff; --metin:#1f1a17; --gri-yazi:#6b625c; --cizgi:#e5ddd3; --girdi:#ffffff;
  --vurgu:#9f1d1d; --vurgu2:#ea580c; --vurgu-metin:#fff;
  --mavi:#1d4ed8; --yesil:#15803d; --kirmizi:#b91c1c;
  --u-sari:#fde68a; --u-sari-m:#5a4300; --u-kirmizi:#fecaca; --u-kirmizi-m:#991b1b; --u-yesil:#bbf7d0; --u-yesil-m:#166534;
  --u-mavi:#dbeafe; --u-mavi-m:#1e40af; --u-turuncu:#ffedd5; --u-turuncu-m:#c2410c;
  --ikincil:#ece4db; --koyu:#2b1d18;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#17120f; --kart:#231c18; --metin:#f3ece5; --gri-yazi:#b4a89e; --cizgi:#3a302a; --girdi:#2b2320;
    --vurgu:#c0392b; --vurgu2:#f97316;
    --u-sari:#4d3d08; --u-sari-m:#fde68a; --u-kirmizi:#4a1414; --u-kirmizi-m:#fecaca; --u-yesil:#0f3d22; --u-yesil-m:#bbf7d0;
    --u-mavi:#16305e; --u-mavi-m:#bfdbfe; --u-turuncu:#4d2308; --u-turuncu-m:#fed7aa;
    --ikincil:#3a302a; --koyu:#0f0a08; --mavi:#93c5fd; --yesil:#4ade80; --kirmizi:#f87171;
  }
}
*{box-sizing:border-box}
html{color-scheme:light dark}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--metin);font-size:17px;line-height:1.35}
a{color:var(--vurgu)}
h2,h3,h4{margin:14px 0 8px} h2{font-size:21px} h3{font-size:17px} h4{font-size:15px}
small,.kucuk{color:var(--gri-yazi);font-size:14px;font-weight:400}

/* üst çubuk */
.gelistirme{background:var(--kirmizi);color:#fff;text-align:center;font-weight:700;font-size:14px;padding:6px 16px;letter-spacing:.3px}
header{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;background:var(--kart);border-bottom:2px solid var(--vurgu);position:sticky;top:0;z-index:6}
@supports(padding:max(0px)){header{padding-top:max(10px,env(safe-area-inset-top))}}
.logo{font-weight:800;color:var(--vurgu);text-decoration:none;font-size:20px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo img{height:36px;width:auto}
.kim{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
.kim .ad{color:var(--metin);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .kim .ad small{color:var(--gri-yazi)}
.rozet{background:var(--vurgu);color:#fff;padding:0 12px;min-height:36px;display:inline-flex;align-items:center;border-radius:20px;text-decoration:none;font-size:14px;white-space:nowrap}
.cikis{margin:0} .cikis button{min-height:36px;font-size:13px;font-weight:600;padding:0 12px;background:var(--ikincil);color:var(--metin);border-radius:8px}

main{max-width:720px;margin:0 auto;padding:16px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}

/* kartlar */
.kart{display:block;background:var(--kart);border-radius:14px;padding:14px 16px;margin-bottom:12px;box-shadow:0 1px 3px rgba(0,0,0,.08);text-decoration:none;color:var(--metin)}
.kart.satir{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px}
.kart.satir>span:first-child{min-width:0;overflow-wrap:anywhere}
a.kart.satir:active{background:var(--ikincil)}

/* para */
.para,strong.para,td.sag,.kart.satir>strong{white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums;flex-shrink:0}
strong.odeme{color:var(--yesil)}

/* büyük düğmeler (kamera / galeri) */
.buyuk-dugme{display:flex;align-items:center;justify-content:center;text-align:center;background:var(--vurgu);color:var(--vurgu-metin);font-size:20px;font-weight:700;min-height:88px;padding:16px 10px;border-radius:14px;cursor:pointer}
.buyuk-dugme.galeri{background:var(--vurgu2)}
.buyuk-dugme input{display:none}

/* form alanları — en az 48 px, tek elle */
label{display:block;margin:10px 0 6px;font-weight:600;font-size:15px}
input,select,textarea{width:100%;min-height:48px;font-size:17px;padding:10px 12px;border:1px solid var(--cizgi);border-radius:10px;background:var(--girdi);color:var(--metin);margin-top:4px}
input[type=checkbox]{width:28px;height:28px;min-height:0;margin:0;accent-color:var(--vurgu)}
input[type=date]{min-height:48px}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.uclu{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px} .filtre label{margin:0;font-size:13px}
.satir-girdi{display:flex;gap:8px;margin-top:4px} .satir-girdi input{flex:1;margin:0} .satir-girdi button{flex:0 0 auto;padding:0 18px}
label.satir-ici{display:flex;align-items:center;gap:10px;font-weight:400;min-height:48px} label.satir-ici input[type=checkbox]{margin:0}
.sari input,.sari select,tr.sari input{background:var(--u-sari);color:var(--metin)}
@media (prefers-color-scheme: dark){.sari input,.sari select,tr.sari input{color:#fff}}

/* düğmeler */
button{min-height:48px;font-size:17px;font-weight:700;padding:10px 14px;border:0;border-radius:12px;cursor:pointer;background:var(--ikincil);color:var(--metin)}
.dugmeler{display:flex;gap:10px;margin-top:14px} .dugmeler button{flex:1}
.birincil{background:var(--yesil);color:#fff} .ikincil{background:var(--ikincil);color:var(--metin)}
.tehlike{background:transparent;color:var(--kirmizi);border:2px solid var(--kirmizi);flex:.7}
.satir-girdi .birincil{background:var(--vurgu)}
.kucuk-dugme{flex:0 0 auto;font-size:15px;padding:0 16px}
.dugmeler.sabit{position:sticky;bottom:0;z-index:5;background:var(--bg);margin:14px -16px 0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--cizgi)}

/* uyarılar (renkler korunur) */
.uyari{padding:10px 12px;border-radius:10px;font-weight:600;margin:8px 0;font-size:15px;overflow-wrap:anywhere}
.uyari.sari{background:var(--u-sari);color:var(--u-sari-m)} .uyari.kirmizi{background:var(--u-kirmizi);color:var(--u-kirmizi-m)}
.uyari.yesil{background:var(--u-yesil);color:var(--u-yesil-m)} .uyari.mavi{background:var(--u-mavi);color:var(--u-mavi-m)}
.uyari.turuncu{background:var(--u-turuncu);color:var(--u-turuncu-m)}
.uyari a{color:inherit}
.durum{font-size:13px;padding:4px 10px;border-radius:12px;background:var(--ikincil);vertical-align:middle;white-space:nowrap}
.durum.onaylandi{background:var(--u-yesil);color:var(--u-yesil-m)} .durum.reddedildi{background:var(--u-kirmizi);color:var(--u-kirmizi-m)}

/* fotoğraf */
.foto{width:100%;max-height:360px;object-fit:contain;background:var(--koyu);border-radius:10px;margin-bottom:12px}

/* kontroller */
.kontroller h3{margin:0 0 8px} .kontroller h4{margin:12px 0 4px}
ul.fiyatlar{list-style:none;padding:0;margin:0;font-size:15px}
ul.fiyatlar li{padding:6px 0;border-top:1px solid var(--cizgi);overflow-wrap:anywhere}
ul.fiyatlar .artis{color:var(--kirmizi)} ul.fiyatlar .dusus{color:var(--yesil)} ul.fiyatlar .ilk{color:var(--mavi)} ul.fiyatlar .ayni{color:var(--gri-yazi)}
.oneri{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--cizgi)}

/* kalemler: masaüstünde tablo */
table.kalemler{width:100%;border-collapse:collapse;font-size:14px}
table.kalemler th{text-align:left;font-weight:600;padding:4px 2px;color:var(--gri-yazi)}
table.kalemler td{padding:2px;vertical-align:middle}
table.kalemler input{padding:8px 8px;font-size:15px;margin:0;min-height:44px}
table.kalemler td.c-urun{width:30%} table.kalemler td.c-sil{width:36px;text-align:center}
table.kalemler td.c-tutar input{text-align:right;font-weight:700}
tr.yeni input{border-style:dashed}

/* kalemler: telefonda KART */
@media (max-width:640px){
  table.kalemler,table.kalemler tbody{display:block}
  table.kalemler thead{display:none}
  table.kalemler tr{display:grid;grid-template-columns:1fr 1fr 1.2fr;grid-template-areas:"urun urun urun" "miktar birim fiyat" "koli isk tutar" "sil sil sil";gap:6px 8px;background:var(--kart);border:1px solid var(--cizgi);border-radius:12px;padding:10px 12px;margin-bottom:10px;align-items:end}
  table.kalemler tr.sari{border-color:var(--u-sari-m);background:var(--u-sari)}
  table.kalemler td{display:block;padding:0;width:auto}
  table.kalemler td::before{content:attr(data-etiket);display:block;font-size:11px;color:var(--gri-yazi);text-transform:uppercase;letter-spacing:.3px}
  table.kalemler td.c-urun{grid-area:urun} table.kalemler td.c-miktar{grid-area:miktar} table.kalemler td.c-birim{grid-area:birim}
  table.kalemler td.c-fiyat{grid-area:fiyat} table.kalemler td.c-fiyat::before{content:"× " attr(data-etiket)}
  table.kalemler td.c-koli{grid-area:koli} table.kalemler td.c-isk{grid-area:isk} table.kalemler td.c-tutar{grid-area:tutar}
  table.kalemler td.c-sil{grid-area:sil;display:flex;align-items:center;gap:8px;min-height:36px;width:auto}
  table.kalemler td.c-sil::before{content:attr(data-etiket);display:inline;text-transform:none;font-size:13px}
  table.kalemler td.c-urun{width:auto} table.kalemler td.c-urun input{font-weight:700;font-size:17px}
  table.kalemler input{background:transparent;border:0;border-bottom:1px solid var(--cizgi);border-radius:0;padding:4px 2px;min-height:40px}
  table.kalemler td.c-tutar input{font-size:20px;font-weight:800;text-align:right;color:var(--vurgu)}
  table.kalemler tr.yeni{border-style:dashed} table.kalemler tr.yeni input{border-style:dashed}
  .kim .ad small{display:none}
  .uclu{grid-template-columns:1fr 1fr 1fr;gap:6px} .filtre select{font-size:14px;padding:6px}
}

/* listeler, özet, toptancı */
.sekmeler{display:flex;gap:6px;margin-bottom:12px}
.sekmeler a{flex:1;text-align:center;padding:12px;border-radius:10px;background:var(--kart);text-decoration:none;color:var(--metin);font-weight:600}
.sekmeler a.aktif{background:var(--vurgu);color:#fff}
table.ozet{width:100%;border-collapse:collapse;font-size:15px} table.ozet td{padding:7px 2px;border-top:1px solid var(--cizgi)} td.sag{font-weight:600}
.toplam-borc{background:var(--koyu);color:#fff} .toplam-borc small{color:#d6ccc2}
.gecmis-tablo{width:100%;border-collapse:collapse;font-size:14px;margin-top:6px}
.gecmis-tablo td{padding:4px;border-top:1px solid var(--cizgi)} .gecmis-tablo td.sag{font-weight:600;white-space:nowrap}
h2 a{color:var(--vurgu);text-decoration:none}
.giris{max-width:380px;margin:40px auto} .giris h2{margin-top:0}
.kullanici.pasif{opacity:.6} .kullanici .satir{display:flex;justify-content:space-between;align-items:center;gap:8px}
.kullanici form.satir-girdi{margin-top:8px} .kullanici form.satir-girdi input{font-size:15px}

/* bekleme perdesi */
#bekle{position:fixed;inset:0;background:rgba(0,0,0,.65);color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font-size:22px;z-index:9}
.gizli{display:none!important}