/* ============================================================
   sifremi-unuttum.css — Şifremi Unuttum sayfa-özel stiller
   style.css derlenmiş/purge edilmiş Tailwind olduğundan, o
   derlemede bulunmayan sayfa-özel kurallar bu dosyadadır.
   ============================================================ */

/* Kart üst marka şeridi */
.su-accent{height:6px;background:linear-gradient(90deg,#2563eb 0%,#38bdf8 55%,#06b6d4 100%)}

/* ── Segmented (hap) sekme kontrolü ──
   Aktif/pasif görünüm aria-selected üzerinden yönetilir;
   JS yalnızca aria-selected + tabindex değiştirir (CSP-safe). */
.su-seg{display:flex;gap:.3rem;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:.9rem;padding:.3rem}
.su-seg button{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.6rem .25rem;border:0;background:transparent;border-radius:.65rem;font:inherit;font-size:.72rem;line-height:1rem;font-weight:600;color:#64748b;cursor:pointer;transition:color .15s ease,background-color .15s ease,box-shadow .15s ease;-webkit-tap-highlight-color:transparent}
.su-seg button i{font-size:1.05rem}
.su-seg button span{text-align:center}
@media(min-width:480px){
  .su-seg button{flex-direction:row;gap:.45rem;font-size:.85rem;padding:.65rem .5rem}
  .su-seg button i{font-size:.95em}
}
.su-seg button:hover{color:#334155;background:rgba(255,255,255,.55)}
.su-seg button[aria-selected="true"]{background:#fff;color:#2563eb;box-shadow:0 1px 2px rgb(15 23 42/.10),0 2px 8px rgb(15 23 42/.06)}
.su-seg button[aria-selected="true"]:hover{color:#2563eb}
.su-seg button:focus-visible{outline:2px solid #2563eb;outline-offset:2px}

/* Panel geçiş animasyonu (sekme değişince yeniden tetiklenir) */
@keyframes suFadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.su-anim{animation:suFadeUp .28s ease-out both}

/* Sonuç ekranı ikon pop animasyonu */
@keyframes suPop{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.su-pop{animation:suPop .45s cubic-bezier(.22,1,.36,1) both}

/* Uzun e-posta adresi taşma koruması (maskeli adres kutusu) */
.su-trunc{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* Hareket azaltma tercihi */
@media(prefers-reduced-motion:reduce){.su-anim,.su-pop{animation:none}}