/* ==========================================================================
   polish.css — UI/UX rotus katmani
   --------------------------------------------------------------------------
   En son yuklenir, sadece GEOMETRI, TIPOGRAFI, BOSLUK, HAREKET ve ODAK
   duzeltir. Renk paletine dokunmaz: hicbir kural renk degeri atamaz
   (tek istisna odak halkasi, o da mevcut --frost degiskenidir).

   Neyi cozuyor (olcumle tespit edildi):
   1. Dort ayri buton geometrisi (4px / 12px / 100px kose, 53-58px yukseklik)
   2. Gorunur odak gostergesi yoktu (klavye kullanicisi kayboluyordu)
   3. Dokuz farkli kose yaricapi
   4. Dagiinik gecis egrileri (kimi ease, kimi cubic-bezier)
   5. Sticky menunun altina kayan capa baglantilari
   ========================================================================== */

:root{
  /* kose yaricap olcegi */
  --r-xs:10px; --r-sm:12px; --r-md:16px; --r-lg:22px; --r-pill:999px;
  /* hareket */
  --ease:cubic-bezier(.32,.72,0,1);
  --dur:.24s;
  --dur-slow:.42s;
  /* buton */
  --btn-h:52px;
  --btn-h-sm:40px;
  /* golge olcegi — marka laciverti tonunda (eski palet kalintisi yesil tonlar yerine) */
  --sh-sm:0 2px 10px -6px rgba(13,49,95,.26);
  --sh-md:0 14px 30px -20px rgba(13,49,95,.32);
  --sh-lg:0 26px 52px -32px rgba(13,49,95,.34);
  /* kalkma mesafeleri */
  --lift-btn:-2px;
  --lift-card:-4px;
}

/* --------------------------------------------------------------------------
   1. BUTONLAR — tek geometri
   .btn (style.css), .fd-btn ve .fd-btn-gold* (freeze.css) ayni olcude olur.
   Renk siniflari (.btn-primary, .fd-btn-gold ...) oldugu gibi kalir.
   -------------------------------------------------------------------------- */
.btn,
.fd-btn,
.fd-btn-gold,
.fd-btn-gold-solid{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:var(--btn-h);
  padding:13px 26px;
  border-radius:var(--r-sm);
  font-size:.97rem;
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.006em;
  text-align:center;
  transition:background var(--dur) var(--ease),
             border-color var(--dur) var(--ease),
             color var(--dur) var(--ease),
             transform var(--dur) var(--ease),
             box-shadow var(--dur) var(--ease);
}

/* kucuk buton da ayni ailede kalsin */
.btn-sm{
  min-height:var(--btn-h-sm);
  padding:9px 17px;
  font-size:.875rem;
  border-radius:var(--r-xs);
}

/* basili hissi: yukari kalkma + yumusak golge, her butonda ayni */
.btn:hover,
.fd-btn:hover,
.fd-btn-gold:hover,
.fd-btn-gold-solid:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 26px -16px rgba(13,49,95,.5);
}
.btn:active,
.fd-btn:active,
.fd-btn-gold:active,
.fd-btn-gold-solid:active{
  transform:translateY(0);
  box-shadow:none;
  transition-duration:.08s;
}

/* yan yana butonlar ayni taban cizgisine otursun */
.pd-cta,.fd-hero-actions,.err-actions,.sv-close,.sc-cta,.lg-cta,.pd-close{
  align-items:center;
}

/* --------------------------------------------------------------------------
   2. ODAK — klavyeyle gezenin nerede oldugu gorunsun
   Fareyle tiklamada cikmaz (:focus-visible), sadece klavye/erisilebilirlik.
   -------------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--frost);
  outline-offset:3px;
  border-radius:var(--r-xs);
}
/* zaten yuvarlak olanlarda halka da yuvarlak olsun */
.btn:focus-visible,
.fd-btn:focus-visible,
.fd-btn-gold:focus-visible,
.fd-btn-gold-solid:focus-visible{border-radius:var(--r-sm)}
.chip:focus-visible,.pd-tag:focus-visible{border-radius:var(--r-pill)}

/* form alanlarinda tutarli odak */
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline-offset:1px;
}

/* --------------------------------------------------------------------------
   3. FORM ALANLARI — ayni yukseklik, buton ile ayni kose
   Olcum: input 47px, select 49px idi; yan yana duran alanlar 2px kayiyordu.
   -------------------------------------------------------------------------- */
.field input:not([type=checkbox]):not([type=radio]):not([type=file]),
.field select,
.foot-newsletter input,
input[type=text],input[type=email],input[type=tel],
input[type=password],input[type=number],input[type=date],
select{
  min-height:48px;
  padding:12px 15px;
  border-radius:var(--r-sm);
  font-size:.97rem;
  font-family:inherit;
  line-height:1.3;
  transition:border-color var(--dur) var(--ease),
             box-shadow var(--dur) var(--ease);
}
textarea{
  padding:13px 15px;
  border-radius:var(--r-sm);
  font-size:.97rem;
  font-family:inherit;
  line-height:1.6;
  transition:border-color var(--dur) var(--ease),
             box-shadow var(--dur) var(--ease);
}
/* select'in kendi ok alani icin sagda yer birak */
.field select,select{padding-right:34px}

/* etiketler tek olcu */
.field label{
  display:block;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.01em;
  margin-bottom:7px;
}

/* yazarken alan belirginlessin (renk degismiyor, sadece halka) */
.field input:focus,
.field select:focus,
.field textarea:focus,
textarea:focus{
  box-shadow:0 0 0 3px var(--frost-wash);
}

/* --------------------------------------------------------------------------
   3b. KOSE YARICAPI — sadece gozle secilen aykirilar olcege cekilir.
   11 vs 12 px gibi farklar gorunmedigi icin onlara dokunulmaz:
   gereksiz override, gereksiz regresyon riski.
   -------------------------------------------------------------------------- */
.fd-param{border-radius:var(--r-xs)}        /* 5px  -> 10px */
.pager-btn,.file-btn,.qbtn{border-radius:var(--r-xs)}   /* 6-10px -> 10px */
.pager-btn{min-height:40px;display:inline-flex;align-items:center}
.frost,.cta-strip{border-radius:var(--r-lg)} /* 24px -> 22px */
.ui-modal,.tt-media{border-radius:var(--r-lg)}

/* --------------------------------------------------------------------------
   4. TIPOGRAFI — optik duzeltmeler
   -------------------------------------------------------------------------- */
h1,h2,h3,h4,.display{text-wrap:balance}
p,li{text-wrap:pretty}

/* uzun govde metni asiri genislemesin — okunabilir satir uzunlugu */
.pd-prose p,.lg-row dd,.sc-when dd{max-width:74ch}

/* rakamlar tabloda alt alta hizalansin */
table td,table th,.pd-spec .v,.pd-quick dd{font-variant-numeric:tabular-nums}

/* sayfa ici baglantilar sticky menunun altinda kalmasin */
html{scroll-padding-top:94px}

/* secim rengi markadan gelsin */
::selection{background:var(--frost-wash)}

/* --------------------------------------------------------------------------
   5. HAREKET — tek egri, tek sure
   -------------------------------------------------------------------------- */
.prod-card,.cat-card,.sv-card,.fk-card,.sc-card,.rel,
.pd-use,.pd-doc,.fd-pcard,.nav-sub,.nav-links a{
  transition-timing-function:var(--ease);
  transition-duration:var(--dur);
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* --------------------------------------------------------------------------
   6. DOKUNMA HEDEFI — mobilde her tiklanabilir en az 44px
   -------------------------------------------------------------------------- */
@media(max-width:900px){
  /* sadece public sayfalardaki ana cagri satirlari tam genislik olur;
     admin/panel tablolarindaki kucuk butonlar etkilenmez */
  .fd-hero-actions > .fd-btn,
  .fd-hero-actions > .btn,
  .pd-cta > .btn,
  .err-actions > .btn,
  .sv-close > .btn,
  .sc-cta > .btn,
  .lg-cta > .btn,
  .pd-close > .btn,
  .sv-other > .btn{width:100%}
  .links a,.nav-sub a{min-height:44px;display:flex;align-items:center}
}

/* --------------------------------------------------------------------------
   7. KART DAVRANISI — tek kalkma mesafesi, tek golge
   Olcum: hover'da -2px, -3px, -4px ve -5px olmak uzere dort farkli mesafe
   vardi; golgelerin bir kismi eski paletten kalma YESIL tonluydu
   (rgba(31,138,59,...) / rgba(15,46,40,...)) oysa marka lacivert.
   Asagisi sadece golge tonunu ve mesafeyi esitler; kart/zemin renkleri ayni.
   -------------------------------------------------------------------------- */
.prod-card:hover,.cat-card:hover,.fd-pcard:hover,.fd-benefit:hover,
.case-node:hover,.gsp-door:hover,.gsp-seg:hover,.sv-card:hover,
.fk-card:hover,.sc-card:hover,.rel:hover,.member-card:hover{
  transform:translateY(var(--lift-card));
  box-shadow:var(--sh-lg);
}
.pd-use:hover,.pd-doc:hover,.lg-note div:hover,.agenda-item:hover,
.notif-item:hover,.foot-social a:hover{
  transform:translateY(var(--lift-btn));
  box-shadow:var(--sh-sm);
}
/* sabit duran yuzeylerde yumusak derinlik */
.frost,.cta-strip,.ui-modal{box-shadow:var(--sh-lg)}

/* --------------------------------------------------------------------------
   8. KALAN OZGULLUK DUZELTMELERI
   .field textarea (0,1,1) benim textarea (0,0,1) kuralimi yeniyordu.
   -------------------------------------------------------------------------- */
.field textarea{border-radius:var(--r-sm);padding:13px 15px;font-size:.97rem}
.search-bar input:focus{box-shadow:0 0 0 3px var(--frost-wash)}

/* --------------------------------------------------------------------------
   9. ICERIGE ATLA — klavye kullanicisi 12 menu baglantisini atlayabilsin.
   Ekranda gorunmez; sadece Tab'a basildiginda belirir.
   -------------------------------------------------------------------------- */
.skip-link{
  position:absolute;left:12px;top:-60px;z-index:200;
  padding:11px 20px;border-radius:var(--r-sm);
  background:var(--white);border:1px solid var(--line-2);color:var(--ink);
  font-weight:600;font-size:.92rem;
  box-shadow:var(--sh-md);
  transition:top .2s var(--ease);
}
.skip-link:focus{top:12px}
main:focus{outline:none}
.flash{border-radius:var(--r-sm)}

/* --------------------------------------------------------------------------
   10. WHATSAPP FLOATER — hazir mesajla acilir, masaustunde etiket gosterir
   -------------------------------------------------------------------------- */
.wa{width:auto;min-width:56px;padding:0;gap:0;overflow:hidden;
    border-radius:var(--r-pill);
    transition:width var(--dur) var(--ease),padding var(--dur) var(--ease),
               transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.wa svg{flex:none}
.wa-label{max-width:0;opacity:0;white-space:nowrap;font-weight:600;font-size:.92rem;
  transition:max-width var(--dur) var(--ease),opacity var(--dur) var(--ease),
             margin var(--dur) var(--ease);margin-left:0}
@media(hover:hover) and (min-width:901px){
  .wa:hover,.wa:focus-visible{padding:0 22px 0 18px}
  .wa:hover .wa-label,.wa:focus-visible .wa-label{max-width:220px;opacity:1;margin-left:10px}
}
@media(max-width:900px){.wa-label{display:none}}