/* ==========================================================================
   ŞAHİNOĞLU GIDA • Panel tasarım sistemi
   Koyu zemin + sarı vurgu. MOBİL ÖNCELİKLİ (kullanıcıların %90'ı telefonda).
   Dış bağımlılık yok: yazı tipi sistem fontu, ikonlar yerel bootstrap-icons.
   Tek dosya; sayfalarda ayrı <style> bloğu yazılmaz.
   ========================================================================== */

/* ---------- 1) Değişkenler ---------- */
:root{
  --bg:#0e0e10;
  --yuzey:#17171a;
  --yuzey-2:#1f1f23;
  --yuzey-3:#2a2a30;
  --cizgi:#2e2e35;
  --cizgi-2:#3b3b44;
  --metin:#f5f5f6;
  --soluk:#a6a6b1;
  --cok-soluk:#74747f;
  --vurgu:#ffc107;
  --vurgu-2:#ffd24d;
  --vurgu-koyu:#e0a800;
  --vurgu-ustu:#1a1400;
  --vurgu-zemin:rgba(var(--vurgu-rgb),.12);
  --basarili:#34d399;
  --hata:#f87171;
  --uyari:#fb923c;
  --bilgi:#60a5fa;
  /* Tema belirteçleri: rgba(var(--x-rgb),.1) kalıbı eski telefonlarda da çalışır; tema yalnız bunları değiştirir */
  --vurgu-rgb:255,193,7;
  --vurgu-ustu-rgb:26,20,0;
  --basarili-rgb:52,211,153;
  --hata-rgb:248,113,113;
  --uyari-rgb:251,146,60;
  --bilgi-rgb:96,165,250;
  --basarili-ustu:#052e1c;
  --hata-ustu:#2a0a0a;
  --ust-zemin:rgba(14,14,16,.92);
  --basarili-acik:#a7f3d0;
  --hata-acik:#fecaca;
  --uyari-acik:#fed7aa;
  --bilgi-acik:#bfdbfe;
  --yaricap:14px;
  --yaricap-k:10px;
  --bosluk:16px;
  --ust-yuk:56px;
  --golge:0 10px 28px rgba(0,0,0,.4);
  --odak:0 0 0 3px rgba(var(--vurgu-rgb),.35);
  --yazi:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}

/* ---------- 2) Temel ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--metin);
  font-family:var(--yazi);font-size:16px;line-height:1.5;
  -webkit-tap-highlight-color:transparent;
  min-height:100vh;min-height:100dvh;
  overscroll-behavior-y:none;
}
img,svg{max-width:100%;display:block}
a{color:var(--vurgu);text-decoration:none}
a:not([class]):hover{color:var(--vurgu-2)}   /* yalnız düz metin bağlantılar; düğme/kutucuk/satır kendi rengini korur */
h1,h2,h3,h4{margin:0 0 .5rem;line-height:1.25;font-weight:700}
h1{font-size:1.5rem} h2{font-size:1.25rem} h3{font-size:1.0625rem}
p{margin:0 0 .75rem}
hr{border:0;border-top:1px solid var(--cizgi);margin:1rem 0}
::selection{background:var(--vurgu);color:var(--vurgu-ustu)}
:focus-visible{outline:none;box-shadow:var(--odak);border-radius:6px}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
*{scrollbar-width:thin;scrollbar-color:var(--cizgi-2) transparent}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------- 3) Uygulama iskeleti ---------- */
.ust{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;gap:8px;
  height:calc(var(--ust-yuk) + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) max(var(--bosluk),env(safe-area-inset-right)) 0 max(var(--bosluk),env(safe-area-inset-left));
  background:var(--ust-zemin);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--cizgi);
}
.ust__geri{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;margin-left:-10px;border-radius:50%;
  color:var(--metin);font-size:1.35rem;flex:none;
}
.ust__geri:active{background:var(--yuzey-3)}
.ust__baslik{flex:1;min-width:0;margin:0;font-size:1.125rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ust__alt{display:block;font-size:.75rem;font-weight:500;color:var(--soluk);margin-top:-2px;overflow:hidden;text-overflow:ellipsis}
.ust__eylem{display:flex;gap:6px;flex:none}

.sayfa{
  width:100%;max-width:720px;margin:0 auto;
  padding:var(--bosluk) max(var(--bosluk),env(safe-area-inset-right)) calc(var(--bosluk) + 8px) max(var(--bosluk),env(safe-area-inset-left));
}
.sayfa--genis{max-width:1100px}

/* ---------- 4) Kartlar, listeler ---------- */
.kart{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:var(--bosluk);margin-bottom:12px}
.kart--vurgu{border-color:rgba(var(--vurgu-rgb),.45);background:linear-gradient(180deg,rgba(var(--vurgu-rgb),.08),rgba(var(--vurgu-rgb),.02))}
.kart__baslik{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;font-size:.8125rem;font-weight:700;color:var(--soluk);text-transform:uppercase;letter-spacing:.06em}
.kart__baslik--bolum{margin:22px 2px 8px}
.kart--bos{padding:0;overflow:hidden}

.liste{display:flex;flex-direction:column;gap:8px}
.liste--bitisik{gap:0;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);overflow:hidden}
.satir{
  display:flex;align-items:center;gap:12px;
  min-height:64px;padding:12px 14px;
  background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);
  color:var(--metin);
}
button.satir{width:100%;font:inherit;text-align:left;cursor:pointer}   /* <button class="satir">: tıklanabilir satır (Temalar) */
.liste--bitisik .satir{border:0;border-radius:0;border-bottom:1px solid var(--cizgi)}
.liste--bitisik .satir:last-child{border-bottom:0}
a.satir:active,button.satir:active{background:var(--yuzey-3)}
.satir__ikon{
  flex:none;width:40px;height:40px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:var(--vurgu-zemin);color:var(--vurgu);font-size:1.15rem;
}
.satir__ana-blok{flex:1;min-width:0}
.satir__ana{font-weight:650;font-size:1rem;line-height:1.3;overflow-wrap:anywhere}
.satir__alt{color:var(--soluk);font-size:.8125rem;line-height:1.35;margin-top:2px;overflow-wrap:anywhere}
.satir__sag{flex:none;text-align:right;max-width:46%}
.satir__deger{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.satir__not{color:var(--soluk);font-size:.75rem}
.satir__ok{flex:none;color:var(--cok-soluk);font-size:1rem}
.satir--pasif{opacity:.55}

.bos{text-align:center;padding:36px 16px;color:var(--soluk)}
.bos i{display:block;font-size:2.2rem;color:var(--cok-soluk);margin-bottom:8px}
.sayac{color:var(--soluk);font-size:.8125rem;margin:2px 2px 10px}

/* ---------- 5) Menü fayansları ---------- */
.fayanslar{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (min-width:640px){.fayanslar{grid-template-columns:repeat(3,1fr)}}
.fayans{
  position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:14px;
  min-height:118px;padding:16px;
  background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);color:var(--metin);
  transition:border-color .15s,transform .1s;
}
.fayans:active{transform:scale(.98);background:var(--yuzey-3)}
.fayans__ikon{
  width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:var(--vurgu-zemin);color:var(--vurgu);font-size:1.4rem;
}
.fayans__ad{font-weight:700;font-size:1rem;line-height:1.25}
.fayans__not{display:block;font-weight:500;font-size:.75rem;color:var(--soluk);margin-top:2px}
.fayans__rozet{position:absolute;top:12px;right:12px}
.fayans--birincil{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-ustu)}
.fayans--birincil .fayans__ikon{background:rgba(var(--vurgu-ustu-rgb),.12);color:var(--vurgu-ustu)}
.fayans--birincil .fayans__not{color:rgba(var(--vurgu-ustu-rgb),.7)}
.fayans--genis{grid-column:1/-1;min-height:0;flex-direction:row;align-items:center;justify-content:flex-start}
.fayans--tehlike .fayans__ikon{background:rgba(var(--hata-rgb),.14);color:var(--hata)}

/* ---------- 6) Düğmeler ---------- */
.dugme{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 20px;border-radius:var(--yaricap-k);
  border:1.5px solid var(--cizgi-2);background:var(--yuzey-2);color:var(--metin);
  font-weight:650;font-size:1rem;line-height:1;cursor:pointer;
  transition:background .12s,border-color .12s,transform .08s;
  -webkit-user-select:none;user-select:none;touch-action:manipulation;text-align:center;
}
.dugme:hover{background:var(--yuzey-3);color:var(--metin)}
.dugme:active{transform:scale(.98)}
.dugme--birincil{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-ustu)}
.dugme--birincil:hover{background:var(--vurgu-2);border-color:var(--vurgu-2);color:var(--vurgu-ustu)}
.dugme--cizgi{background:transparent;border-color:var(--vurgu);color:var(--vurgu)}
.dugme--cizgi:hover{background:var(--vurgu-zemin);color:var(--vurgu)}
.dugme--tehlike{background:transparent;border-color:rgba(var(--hata-rgb),.6);color:var(--hata)}
.dugme--tehlike:hover{background:rgba(var(--hata-rgb),.12);color:var(--hata)}
.dugme--basarili{background:var(--basarili);border-color:var(--basarili);color:var(--basarili-ustu)}
.dugme--hayalet{background:transparent;border-color:transparent;color:var(--soluk)}
.dugme--tam{display:flex;width:100%}
.dugme--kucuk{min-height:38px;padding:0 14px;font-size:.875rem;border-radius:9px}
.dugme--ikon{width:44px;min-height:44px;padding:0;border-radius:50%}
.dugme[disabled],.dugme.bekliyor{opacity:.55;pointer-events:none}
.dugme.bekliyor::after{content:"";width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:don .7s linear infinite}
@keyframes don{to{transform:rotate(360deg)}}
.dugme-grubu{display:flex;gap:10px;flex-wrap:wrap}
.dugme-grubu>.dugme{flex:1}

/* Alt eylem çubuğu: ekranın altına sabit; formlarda ana düğme her zaman parmağın altında */
.altbar{
  position:fixed;left:0;right:0;bottom:0;z-index:45;
  display:flex;gap:10px;align-items:center;
  padding:12px max(var(--bosluk),calc((100% - 720px) / 2 + var(--bosluk))) calc(12px + env(safe-area-inset-bottom));
  background:var(--ust-zemin);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--cizgi);
}
.altbar .dugme{flex:1}
.altbar .dugme--hayalet{flex:0 0 auto}
/* altbar olan sayfada içerik altbar'ın arkasında kalmasın */
.sayfa:has(.altbar),body.altbar-var .sayfa{padding-bottom:calc(92px + env(safe-area-inset-bottom))}

/* ---------- 7) Form ---------- */
.alan{margin-bottom:14px}
.alan__etiket{display:block;margin:0 0 6px;font-size:.875rem;font-weight:600;color:var(--soluk)}
.alan__etiket b{color:var(--hata);font-weight:700}
.alan__ipucu{margin:5px 2px 0;font-size:.8125rem;color:var(--cok-soluk)}
.alan__hata{margin:5px 2px 0;font-size:.8125rem;color:var(--hata)}
.girdi{
  display:block;width:100%;min-height:50px;padding:12px 14px;
  background:var(--yuzey-2);border:1.5px solid var(--cizgi-2);border-radius:var(--yaricap-k);
  color:var(--metin);font-size:1rem;line-height:1.3;
  -webkit-appearance:none;appearance:none;
  transition:border-color .12s,box-shadow .12s;
}
.girdi::placeholder{color:var(--cok-soluk)}
.girdi:focus{outline:none;border-color:var(--vurgu);box-shadow:var(--odak)}
.girdi[readonly]{opacity:.75}
.girdi:disabled{opacity:.5}
textarea.girdi{min-height:96px;resize:vertical}
select.girdi{
  padding-right:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16' fill='%23a6a6b1'%3E%3Cpath d='M1.65 5.65a.5.5 0 0 1 .7 0L8 11.29l5.65-5.64a.5.5 0 0 1 .7.7l-6 6a.5.5 0 0 1-.7 0l-6-6a.5.5 0 0 1 0-.7z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
input[type=date].girdi,input[type=datetime-local].girdi{min-height:50px}
.girdi--para{font-size:1.5rem;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;min-height:60px}
.girdi--hata{border-color:var(--hata)}
input:-webkit-autofill{-webkit-text-fill-color:var(--metin);-webkit-box-shadow:0 0 0 1000px var(--yuzey-2) inset}
.izgara-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.izgara-3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}

/* Soldaki ikonlu girdi (arama, giriş formu) */
.girdi-ikonlu{position:relative}
.girdi-ikonlu>i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--soluk);font-size:1.05rem;pointer-events:none}
.girdi-ikonlu .girdi{padding-left:42px}
.girdi-ikonlu .girdi-sag{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:38px;height:38px;border:0;background:transparent;color:var(--soluk);border-radius:50%;font-size:1.1rem;cursor:pointer
}

/* Arama çubuğu: kaydırınca üstte kalır */
.arama{position:sticky;top:calc(var(--ust-yuk) + env(safe-area-inset-top));z-index:20;margin:0 calc(var(--bosluk) * -1) 12px;padding:10px var(--bosluk);background:var(--ust-zemin);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.arama .girdi{border-radius:999px;background:var(--yuzey)}

/* Seçenek, anahtar */
.onay{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 2px;cursor:pointer}
.onay input{width:22px;height:22px;accent-color:var(--vurgu);flex:none}

/* Filtre çipleri (yatay kaydırılır) */
.cipler{display:flex;gap:8px;overflow-x:auto;padding:2px var(--bosluk) 10px;margin:0 calc(var(--bosluk) * -1);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cipler::-webkit-scrollbar{display:none}
.cip{
  flex:none;display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;
  border-radius:999px;border:1.5px solid var(--cizgi-2);background:var(--yuzey);color:var(--soluk);
  font-size:.875rem;font-weight:600;cursor:pointer;white-space:nowrap;
}
.cip.aktif{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-ustu)}


/* Segment seçici (ödeme türü gibi az seçenekli radyo grupları) */
.segment{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px}
.segment--sutun{grid-template-columns:1fr}   /* seçenekler alt alta, tam genişlik */
.segment label{position:relative;cursor:pointer}
.segment input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.segment span{
  display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:0 10px;
  border:1.5px solid var(--cizgi-2);border-radius:var(--yaricap-k);background:var(--yuzey-2);
  font-weight:650;font-size:.9375rem;color:var(--soluk);text-align:center;transition:background .12s,border-color .12s,color .12s
}
.segment input:checked+span{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-ustu)}
.segment input:focus-visible+span{box-shadow:var(--odak)}

/* Büyük başlık kartı (işlem yapılan müşteri/toptancı özeti) */
.kimlik{display:flex;gap:14px;align-items:center}
.kimlik__ikon{flex:none;width:52px;height:52px;border-radius:15px;background:var(--vurgu-zemin);color:var(--vurgu);display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.kimlik__ad{font-size:1.1875rem;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.kimlik__alt{color:var(--soluk);font-size:.875rem}
.kimlik__alt a{color:var(--soluk)}
.buyuk-sayi{font-size:clamp(1.3rem,6.4vw,1.75rem);font-weight:800;font-variant-numeric:tabular-nums;line-height:1.15;white-space:nowrap}
.hizli{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}


/* Sepet (sipariş) */
.altbar__ozet{flex:1;min-width:0;line-height:1.2}
.altbar__ozet b{display:block;font-size:1.1875rem;font-variant-numeric:tabular-nums}
.altbar__ozet span{font-size:.75rem;color:var(--soluk)}
.altbar .dugme.dar{flex:0 0 auto;padding:0 22px}
.sepet-oge{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:12px 14px}
.sepet-oge__ust{display:flex;gap:8px;align-items:flex-start}
.sepet-oge__ad{flex:1;font-weight:650;line-height:1.3;overflow-wrap:anywhere;padding-top:6px}
.sepet-oge__alt{display:grid;grid-template-columns:1fr 1.25fr;gap:10px;margin-top:8px;align-items:end}
.sepet-oge__alt .alan{margin:0}
.sepet-oge__not{display:flex;justify-content:space-between;gap:8px;margin-top:8px;font-size:.8125rem;color:var(--soluk)}
.sepet-oge__tutar{font-weight:800;font-variant-numeric:tabular-nums;color:var(--vurgu)}
.sepet-oge.sorunlu{border-color:var(--hata)}
.sepet-oge.sorunlu .sepet-oge__not span:first-child{color:var(--hata);font-weight:700}
.adim{display:grid;grid-template-columns:44px 1fr 44px;gap:6px}
.adim .girdi{text-align:center;padding:0 4px;font-weight:700;font-size:1.0625rem}
.adim button{min-height:50px;border:1.5px solid var(--cizgi-2);border-radius:var(--yaricap-k);background:var(--yuzey-3);color:var(--metin);font-size:1.25rem;font-weight:700;cursor:pointer}
.adim button:active{background:var(--vurgu);color:var(--vurgu-ustu)}
.oneri{display:flex;gap:12px;align-items:center;width:100%;text-align:left;min-height:56px;padding:10px 14px;border:0;border-bottom:1px solid var(--cizgi);background:transparent;color:var(--metin);cursor:pointer}
.oneri:last-child{border-bottom:0}
.oneri:active{background:var(--yuzey-3)}
.oneri__ad{font-weight:650;line-height:1.25;overflow-wrap:anywhere}
.oneri__alt{font-size:.75rem;color:var(--soluk)}
.oneri__sag{margin-left:auto;text-align:right;flex:none;font-size:.8125rem;color:var(--soluk)}
.oneri__sag b{display:block;color:var(--metin);font-variant-numeric:tabular-nums}

/* Alttan açılan panel (sipariş onayı gibi) */
dialog.sheet{width:100%;max-width:560px;margin:auto auto 0;padding:0;border:1px solid var(--cizgi-2);border-bottom:0;border-radius:20px 20px 0 0;background:var(--yuzey);color:var(--metin);box-shadow:var(--golge);max-height:92dvh;overflow:auto}
dialog.sheet::backdrop{background:rgba(0,0,0,.65)}
.sheet__ic{padding:18px 16px 4px}
.sheet__baslik{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px;font-size:1.125rem;font-weight:800}
.sheet__alt{position:sticky;bottom:0;display:flex;gap:10px;padding:12px 16px calc(14px + env(safe-area-inset-bottom));background:var(--yuzey);border-top:1px solid var(--cizgi)}
.sheet__alt .dugme{flex:1}
@media (min-width:720px){dialog.sheet{margin:auto;border-radius:20px;border-bottom:1px solid var(--cizgi-2)}}


/* Düzenleme geçmişi */
.dz{border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--yuzey);margin-bottom:8px;overflow:hidden}
.dz summary{display:flex;gap:10px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
.dz summary::-webkit-details-marker{display:none}
.dz[open] summary i{transform:rotate(180deg)}
.dz__ust{flex:1;min-width:0}
.dz__kim{font-weight:650}
.dz__ne{font-size:.8125rem;color:var(--soluk)}
.dz__govde{padding:0 14px 10px;border-top:1px solid var(--cizgi)}
.dz__fark{display:grid;gap:2px;padding:9px 0;border-bottom:1px dashed var(--cizgi)}
.dz__fark:last-child{border-bottom:0}
.dz__alan{font-size:.75rem;color:var(--soluk);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.dz__eski{color:var(--hata);text-decoration:line-through;overflow-wrap:anywhere}
.dz__yeni{color:var(--basarili);font-weight:650;overflow-wrap:anywhere}

/* ---------- 8) Rozetler, özet, uyarı ---------- */
.rozet{
  display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;
  font-size:.75rem;font-weight:700;line-height:1.6;white-space:nowrap;
  background:var(--yuzey-3);color:var(--soluk);
}
.rozet--basarili{background:rgba(var(--basarili-rgb),.14);color:var(--basarili)}
.rozet--hata{background:rgba(var(--hata-rgb),.14);color:var(--hata)}
.rozet--uyari{background:rgba(var(--uyari-rgb),.14);color:var(--uyari)}
.rozet--bilgi{background:rgba(var(--bilgi-rgb),.14);color:var(--bilgi)}
.rozet--vurgu{background:var(--vurgu-zemin);color:var(--vurgu)}

.ozetler{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.ozetler--2{grid-template-columns:repeat(2,1fr)}
.ozet{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:12px 10px;text-align:center;min-width:0}
a.ozet{display:block;color:inherit}
a.ozet:active{background:var(--yuzey-3)}
.ozet__etiket{font-size:.75rem;color:var(--soluk);font-weight:600}
.ozet__deger{font-size:1.1875rem;font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px;overflow-wrap:normal;word-break:normal}
.ozetler:not(.ozetler--2) .ozet__deger{font-size:clamp(.8125rem,4.1vw,1.1875rem);white-space:nowrap}
.ozet{padding-left:6px;padding-right:6px}
.ozet--vurgu .ozet__deger{color:var(--vurgu)}

.uyari{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--yaricap-k);margin-bottom:12px;font-size:.9375rem;border:1px solid var(--cizgi-2);background:var(--yuzey-2)}
.uyari i{font-size:1.1rem;margin-top:1px}
.uyari--basarili{background:rgba(var(--basarili-rgb),.1);border-color:rgba(var(--basarili-rgb),.4);color:var(--basarili-acik)}
.uyari--hata{background:rgba(var(--hata-rgb),.1);border-color:rgba(var(--hata-rgb),.4);color:var(--hata-acik)}
.uyari--uyari{background:rgba(var(--uyari-rgb),.1);border-color:rgba(var(--uyari-rgb),.4);color:var(--uyari-acik)}
.uyari--bilgi{background:rgba(var(--bilgi-rgb),.1);border-color:rgba(var(--bilgi-rgb),.4);color:var(--bilgi-acik)}

/* Anahtar-değer satırları (detay sayfaları) */
.kv{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--cizgi)}
.kv:last-child{border-bottom:0}
.kv__e{color:var(--soluk);font-size:.9375rem}
.kv__d{font-weight:600;text-align:right;overflow-wrap:break-word}

/* ---------- 9) Tablo: masaüstünde tablo, mobilde kart ---------- */
.tablo-kap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--yuzey)}
.tablo{width:100%;border-collapse:collapse;font-size:.9375rem}
.tablo th{
  text-align:left;padding:11px 14px;font-size:.75rem;font-weight:700;color:var(--soluk);
  text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--cizgi);background:var(--yuzey-2);white-space:nowrap;
}
.tablo td{padding:12px 14px;border-bottom:1px solid var(--cizgi);vertical-align:middle}
.tablo tr:last-child td{border-bottom:0}
.tablo tbody tr:hover{background:var(--yuzey-2)}
.tablo .sag{text-align:right}
.tablo tfoot td{font-weight:800;background:var(--yuzey-2);border-top:2px solid var(--cizgi-2)}
@media (max-width:719px){
  .tablo--kart,.tablo--kart tbody,.tablo--kart tr,.tablo--kart td,.tablo--kart tfoot{display:block}
  .tablo-kap:has(.tablo--kart){border:0;background:transparent;overflow:visible}
  .tablo--kart thead{display:none}
  .tablo--kart tr{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);margin-bottom:10px;padding:8px 14px}
  .tablo--kart td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:6px 0;border:0;text-align:right}
  .tablo--kart td::before{content:attr(data-etiket);color:var(--soluk);font-size:.8125rem;font-weight:600;text-align:left;flex:none}
  .tablo--kart td[data-etiket=""]::before,.tablo--kart td:not([data-etiket])::before{display:none}
  .tablo--kart tfoot tr{background:var(--yuzey-2)}
  .tablo--kart tbody tr:hover{background:var(--yuzey)}
}

/* ---------- 10) Sayfalama / daha fazla ---------- */
.daha-fazla{display:flex;justify-content:center;padding:14px 0 6px}
.iskelet{height:64px;border-radius:var(--yaricap);background:linear-gradient(90deg,var(--yuzey) 25%,var(--yuzey-2) 50%,var(--yuzey) 75%);background-size:200% 100%;animation:parilti 1.2s infinite}
@keyframes parilti{to{background-position:-200% 0}}

/* ---------- 11) Bildirim (toast), onay kutusu ---------- */
.bildirimler{position:fixed;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 84px);z-index:100;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;padding:0 var(--bosluk)}
@media (min-width:1024px){.bildirimler{bottom:24px}}
.bildirim{
  pointer-events:auto;max-width:480px;width:100%;
  display:flex;gap:10px;align-items:center;padding:13px 16px;border-radius:var(--yaricap-k);
  background:var(--yuzey-3);border:1px solid var(--cizgi-2);box-shadow:var(--golge);
  font-weight:600;font-size:.9375rem;animation:yuksel .22s ease-out;
}
.bildirim--basarili{border-color:rgba(var(--basarili-rgb),.6)} .bildirim--basarili i{color:var(--basarili)}
.bildirim--hata{border-color:rgba(var(--hata-rgb),.6)} .bildirim--hata i{color:var(--hata)}
@keyframes yuksel{from{opacity:0;transform:translateY(10px)}}

dialog.kutu{
  width:min(92vw,420px);padding:0;border:1px solid var(--cizgi-2);border-radius:18px;
  background:var(--yuzey);color:var(--metin);box-shadow:var(--golge);
}
dialog.kutu::backdrop{background:rgba(0,0,0,.65);backdrop-filter:blur(2px)}
.kutu__ic{padding:20px 20px 8px}
.kutu__baslik{font-size:1.125rem;font-weight:700;margin:0 0 6px}
.kutu__metin{color:var(--soluk);margin:0}
.kutu__alt{display:flex;gap:10px;padding:16px 20px 20px}
.kutu__alt .dugme{flex:1}

.cevrimdisi{position:fixed;top:0;left:0;right:0;z-index:200;padding:calc(8px + env(safe-area-inset-top)) 16px 8px;background:var(--hata);color:var(--hata-ustu);text-align:center;font-weight:700;font-size:.875rem}

/* ---------- 12) Giriş sayfası ---------- */
body.giris{display:flex;align-items:center;justify-content:center;padding:24px 16px}
.giris__kutu{width:100%;max-width:400px}
.giris__marka{text-align:center;margin-bottom:28px}
.giris__logo{width:72px;height:72px;margin:0 auto 14px;border-radius:20px;background:var(--vurgu);color:var(--vurgu-ustu);display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:900}
.giris__marka h1{font-size:1.5rem;margin:0}
.giris__marka p{color:var(--soluk);margin:4px 0 0}

/* ---------- 13) Yardımcılar ---------- */
.sessiz{color:var(--soluk)} .vurgu{color:var(--vurgu)} .basarili{color:var(--basarili)} .hata{color:var(--hata)}
.kalin{font-weight:700} .sag{text-align:right} .orta{text-align:center}
.para{font-variant-numeric:tabular-nums;white-space:nowrap}
.esnek{display:flex;align-items:center;gap:10px} .esnek--arasi{justify-content:space-between}
.m-0{margin:0} .mt-1{margin-top:6px} .mt-2{margin-top:12px} .mt-3{margin-top:20px} .mb-2{margin-bottom:12px} .mb-3{margin-bottom:20px}
.gizle-mobil{display:none}
@media (min-width:720px){.gizle-mobil{display:revert}.yalniz-mobil{display:none!important}}
.yalniz-yazdir{display:none}

/* ---------- 14) Yazdırma ---------- */
@media print{
  :root{color-scheme:light}
  body{background:#fff!important;color:#000!important;font-size:12px}
  .ust,.altbar,.bildirimler,.arama,.cipler,.yazdirma-gizle,.dugme{display:none!important}
  .sayfa{max-width:none;padding:0}
  .kart,.tablo-kap,.satir{background:#fff!important;border-color:#bbb!important;color:#000!important;box-shadow:none!important}
  .tablo th,.tablo td{color:#000!important;background:#fff!important;border-color:#bbb!important}
  .sessiz,.satir__alt,.kv__e{color:#444!important}
  .yalniz-yazdir{display:revert}
}

/* ---------- Tehlikeli bölüm kartı (silme vb.): satır içi renk yerine sınıf ---------- */
.kart--tehlike{border-color:rgba(var(--hata-rgb),.5)}

/* ---------- Giriş sonrası ana menü: eski tarz (ortada kart, alt alta çerçeveli düğmeler) ---------- */
.sayfa--ustsuz{max-width:none;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:16px}
.eski-kart{width:100%;max-width:440px;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:14px;padding:2rem;box-shadow:var(--golge)}
@media (max-width:576px){.eski-kart{padding:1.5rem}}
.eski-ust{position:relative;display:flex;align-items:center;justify-content:center;min-height:40px;margin:0 0 1.5rem;padding:0 40px}
.eski-baslik{margin:0;text-align:center;color:var(--vurgu);font-size:clamp(1.1rem,5.2vw,1.5rem);font-weight:700;line-height:1.2}
.eski-geri{position:absolute;left:-8px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:var(--soluk);font-size:1.25rem;text-decoration:none}
.eski-geri:hover,.eski-geri:active{color:var(--metin);background:var(--yuzey-2)}
.eski-grup{margin:1.25rem 0 .5rem;color:var(--soluk);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.eski-kart .ozetler{margin:0 0 .75rem}
.eski-kart .ozet{background:var(--yuzey-2);padding-left:4px;padding-right:4px}
.eski-kart .ozet__deger{font-size:clamp(.9rem,4.4vw,1.0625rem)}
.eski-kart .sessiz.m-0{text-align:center}
.eski-hos{margin:0 0 1rem;text-align:center;color:var(--soluk);font-weight:600}
.eski-liste{display:grid;gap:8px}
.eski-dugme{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:.9rem 1rem;border:1px solid var(--vurgu);border-radius:.65rem;background:transparent;color:var(--vurgu);font:inherit;line-height:1.5;text-align:center;text-decoration:none;cursor:pointer}
.eski-dugme i{font-size:1.1rem;flex:none}
.eski-dugme--rozetli{padding-left:2.75rem;padding-right:2.75rem}
.eski-dugme__metin{display:flex;flex-direction:column;align-items:center;min-width:0;max-width:100%}
.eski-dugme__not{display:block;max-width:100%;margin-top:2px;font-size:.75rem;font-weight:400;opacity:.78;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* tek satır: taşarsa … ile biter */
.eski-dugme--dolu{background:var(--vurgu);color:var(--vurgu-ustu);font-weight:700}
.eski-dugme--dolu:hover,.eski-dugme--dolu:active{background:var(--vurgu-2)}
.eski-dugme:hover,.eski-dugme:active,.eski-dugme:focus-visible{background:var(--vurgu);color:var(--vurgu-ustu);text-decoration:none}
.eski-rozet{position:absolute;right:14px;top:50%;transform:translateY(-50%);min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:var(--vurgu);color:var(--vurgu-ustu);font-size:.8125rem;font-weight:800;line-height:24px;text-align:center}
.eski-dugme:hover .eski-rozet,.eski-dugme:active .eski-rozet{background:var(--vurgu-ustu);color:var(--vurgu)}

/* Temalar düğmesi (giriş sayfası ve ana menü) ve seçim penceresi */
.tema-dugme{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;padding:.75rem 1rem;border:1px dashed var(--cizgi-2);border-radius:.65rem;background:transparent;color:var(--soluk);font:inherit;font-size:.9375rem;cursor:pointer}
.tema-dugme:hover{color:var(--metin);border-color:var(--soluk)}
.tema-dugme b{color:var(--metin)}

/* ==========================================================================
   TEMALAR  —  <html data-tema="..."> ; varsayılan tema :root'tur (sarı-siyah).
   Seçim yalnız tarayıcıda saklanır (kullanıcıya bağlı, sunucuya/veritabanına yazılmaz); bkz. panel.js ve ui.php.
   ARALARINDAKİ BÖLÜM ÜRETİLMİŞTİR: elle düzenleme; tools/tema-uret.py içindeki tabloyu düzenleyip çalıştır.
   Her temanın yazı/zemin kontrastı ölçülür (ana metin >= 7:1, soluk ve renkli metin >= 4,5:1).
   Varsayılan dışındaki tüm temalarda "başarılı" ve "hata" renkleri yeşil/kırmızı DEĞİLDİR (renk körlüğü simülasyonuyla seçildi).
   R1, R2, R3: sırasıyla protan, deutan ve tritan türü için ayrı ayrı en ayırt edilebilir palet aranarak üretildi.
   ========================================================================== */
/* TEMALAR-URETILDI-BASLA */
html[data-tema="ozel"]{
  --bg:#0e0e10; --yuzey:#17171a; --yuzey-2:#1f1f23; --yuzey-3:#2a2a30;
  --cizgi:#4c4c58; --cizgi-2:#666673;
  --metin:#f5f5f6; --soluk:#cbcbd5; --cok-soluk:#a0a0ad;
  --vurgu:#ffc440; --vurgu-2:#ffd476; --vurgu-koyu:#e8a800; --vurgu-ustu:#1a1400;
  --vurgu-rgb:255,196,64; --vurgu-ustu-rgb:26,20,0;
  --basarili:#8babff; --basarili-rgb:139,171,255; --basarili-acik:#dbe5ff; --basarili-ustu:#07142e;
  --hata:#f28c99; --hata-rgb:242,140,153; --hata-acik:#ffdce1; --hata-ustu:#2a0a0a;
  --uyari:#ffc440; --uyari-rgb:255,196,64; --uyari-acik:#ffe9b3;
  --bilgi:#8babff; --bilgi-rgb:139,171,255; --bilgi-acik:#dbe5ff;
  --ust-zemin:rgba(14,14,16,.92); --nav-zemin:rgba(23,23,26,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}
html[data-tema="okyanus"]{
  --bg:#0a1220; --yuzey:#101a2c; --yuzey-2:#16223a; --yuzey-3:#1f2d4a;
  --cizgi:#2a3a5c; --cizgi-2:#3a4e78;
  --metin:#eaf2ff; --soluk:#b0c0dc; --cok-soluk:#8296b8;
  --vurgu:#5ec2ff; --vurgu-2:#8bd3ff; --vurgu-koyu:#35a8ee; --vurgu-ustu:#04121f;
  --vurgu-rgb:94,194,255; --vurgu-ustu-rgb:4,18,31;
  --basarili:#9fe5bb; --basarili-rgb:159,229,187; --basarili-acik:#d4f5e1; --basarili-ustu:#052e1c;
  --hata:#fe8133; --hata-rgb:254,129,51; --hata-acik:#ffd5b8; --hata-ustu:#2a0a0a;
  --uyari:#f7f797; --uyari-rgb:247,247,151; --uyari-acik:#fcfccf;
  --bilgi:#5ec2ff; --bilgi-rgb:94,194,255; --bilgi-acik:#cdeeff;
  --ust-zemin:rgba(10,18,32,.92); --nav-zemin:rgba(16,26,44,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}
html[data-tema="morgece"]{
  --bg:#0f0b18; --yuzey:#171124; --yuzey-2:#1f1830; --yuzey-3:#2a2140;
  --cizgi:#352b50; --cizgi-2:#4a3c70;
  --metin:#f3effc; --soluk:#bab1d0; --cok-soluk:#9287b0;
  --vurgu:#b69cff; --vurgu-2:#cdbbff; --vurgu-koyu:#9a7cf0; --vurgu-ustu:#140a2e;
  --vurgu-rgb:182,156,255; --vurgu-ustu-rgb:20,10,46;
  --basarili:#66c5ab; --basarili-rgb:102,197,171; --basarili-acik:#c9efe4; --basarili-ustu:#052e1c;
  --hata:#fe8133; --hata-rgb:254,129,51; --hata-acik:#ffd5b8; --hata-ustu:#2a0a0a;
  --uyari:#eeeea0; --uyari-rgb:238,238,160; --uyari-acik:#fafad2;
  --bilgi:#b69cff; --bilgi-rgb:182,156,255; --bilgi-acik:#e4d9ff;
  --ust-zemin:rgba(15,11,24,.92); --nav-zemin:rgba(23,17,36,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}
html[data-tema="gunduz"]{
  --bg:#f3f4f7; --yuzey:#ffffff; --yuzey-2:#eef0f5; --yuzey-3:#e2e6ee;
  --cizgi:#cfd5e0; --cizgi-2:#aeb7c7;
  --metin:#14171c; --soluk:#4b5362; --cok-soluk:#667085;
  --vurgu:#1150c4; --vurgu-2:#0c3f9e; --vurgu-koyu:#0c3f9e; --vurgu-ustu:#ffffff;
  --vurgu-rgb:17,80,196; --vurgu-ustu-rgb:255,255,255;
  --basarili:#2a6482; --basarili-rgb:42,100,130; --basarili-acik:#1d4a61; --basarili-ustu:#ffffff;
  --hata:#a84700; --hata-rgb:168,71,0; --hata-acik:#6e2e00; --hata-ustu:#ffffff;
  --uyari:#573819; --uyari-rgb:87,56,25; --uyari-acik:#3b2410;
  --bilgi:#1150c4; --bilgi-rgb:17,80,196; --bilgi-acik:#0d3a94;
  --ust-zemin:rgba(243,244,247,.92); --nav-zemin:rgba(255,255,255,.96); --golge:0 8px 24px rgba(20,30,60,.14);
  color-scheme:light;
}
html[data-tema="r1"]{
  --bg:#0b0f14; --yuzey:#121821; --yuzey-2:#19212d; --yuzey-3:#232d3c;
  --cizgi:#3a4a60; --cizgi-2:#52657f;
  --metin:#f2f6fb; --soluk:#c3cedd; --cok-soluk:#98a6ba;
  --vurgu:#719df4; --vurgu-2:#9bbcf8; --vurgu-koyu:#4f82e8; --vurgu-ustu:#030a16;
  --vurgu-rgb:113,157,244; --vurgu-ustu-rgb:3,10,22;
  --basarili:#a1f7e9; --basarili-rgb:161,247,233; --basarili-acik:#dafcf6; --basarili-ustu:#04241f;
  --hata:#f07c42; --hata-rgb:240,124,66; --hata-acik:#ffdcc8; --hata-ustu:#2a0f02;
  --uyari:#f0f042; --uyari-rgb:240,240,66; --uyari-acik:#fbfbb8;
  --bilgi:#719df4; --bilgi-rgb:113,157,244; --bilgi-acik:#d6e4fc;
  --ust-zemin:rgba(11,15,20,.92); --nav-zemin:rgba(18,24,33,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}
html[data-tema="r2"]{
  --bg:#12100d; --yuzey:#1b1814; --yuzey-2:#24201a; --yuzey-3:#302a22;
  --cizgi:#4d463a; --cizgi-2:#6a6252;
  --metin:#f8f4ee; --soluk:#d3cbbd; --cok-soluk:#a79e8d;
  --vurgu:#719df4; --vurgu-2:#9bbcf8; --vurgu-koyu:#4f82e8; --vurgu-ustu:#030a16;
  --vurgu-rgb:113,157,244; --vurgu-ustu-rgb:3,10,22;
  --basarili:#a1f7f7; --basarili-rgb:161,247,247; --basarili-acik:#dcfcfc; --basarili-ustu:#032424;
  --hata:#f48771; --hata-rgb:244,135,113; --hata-acik:#ffe0d9; --hata-ustu:#2e0f08;
  --uyari:#f0f042; --uyari-rgb:240,240,66; --uyari-acik:#fbfbb8;
  --bilgi:#719df4; --bilgi-rgb:113,157,244; --bilgi-acik:#d6e4fc;
  --ust-zemin:rgba(18,16,13,.92); --nav-zemin:rgba(27,24,20,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}
html[data-tema="r3"]{
  --bg:#0d0b12; --yuzey:#16131d; --yuzey-2:#1e1a28; --yuzey-3:#292434;
  --cizgi:#473f5c; --cizgi-2:#62597c;
  --metin:#f6f3fb; --soluk:#cdc6dc; --cok-soluk:#a097b5;
  --vurgu:#a1a1f7; --vurgu-2:#bcbcfa; --vurgu-koyu:#8484ee; --vurgu-ustu:#0d0d2e;
  --vurgu-rgb:161,161,247; --vurgu-ustu-rgb:13,13,46;
  --basarili:#71f4f4; --basarili-rgb:113,244,244; --basarili-acik:#d6fcfc; --basarili-ustu:#032424;
  --hata:#f07c42; --hata-rgb:240,124,66; --hata-acik:#ffdcc8; --hata-ustu:#2a0f02;
  --uyari:#f4c871; --uyari-rgb:244,200,113; --uyari-acik:#fdebc6;
  --bilgi:#a1a1f7; --bilgi-rgb:161,161,247; --bilgi-acik:#e0e0fc;
  --ust-zemin:rgba(13,11,18,.92); --nav-zemin:rgba(22,19,29,.96); --golge:0 10px 28px rgba(0,0,0,.4);
  color-scheme:dark;
}

/* Özel ve R1-R3 temalarında renk tek başına anlam taşımaz: işaretler (✓ ✕ ▲ ●), belirgin kenarlıklar, altı çizili bağlantılar */
html[data-tema="ozel"],
html[data-tema="r1"],
html[data-tema="r2"],
html[data-tema="r3"]{--odak:0 0 0 3px #ffffff}
html[data-tema="ozel"] a:not([class]),
html[data-tema="r1"] a:not([class]),
html[data-tema="r2"] a:not([class]),
html[data-tema="r3"] a:not([class]){text-decoration:underline;text-underline-offset:3px}
html[data-tema="ozel"] .rozet--basarili::before,
html[data-tema="r1"] .rozet--basarili::before,
html[data-tema="r2"] .rozet--basarili::before,
html[data-tema="r3"] .rozet--basarili::before{content:"\2713\00a0"}
html[data-tema="ozel"] .rozet--hata::before,
html[data-tema="r1"] .rozet--hata::before,
html[data-tema="r2"] .rozet--hata::before,
html[data-tema="r3"] .rozet--hata::before{content:"\2715\00a0"}
html[data-tema="ozel"] .rozet--uyari::before,
html[data-tema="r1"] .rozet--uyari::before,
html[data-tema="r2"] .rozet--uyari::before,
html[data-tema="r3"] .rozet--uyari::before{content:"\25B2\00a0"}
html[data-tema="ozel"] .rozet--bilgi::before,
html[data-tema="r1"] .rozet--bilgi::before,
html[data-tema="r2"] .rozet--bilgi::before,
html[data-tema="r3"] .rozet--bilgi::before{content:"\25CF\00a0"}
html[data-tema="ozel"] .cip.aktif::before,
html[data-tema="ozel"] .segment input:checked+span::before,
html[data-tema="r1"] .cip.aktif::before,
html[data-tema="r1"] .segment input:checked+span::before,
html[data-tema="r2"] .cip.aktif::before,
html[data-tema="r2"] .segment input:checked+span::before,
html[data-tema="r3"] .cip.aktif::before,
html[data-tema="r3"] .segment input:checked+span::before{content:"\2713\00a0"}
html[data-tema="ozel"] .uyari,
html[data-tema="r1"] .uyari,
html[data-tema="r2"] .uyari,
html[data-tema="r3"] .uyari{border-width:2px;border-left-width:6px}
html[data-tema="ozel"] .bildirim,
html[data-tema="r1"] .bildirim,
html[data-tema="r2"] .bildirim,
html[data-tema="r3"] .bildirim{border-width:2px}
html[data-tema="ozel"] .eski-kart,
html[data-tema="r1"] .eski-kart,
html[data-tema="r2"] .eski-kart,
html[data-tema="r3"] .eski-kart{border-width:2px}
html[data-tema="ozel"] .eski-dugme,
html[data-tema="r1"] .eski-dugme,
html[data-tema="r2"] .eski-dugme,
html[data-tema="r3"] .eski-dugme{border-width:2px;font-weight:600}
html[data-tema="ozel"] .kart,
html[data-tema="ozel"] .satir,
html[data-tema="r1"] .kart,
html[data-tema="r1"] .satir,
html[data-tema="r2"] .kart,
html[data-tema="r2"] .satir,
html[data-tema="r3"] .kart,
html[data-tema="r3"] .satir{border-width:1.5px}
html[data-tema="ozel"] .girdi:focus,
html[data-tema="ozel"] select:focus,
html[data-tema="ozel"] textarea:focus,
html[data-tema="r1"] .girdi:focus,
html[data-tema="r1"] select:focus,
html[data-tema="r1"] textarea:focus,
html[data-tema="r2"] .girdi:focus,
html[data-tema="r2"] select:focus,
html[data-tema="r2"] textarea:focus,
html[data-tema="r3"] .girdi:focus,
html[data-tema="r3"] select:focus,
html[data-tema="r3"] textarea:focus{outline:2px solid #fff;outline-offset:1px}
/* TEMALAR-URETILDI-BITIS */

/* Tema seçim penceresi */
.kutu--tema{max-width:420px;width:calc(100% - 32px)}
.tema-liste{display:grid;gap:10px;margin-top:14px;max-height:min(62vh,440px);overflow-y:auto;padding:2px}
.tema-secenek{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border:1px solid var(--cizgi-2);border-radius:12px;background:var(--yuzey-2);color:var(--metin);font:inherit;text-align:left;cursor:pointer}
.tema-secenek[aria-checked="true"]{border-color:var(--vurgu);box-shadow:inset 0 0 0 1px var(--vurgu)}
.tema-onizleme{display:flex;align-items:center;gap:5px;flex:none;padding:10px 12px;border-radius:10px;background:#0e0e10;border:1px solid #3b3b44}
.tema-onizleme i{display:block;width:14px;height:14px;border-radius:50%}
.tema-ad{flex:1;min-width:0;font-weight:700}
.tema-ad small{display:block;margin-top:2px;font-weight:500;color:var(--soluk);font-size:.8125rem}
.tema-isaret{flex:none;width:24px;text-align:center;font-weight:800;color:var(--vurgu);visibility:hidden}
.tema-secenek[aria-checked="true"] .tema-isaret{visibility:visible}