/* ============================================
   kayit.css — Kayıt sayfası özel stilleri
   Tailwind compiled style.css'i extend eder.
   ============================================ */

/* Aurora gradient background */
.bg-aurora {
    background:
        radial-gradient(60% 40% at 80% 0%, rgba(59, 130, 246, .18) 0%, transparent 70%),
        radial-gradient(70% 50% at 0% 10%, rgba(96, 165, 250, .14) 0%, transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef4fb 100%);
}

/* Logo gradient tile + float animation */
.logo-tile {
    background: radial-gradient(120% 120% at 0% 0%, #60a5fa 0%, #2563eb 55%, #1d4ed8 100%);
}
@keyframes floatY {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}
.animate-floatY { animation: floatY 5s ease-in-out infinite; }

/* Form field container */
.field {
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
    cursor: text; /* UX İyileştirmesi: Kutunun boşluğuna tıklanınca da input algısı yaratır */
}
.field:focus-within {
    border-color: #2563eb;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .14);
    background: #fff;
}
.field.has-error {
    border-color: #f87171;
    background: #fef2f2;
}

/* Custom shadows */
.shadow-card  { box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px -8px rgba(37, 99, 235, .12); }
.shadow-btn   { box-shadow: 0 1px 0 rgba(255,255,255,.15) inset, 0 6px 16px -4px rgba(37, 99, 235, .35); }
.shadow-field { box-shadow: 0 1px 0 rgba(15, 23, 42, .03) inset; }

/* Custom checkbox (.cb) */
.cb {
    appearance: none;
    -webkit-appearance: none;
    width: 1.25rem;
    height: 1.25rem;
    /* Kontrast İyileştirmesi: #cbd5e1 (slate-300) yerine #94a3b8 (slate-400) kullanıldı. 
       Lighthouse açık renk border'ları erişilebilirlik hatası olarak sayabilir. */
    border: 1.5px solid #94a3b8; 
    border-radius: .375rem;
    background: #fff;
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    transition: all .15s ease;
    flex-shrink: 0;
}
.cb:hover   { border-color: #64748b; } /* Hover durumu da bir ton koyulaştırıldı */
.cb:checked { background: #2563eb; border-color: #2563eb; }
.cb:checked::after {
    content: '';
    width: .7rem;
    height: .4rem;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg) translate(1px,-1px);
}
.cb:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .18);
}

/* Shake animation */
@keyframes shake {
    0%, 100%  { transform: translateX(0); }
    20%, 60%  { transform: translateX(-3px); }
    40%, 80%  { transform: translateX(3px); }
}
.shake { animation: shake .35s ease-in-out; }

/* iOS safe area */
.pb-safe { padding-bottom: max(1rem, env(safe-area-inset-bottom)); }
.pt-safe { padding-top: max(1rem, env(safe-area-inset-top)); }

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce) {
    .animate-floatY,
    .shake { animation: none; }
}

/* intl-tel-input v24 — Aurora .field içinde çift border'ı kaldır */
#phone-input-wrapper .iti { width: 100%; }
#phone-input-wrapper .iti.iti--allow-dropdown.iti--separate-dial-code {
    border: none !important;
    border-radius: inherit !important;
    min-height: auto !important;
    background: transparent !important;
}
#phone-input-wrapper .iti.iti--allow-dropdown.iti--separate-dial-code:focus-within {
    border: none !important;
    box-shadow: none !important;   /* focus ring zaten .field:focus-within veriyor */
}
#phone-input-wrapper .iti__selected-country {
    border-radius: 12px 0 0 12px !important;
    border-right: 1px solid #e2e8f0 !important;
    background: rgba(255,255,255,0.5);
    padding: 0 10px;
}
#phone-input-wrapper .iti__tel-input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    /* padding-left: JS ile dinamik ayarlanir */
}
#phone-input-wrapper .iti__selected-country {
    flex-shrink: 0 !important;      /* flag+code sabit, input esnek */
}