/* =============================================================================
   A5x2PDF — ortak tema
   -----------------------------------------------------------------------------
   Butun sayfalar once kendi <style> blogunu, sonra bu dosyayi yukluyor. Renk
   belirteclerinin TEK kaynagi burasi; sayfalarin icinde artik sabit renk yok.

   Uc renk:  turkuaz (vurgu)  ·  bordo (uyari/tehlike)  ·  ekru (zemin)

   Iki kip:  gunduz / gece. Varsayilan CIHAZIN kendi tercihi
   (prefers-color-scheme). Kullanici ust menudeki dugmeyle bunu ezerse secim
   html[data-tema] olarak yaziliyor ve localStorage'da kaliyor.

   Kontrast kasten yumusak: saf siyah/beyaz yok, cerceveler ince, koseler hafif
   yuvarlatilmis. Yine de en kucuk yazi bile WCAG AA (4.5:1) esiginin ustunde.
   ============================================================================= */

/* ------------------------------------------------------------- ortak temel
   Butun sayfalarda ayni olan temel kurallar. :where() ozgullugu sifirlar:
   bir sayfa ayni seciciyi kendi <style> blogunda farkli yazarsa (bu dosya
   SONRA yuklense bile) sayfanin kurali kazanir.                        */
:root{--pad:clamp(16px,3vw,34px);}
:where(*){box-sizing:border-box}
:where(html,body){margin:0}
:where(body){background:var(--ground);color:var(--ink); font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
:where(h1 .mark){color:var(--cut)}
:where(.panel){background:var(--panel);border:1px solid var(--rule);padding:18px}
:where(.panel + .panel){margin-top:14px}
:where(.hint){font-size:12.5px;color:var(--ink-soft);margin:5px 0 0}
:where(.alan){margin-bottom:14px}
:where(legend){font-size:13.5px;font-weight:600;padding:0;margin-bottom:7px}
:where(.mesaj.err){color:var(--cut)}
:where(.mesaj.ok){color:var(--ok)}
:where(.wrap){max-width:1080px;margin:0 auto;padding:var(--pad) var(--pad) 64px}
:where(h1){font-size:clamp(30px,5.5vw,50px);line-height:.95;letter-spacing:-.035em;font-weight:700;margin:0}
:where(fieldset){border:0;padding:0;margin:0 0 16px}
:where(fieldset:last-of-type){margin-bottom:0}
:where(header){border-bottom:1.5px solid var(--ink);padding-bottom:14px;margin-bottom:26px}
:where(.tag){margin:8px 0 0;max-width:52ch;color:var(--ink-soft);font-size:15px}
:where(h2){font-size:13px;font-weight:700;letter-spacing:.01em;margin:0 0 12px}

/* ------------------------------------------------------------------ gunduz */
:root{
  color-scheme: light;

  --ground:#EFE7DA;          /* ekru — sayfa zemini */
  --panel:#F7F1E6;           /* panel: zeminden bir ton acik */
  --paper:#FCFAF5;           /* girdi/kart yuzeyi */
  --ink:#2A2622;             /* yumusak siyah; saf siyah degil */
  --ink-soft:#6B6356;        /* ikincil yazi — panel uzerinde 4.7:1 */
  --ust-yazi:#FCFAF5;        /* --ink zemin uzerindeki yazi */
  --rule:#DCD1BD;            /* cerceve */
  --rule-soft:#E7DECD;       /* daha da silik ayirac */

  /* TURKUAZ — vurgu, bag, odak, secim.
     #0E7C86 idi; panel zemini (--panel) uzerinde 4,40:1 cikiyordu, yani AA
     esiginin (4,5) bir tik altinda. Bag metinleri ve "boş" gibi kucuk yazilar
     panel uzerinde duruyor, o yuzden bir ton koyulastirildi: artik 4,89:1.  */
  --cut:#0C737C;
  --cut-koyu:#09585F;
  --cut-yazi:#FCFDFD;        /* turkuaz zemin uzerindeki yazi */
  --vurgu-yumusak:#DCEDEE;   /* hafif turkuaz zemin (hover) */

  --tehlike:#8E2F3C;         /* BORDO — silme, hata, durdurma */
  --tehlike-koyu:#73242F;
  --tehlike-yazi:#FDF7F7;
  --tehlike-yumusak:#F3E2E4;

  --ok:#2F6E52;
  --ok-yazi:#F6FBF8;
  --uyari:#8A5A12;

  --ortu:rgba(42,38,34,.38);           /* pencere/kenar arkasi karartma */
  --golge-a:0 1px 2px rgba(42,38,34,.05), 0 2px 10px rgba(42,38,34,.045);
  --golge-b:0 6px 28px rgba(42,38,34,.16);
  --golge-cizgi:rgba(42,38,34,.13);

  --r1:9px;                  /* panel, kart, pencere */
  --r2:7px;                  /* dugme, girdi, secim */
  --r3:4px;                  /* rozet, etiket, kucuk dugme */
}

/* --------------------------------------------------------------------- gece
   Cihaz koyu kipteyse (ve kullanici acik kipi elle secmediyse) burasi gecerli. */
@media (prefers-color-scheme: dark){
  :root:not([data-tema="acik"]){
    color-scheme: dark;

    --ground:#15191B;
    --panel:#1D2326;
    --paper:#252C30;
    --ink:#E7E0D2;           /* ekru murekkep */
    --ink-soft:#A49C8C;
    --ust-yazi:#15191B;
    --rule:#343D41;
    --rule-soft:#2A3235;

    --cut:#5AC7CF;
    --cut-koyu:#7FD8DE;
    --cut-yazi:#0D2225;
    --vurgu-yumusak:#183A3F;

    --tehlike:#E2909B;
    --tehlike-koyu:#EFA9B3;
    --tehlike-yazi:#2A1216;
    --tehlike-yumusak:#3A2126;

    --ok:#6FBF92;
    --ok-yazi:#10241A;
    --uyari:#DBA85A;

    --ortu:rgba(6,9,10,.62);
    --golge-a:0 1px 2px rgba(0,0,0,.30), 0 2px 10px rgba(0,0,0,.22);
    --golge-b:0 6px 28px rgba(0,0,0,.50);
    --golge-cizgi:rgba(0,0,0,.45);
  }
}

/* Kullanici elle "gece" dediyse cihaz ne derse desin. */
:root[data-tema="koyu"]{
  color-scheme: dark;

  --ground:#15191B;
  --panel:#1D2326;
  --paper:#252C30;
  --ink:#E7E0D2;
  --ink-soft:#A49C8C;
  --ust-yazi:#15191B;
  --rule:#343D41;
  --rule-soft:#2A3235;

  --cut:#5AC7CF;
  --cut-koyu:#7FD8DE;
  --cut-yazi:#0D2225;
  --vurgu-yumusak:#183A3F;

  --tehlike:#E2909B;
  --tehlike-koyu:#EFA9B3;
  --tehlike-yazi:#2A1216;
  --tehlike-yumusak:#3A2126;

  --ok:#6FBF92;
  --ok-yazi:#10241A;
  --uyari:#DBA85A;

  --ortu:rgba(6,9,10,.62);
  --golge-a:0 1px 2px rgba(0,0,0,.30), 0 2px 10px rgba(0,0,0,.22);
  --golge-b:0 6px 28px rgba(0,0,0,.50);
  --golge-cizgi:rgba(0,0,0,.45);
}

body{background:var(--ground);color:var(--ink)}

/* [hidden] her zaman gizlesin.
   -----------------------------------------------------------------------------
   Tarayicinin kendi `[hidden]{display:none}` kurali en dusuk oncelikte. Sayfada
   `#kenarSecimCubugu{display:grid}` gibi bir kural varsa `hidden` niteligi HIC
   is gormuyor. Bu yuzden arsivdeki toplu secim cubugu ("0 seçili · Tümü ·
   Sil…") duzenleme kipi kapaliyken de, hatta giris yapilmamisken de ekranda
   duruyordu; ayni sekilde #kenarUst de. Tek satirla kapatiyoruz — JS'te
   `.hidden = true` diyen her yer artik gercekten gizliyor.                   */
[hidden]{display:none!important}

/* =========================================================== yumusatma katmani
   Eski tasarim sert cerceveliydi: 1.5px saf murekkep cizgiler, dugmede tam ters
   renk. Ayni iskelet duruyor, yalniz siddeti dusuruluyor.                     */

/* --- koseler --- */
.panel,.adim,.kart,.karsilastir,.karsiKart,.tahmin,.a5kutu,#drop,.onizle,
.sayac,.metin,.kaydir,.sheet{border-radius:var(--r1)}
.btn,.go,button.go,button.linkish,.radios label,.karsiSec label,.klasorSec,
input[type=text],input[type=password],input[type=number],input[type=email],
input[type=search],select,textarea,.nums input,.kenarNot,#kenarArama{
  border-radius:var(--r2);
}
.etik,.rozetD,.kod,.damga,.kucukDugme,.is .klasor,.kenarNot .dil,
.parcalar i,.cubuk,.cubuk i{border-radius:var(--r3)}
.rozet{border-radius:50%}

/* --- cerceveler: 1.5px murekkep yerine 1px silik cizgi --- */
header,header.sayfa{border-bottom:1px solid var(--rule)}
.topbar{border-bottom:1px solid var(--rule)}
.sitefoot{border-top:1px solid var(--rule)}
.panel,.adim,.kart,.karsilastir,.karsiKart,.tahmin{
  border:1px solid var(--rule-soft);box-shadow:var(--golge-a);
}
.a5kutu{border:1px solid var(--rule);box-shadow:var(--golge-b)}
.rozet{border:1px solid var(--rule)}
.adim.bitti .rozet{background:var(--ok);border-color:var(--ok);color:var(--ok-yazi)}
.etik.bagli{background:var(--ok);border-color:var(--ok);color:var(--ok-yazi)}
.is.acik{outline-color:var(--cut)}

/* --- dugmeler: tam ters renk yerine turkuaz tonlama --- */
.btn:hover:not(:disabled),button.linkish:hover:not(:disabled){
  background:var(--vurgu-yumusak);color:var(--cut);border-color:var(--cut);
}
.btn.birincil{background:var(--cut);color:var(--cut-yazi);border-color:var(--cut)}
.btn.birincil:hover:not(:disabled){
  background:var(--cut-koyu);border-color:var(--cut-koyu);color:var(--cut-yazi);
}
.go,button.go{background:var(--cut);color:var(--cut-yazi)}
.go:not(:disabled):hover,button.go:not(:disabled):hover{background:var(--cut-koyu)}
.go:disabled,button.go:disabled{background:var(--rule);color:var(--ink-soft)}
.go.dur{background:var(--tehlike);color:var(--tehlike-yazi)}
.go.dur:not(:disabled):hover{background:var(--tehlike-koyu)}

.radios label:has(input:checked),.karsiSec label:has(input:checked){
  background:var(--cut);color:var(--cut-yazi);border-color:var(--cut);
}
.topbar nav a[aria-current=page]{color:var(--cut);border-color:var(--cut);font-weight:600}
.topbar nav a:hover{background:var(--paper);border-color:var(--rule);color:var(--ink)}

/* --- tehlike bordo, bilgi turkuaz --- */
.mesaj.err{color:var(--tehlike)}
.kucukDugme.tehlike{color:var(--tehlike)}
.kucukDugme.tehlike:hover{background:var(--tehlike);color:var(--tehlike-yazi);border-color:var(--tehlike)}
.parcalar i.hata{background:var(--tehlike);border-color:var(--tehlike)}
.karsiKart.kotu{border-left:3px solid var(--tehlike)}
.kutu{border-left-color:var(--cut)}
.kutu.iyi{border-left-color:var(--ok)}
.kutu.sakin{border-left-color:var(--rule)}

/* --- girdiler: odak halkasi turkuaz, cerceve silik --- */
input[type=text],input[type=password],input[type=number],input[type=email],
input[type=search],select,textarea,.nums input{
  border:1px solid var(--rule);background:var(--paper);color:var(--ink);
}
input:focus-visible,select:focus-visible,textarea:focus-visible,
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--cut);outline-offset:1px;
}
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline-offset:-1px;border-color:var(--cut);
}
::placeholder{color:var(--ink-soft);opacity:.75}
input,select,textarea,button{accent-color:var(--cut)}

/* --- baglar --- */
a{color:var(--cut)}
.sitefoot a{color:var(--ink)}
.sitefoot a:hover{color:var(--cut);border-color:var(--cut)}

/* ------------------------------------------------------- gece/gunduz dugmesi */
/* min-height:36px — olcerek bulundu: padding'le 25px kaliyordu ve telefonda
   parmakla isabet ettirmesi zordu. Ust cubuktaki butun tiklanabilir ogeler
   ayni esikte tutuluyor. */
.temaDugme{
  border:1px solid var(--rule);background:var(--paper);color:var(--ink-soft);
  border-radius:var(--r2);padding:6px 11px;min-height:36px;font:inherit;font-size:13px;
  line-height:1;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  white-space:nowrap;
}
.topbar nav a,.topbar .brand{display:inline-flex;align-items:center;min-height:36px}
.temaDugme:hover{color:var(--cut);border-color:var(--cut);background:var(--vurgu-yumusak)}
.temaDugme .simge{font-size:14px;line-height:1}
@media(max-width:600px){ .temaDugme .yazi{display:none} }

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Dosya secicileri gorsel olarak gizlenir ama CIZIM AGACINDA KALIR.
   NEDEN: Safari ve iOS'ta display:none olan bir <input type=file> uzerinde
   .click() cagirmak dosya penceresini ACMIYOR -- girdi yerlesimde bulunmali.
   [hidden] (yani display:none) kullanilirsa "PDF sec" tusu o tarayicilarda
   sessizce hicbir sey yapmaz. Burada goze gorunmuyor, tiklanamiyor, ama var. */
.gizliGirdi{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0;
  clip:rect(0 0 0 0); clip-path:inset(50%); overflow:hidden;
  white-space:nowrap; opacity:0; pointer-events:none;
}

/* =====================================================================
   DOKUNMATIK DUZELTMELERI  (telefon / tablet)
   =====================================================================
   Asagidaki kurallar parmakla kullanilan cihazlarda (hover:none /
   pointer:coarse) VE 1024px'e kadar olan ekranlarda aciliyor.

   Neden ikisi birden: gercek bir iPad "pointer: coarse" bildiriyor, ama
   tarayici emulasyonunun tablet onayari BILDIRMIYOR (olctum: coarse=false,
   maxTouchPoints=0). Yalniz coarse'a guvenseydim tabletteki duzeltmeyi hic
   dogrulayamazdim. 1024px siniri tabletleri GENISLIKTEN de yakaliyor,
   boylece olculebiliyor. Dar bir masaustu penceresi de bu kurallara
   giriyor; orada tek degisen dokunma hedeflerinin bollasmasi, zarari yok.
   Genis masaustu gorunumu ise hic degismiyor.                          */

@media (hover: none), (pointer: coarse), (max-width: 1024px) {

  /* --- 1. iOS'ta ALAN ODAKLANINCA SAYFAYI YAKINLASTIRMA SORUNU -------
     iOS Safari, yazi boyutu 16px'ten KUCUK olan bir alana dokunulunca
     sayfayi otomatik buyutuyor ve geri kucultmuyor. Sitedeki butun metin
     alanlari 13-14px'ti; yani telefonda e-postani ya da uzun bir API
     anahtarini yazmaya basladigin anda sayfa ziplayip formun yarisi
     ekran disinda kaliyordu. 16px bunu tamamen kapatiyor -- tek care bu,
     baska bir ayari yok. (Bilgisayarda olculer eskisi gibi kaliyor.)

     !important SART: sayfalarin kendi <style> bloklari ve #kenarArama gibi
     id secicileri bu kurali yoksa eziyor -- olctum, 28 alandan 3'u geride
     kalmisti. Burada ezilen tek sey yazi boyutu; riski yok. */
  input:not([type=radio]):not([type=checkbox]):not(.gizliGirdi),
  select, textarea { font-size: 16px !important; }

  /* (Kenar cubugunun hover'a bagli dugmeleri css/kenar.css'in sonunda
     acılıyor: bu dosya ONCE yukleniyor, ayni ozgullukteki kurali orasi
     eziyordu. Duzeltme kuralin yanina konmali.) */

  /* --- 3. DOKUNMA HEDEFI OLCULERI ------------------------------------
     Parmak ucu ~9mm; 21px'lik bir dugmeye nisan almak zor. Ikonlu
     kucuk dugmeler kare bir dokunma alani aliyor, metinli olanlar
     yalniz dikeyde buyuyor -- kenar cubugu 288px genis, yatayda yer
     yok. Gorsel olarak buyumesinler diye cerceve degil PADDING
     buyutuluyor. */
  /* 44px: Apple/Google'in onerdigi en kucuk dokunma alani. 34px'te kenar
     cubugunda yan yana duran dugmelere parmakla isabet etmek zordu
     (olculdu 2026-09-29: menude 63 hedef 44px'in altindaydi). Kenarin
     ayrintili olculeri css/kenar.css'in sonunda. */
  .kucukDugme { min-height: 40px; min-width: 40px; padding: 4px 8px; }

  /* Onay kutusu ve radyo satirlari: etiketin tamami dokunulabilir. */
  label.onay, .radios label { min-height: 38px; align-items: center; }

  /* Ust menu ve alt bilgi baglantilari. */
  .sitefoot a { display: inline-flex; align-items: center; min-height: 44px; }
  /* Baglanti gorunumlu dugmeler ("Modelleri yeniden dogrula" gibi): metin
     akisini bozmadan dikeyde buyusunler. */
  button.baglanti { display: inline-flex; align-items: center; min-height: 44px; }
  .ustMenuDugme, .temaDugme { min-height: 44px; }
  /* Sayfa dugmeleri de 44px (olculdu 2026-09-29: "Kaydet ve test et" 39,
     "Adresi kopyala" 32, "Uret" 36, kalibrasyon basligi 21px idi). */
  .btn, button.linkish, .kopyala, .go { min-height: 44px; }
  a.go { display: inline-flex; align-items: center; }
  /* Saglayici secicisinin yanindaki "Anahtar al" baglantisi (23px idi). */
  [id^="hizliAl_"] { display: inline-flex; align-items: center; min-height: 44px; }
  .sablonBtn { display: inline-flex; align-items: center; min-height: 44px; }
  details > summary { padding-top: 11px; padding-bottom: 11px; }
  .topbar nav a, .topbar .brand, .ustHesap { min-height: 44px; }
}