/* AppFactory Kimlik — sade eşik (giriş, kayıt, parola, onay).
   Tek sütun, tek iş. Açıklama metni yok: marka üstte, alanlar ortada, tek eylem altta.
   kimlik.css'ten sonra yüklenir; yalnız body.sade altındaki sayfaları etkiler. */

:root{
  --pirinc:#12778C;
  --pirinc-parlak:#0F8298;
  --metin:#10262E;
  --metin-sessiz:#63727A;
  --yuzey:#FFFFFF;
  --zemin-sade:#EEF1F0;
  --dolgu:#F3F5F4;
  --dolgu-odak:#FFFFFF;
  --cizgi-sade:#DCE1DF;
  --tamam:#1F7A4D;
  --golge:0 1px 2px rgba(16,38,46,.05),0 12px 40px rgba(16,38,46,.08);
}
@media (prefers-color-scheme:dark){
  :root{
    --pirinc:#35C8E0;
    --pirinc-parlak:#74E3F3;
    --eylem-metin:#06222A;
    --metin:#EAF0F1;
    --metin-sessiz:#93A3A9;
    --yuzey:#14252C;
    --zemin-sade:#0C181D;
    --dolgu:#1B3039;
    --dolgu-odak:#203843;
    --cizgi-sade:#2A434D;
    --tamam:#5BC48F;
    --hata:#F0958E;
    --hata-zemin:#3A1F1E;
    --golge:none;
    color-scheme:dark;
  }
}

body.sade{
  background:var(--zemin-sade);
  color:var(--metin);
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:1.5rem 1rem;
  gap:1.5rem;
}
.sade-kutu{
  width:100%;
  max-width:23.5rem;
  background:var(--yuzey);
  border-radius:24px;
  box-shadow:var(--golge);
  padding:2.5rem 2rem 2rem;
  display:flex;
  flex-direction:column;
  gap:1.25rem;
}

/* ------------------------------------------------------------------ marka */
.sade-marka{display:flex;justify-content:center;align-items:center;min-height:2.75rem;margin:0 0 0.5rem}
.sade-marka img{display:block;height:2.25rem;width:auto;max-width:12rem}
.sade-marka-ad{
  margin:0;
  font-size:1.625rem;
  font-weight:700;
  letter-spacing:-0.02em;
  color:var(--metin);
  text-align:center;
  text-wrap:balance;
}
.sade-baslik{margin:0;font-size:var(--olcu-3);font-weight:600;text-align:center;text-wrap:balance}
.sade-baslik:empty,.sade-not:empty{display:none}
.sade-not{margin:-0.5rem 0 0;font-size:var(--olcu-2);color:var(--metin-sessiz);text-align:center;overflow-wrap:anywhere}
.sade-not strong{color:var(--metin);font-weight:600}

/* ------------------------------------------------------------ yazı alanı */
.sade form{display:flex;flex-direction:column;gap:0.75rem}
.yaz{position:relative}
.sade .yaz input{
  width:100%;
  height:3.5rem;
  padding:1.375rem 1rem 0.375rem;
  font:inherit;
  font-size:1rem;
  color:var(--metin);
  background:var(--dolgu);
  border:1.5px solid transparent;
  border-radius:14px;
  transition:background .15s,border-color .15s;
}
.sade .yaz input:focus{outline:none;background:var(--dolgu-odak);border-color:var(--pirinc)}
.sade .yaz input[aria-invalid="true"]{border-color:var(--hata)}
.sade .yaz label{
  position:absolute;
  left:1rem;top:50%;
  margin:0;
  font-size:1rem;
  font-weight:400;
  color:var(--metin-sessiz);
  pointer-events:none;
  transform:translateY(-50%);
  transform-origin:left center;
  transition:transform .15s,color .15s;
}
.sade .yaz input:focus + label,
.sade .yaz input:not(:placeholder-shown) + label{transform:translateY(-1.3rem) scale(0.75)}
.sade .yaz input:focus + label{color:var(--pirinc)}
.yaz.gozlu input{padding-right:3.25rem}
.goz{
  position:absolute;right:0.375rem;top:50%;transform:translateY(-50%);
  width:2.75rem;height:2.75rem;
  display:grid;place-items:center;
  background:none;border:0;border-radius:50%;
  color:var(--metin-sessiz);cursor:pointer;
}
.goz:hover{color:var(--metin)}
.goz svg{width:1.25rem;height:1.25rem}
.goz .kapali{display:none}
.goz[aria-pressed="true"] .acik{display:none}
.goz[aria-pressed="true"] .kapali{display:block}

/* parola kuralları: cümle yerine dört küçük gösterge */
.kural{display:flex;gap:0.375rem;list-style:none;margin:-0.25rem 0 0;padding:0}
.kural li{
  flex:1;
  text-align:center;
  padding:0.25rem 0;
  font-size:0.75rem;font-weight:600;
  font-variant-numeric:tabular-nums;
  color:var(--metin-sessiz);
  background:var(--dolgu);
  border-radius:8px;
  transition:color .15s,background .15s;
}
.kural li[data-tamam="evet"]{color:var(--tamam);background:color-mix(in srgb,var(--tamam) 14%,transparent)}

/* ------------------------------------------------------------------ onay */
.sade .onay-satir{align-items:center;margin:0;gap:0.75rem;min-height:1.75rem}
.sade .onay-satir input{width:1.25rem;height:1.25rem;margin:0;accent-color:var(--pirinc)}
.sade .onay-satir label{font-size:var(--olcu-1);color:var(--metin-sessiz);line-height:1.35}
.sade a{color:var(--metin);text-decoration:none;font-weight:600}
.sade a:hover{color:var(--pirinc)}
.sade .onay-satir a{text-decoration:underline;text-decoration-color:var(--cizgi-sade);text-underline-offset:3px}

/* ----------------------------------------------------------------- eylem */
.sade button.eylem{
  height:3.5rem;
  padding:0 1rem;
  margin-top:0.25rem;
  font-size:1rem;
  border-radius:14px;
  transition:background .15s,transform .05s;
}
.sade button.eylem:active:not(:disabled){transform:scale(0.985)}
.sade button.ikincil{color:var(--metin);border-color:var(--cizgi-sade);margin-top:0}
.sade button.ikincil:hover:not(:disabled){background:var(--dolgu);border-color:var(--cizgi-sade)}
.sade .sosyal-kap{margin:0;gap:0.75rem}
.sade .sosyal-ayrac{
  display:flex;align-items:center;gap:0.75rem;margin:0.25rem 0 0;
  font-size:0;color:var(--metin-sessiz);
}
.sade .sosyal-ayrac::before,.sade .sosyal-ayrac::after{content:"";flex:1;height:1px;background:var(--cizgi-sade)}

.sade-alt{display:flex;justify-content:space-between;gap:1rem;font-size:var(--olcu-2);flex-wrap:wrap}
.sade-alt.tek{justify-content:center}
.sade-alt a{padding:0.25rem 0}
.sade-alt a.sessiz{font-weight:400;color:var(--metin-sessiz)}
.sade-alt[hidden]{display:none}

.sade .durum{margin:0;border-radius:12px;border:0;text-align:center;background:var(--dolgu);color:var(--metin)}
.sade .durum[data-tip="hata"]{background:var(--hata-zemin);color:var(--hata)}

/* sonuç ekranı (posta gönderildi, doğrulandı) */
.sade-simge{
  width:4rem;height:4rem;margin:0 auto;
  display:grid;place-items:center;
  border-radius:50%;
  color:var(--pirinc);
  background:color-mix(in srgb,var(--pirinc) 14%,transparent);
}
.sade-simge svg{width:1.75rem;height:1.75rem}

/* altta üretici imzası */
.sade-imza{display:block;opacity:.55}
.sade-imza img{display:block;height:1.125rem;width:auto}
.sade-imza[hidden]{display:none}

@media (max-width:480px){
  body.sade{background:var(--yuzey);justify-content:flex-start;padding:0}
  .sade-kutu{max-width:none;flex:1;border-radius:0;box-shadow:none;padding:3.5rem 1.5rem 1.5rem;justify-content:center}
  .sade-imza{padding-bottom:1.5rem}
}