.py-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important
}

@media(min-width:576px) {
    .py-sm-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media(min-width:768px) {
    .py-md-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media(min-width:992px) {
    .py-lg-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media(min-width:1200px) {
    .py-xl-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media(min-width:1400px) {
    .py-xxl-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

.bsb-btn-xl {
    --bs-btn-padding-y: 0.625rem;
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-font-size: calc(1.26rem + 0.12vw);
    --bs-btn-border-radius: var(--bs-border-radius-lg)
}

@media(min-width:1200px) {
    .bsb-btn-xl {
        --bs-btn-font-size: 1.35rem
    }
}

.bsb-btn-2xl {
    --bs-btn-padding-y: 0.75rem;
    --bs-btn-padding-x: 1.5rem;
    --bs-btn-font-size: calc(1.27rem + 0.24vw);
    --bs-btn-border-radius: var(--bs-border-radius-lg)
}

@media(min-width:1200px) {
    .bsb-btn-2xl {
        --bs-btn-font-size: 1.45rem
    }
}

.bsb-btn-3xl {
    --bs-btn-padding-y: 0.875rem;
    --bs-btn-padding-x: 1.75rem;
    --bs-btn-font-size: calc(1.28rem + 0.36vw);
    --bs-btn-border-radius: var(--bs-border-radius-lg)
}

@media(min-width:1200px) {
    .bsb-btn-3xl {
        --bs-btn-font-size: 1.55rem
    }
}

.bsb-btn-4xl {
    --bs-btn-padding-y: 1rem;
    --bs-btn-padding-x: 2rem;
    --bs-btn-font-size: calc(1.29rem + 0.48vw);
    --bs-btn-border-radius: var(--bs-border-radius-lg)
}

@media(min-width:1200px) {
    .bsb-btn-4xl {
        --bs-btn-font-size: 1.65rem
    }
}

.bsb-btn-5xl {
    --bs-btn-padding-y: 1.125rem;
    --bs-btn-padding-x: 2.25rem;
    --bs-btn-font-size: calc(1.3rem + 0.6vw);
    --bs-btn-border-radius: var(--bs-border-radius-lg)
}

@media(min-width:1200px) {
    .bsb-btn-5xl {
        --bs-btn-font-size: 1.75rem
    }
}

.bsb-btn-circle {
    align-items: center;
    backface-visibility: hidden;
    border-radius: 50% !important;
    display: inline-flex;
    height: 2.5rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    width: 2.5rem
}

.bsb-btn-circle.bsb-btn-circle-sm {
    height: 2rem;
    width: 2rem
}

.bsb-btn-circle.bsb-btn-circle-lg {
    height: 3rem;
    width: 3rem
}

.bsb-btn-circle.bsb-btn-circle-xl {
    height: 3.5rem;
    width: 3.5rem
}

.bsb-btn-circle.bsb-btn-circle-2xl {
    height: 4rem;
    width: 4rem
}

.bsb-btn-circle.bsb-btn-circle-3xl {
    height: 4.5rem;
    width: 4.5rem
}

.bsb-btn-circle.bsb-btn-circle-4xl {
    height: 5rem;
    width: 5rem
}

.bsb-btn-circle.bsb-btn-circle-5xl {
    height: 5.5rem;
    width: 5.5rem
}

.bsb-btn-circle.bsb-btn-circle-6xl {
    height: 6rem;
    width: 6rem
}

.bsb-btn-circle.bsb-btn-circle-7xl {
    height: 6.5rem;
    width: 6.5rem
}

.bsb-btn-circle.bsb-btn-circle-8xl {
    height: 7rem;
    width: 7rem
}

.bsb-btn-circle.bsb-btn-circle-9xl {
    height: 7.5rem;
    width: 7.5rem
}

.bsb-btn-circle.bsb-btn-circle-10xl {
    height: 8rem;
    width: 8rem
}

.divac {
    display: block !important;
}
.divkapa {
    display: none !important;
}

.form-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.loginforminput { font-size: 1.1rem !important; font-weight: bold; }

/* ---------------------------------------------------------------------
   Giriş / yeni üyelik / şifre yenileme formlarının genişliği.

   Önceki hâli 50% / (≤768px) 90% / (≤576px) 100% idi ve iki kusuru vardı:

   1) newuser, newuserd ve unuttum sayfaları bu sınıfı hiç kullanmıyor,
      çıplak `w-50` yazıyordu. `w-50` kırılımdan bağımsız olduğu için
      form mobilde ekranın yarısına düşüyor, iki yanında büyük boşluk
      kalıyordu. Markup'taki `w-50`'ler .form-wrapper ile değiştirildi.

   2) 768/769px sınırında 90% → 50% sıçraması vardı: 768px'te form ~630px,
      769px'te ~351px oluyordu.

   max-width tabanlı tek kural ikisini de çözer ve kırılım sıçraması
   bırakmaz. 620px değeri masaüstündeki eski 50%'nin karşılığıdır
   (1440px ekranda form 645px genişliğindeydi).
   --------------------------------------------------------------------- */
.form-wrapper {
    width: 100%;
    max-width: 620px;
}

/* Form alanını saran Metronic kabı `flex: 1 0 auto` taşır. flex-shrink 0
   olduğundan öğe max-content genişliğinde kilitleniyor, dar ekranda
   küçülmüyor ve sayfa yatay kayıyordu (390px ekranda kap 449px kalıyordu;
   min-content 390px olduğu için sorun min-width değil, shrink idi).

   Seçici yalnızca .flex-center ile birlikte kullanılan form alanını
   hedefler; sayfa kabuğundaki `.d-flex.flex-row.flex-column-fluid`
   etkilenmez. */
.flex-column-fluid.flex-center {
    min-width: 0;
    flex-shrink: 1;
}
.unuttum { color:chocolate !important; font-size: 1.4rem !important;}

.unuttum:hover { color: brown !important; }


/* =====================================================================
   Giriş / Yeni Üyelik / Şifre Yenileme formları  (.ortka-form)
   Bootstrap 5 "form-floating" düzeni + görünür input çerçevesi.
   ===================================================================== */

.ortka-form .form-control,
.ortka-form .form-select {
    background-color: #fff;
    border: 1px solid #c5cad6;          /* varsayılan gray-300'den daha belirgin */
    border-radius: .475rem;
    font-size: 1.05rem;
    font-weight: 500;
    color: #181c32;
}

.ortka-form .form-control:hover,
.ortka-form .form-select:hover { border-color: #9aa2b7; }

.ortka-form .form-control:focus,
.ortka-form .form-select:focus {
    border-color: #009ef7;
    box-shadow: 0 0 0 .2rem rgba(0, 158, 247, .15);
}

/* Floating etiket: pasifken gri, alan doluyken/odaktayken küçülüp yukarı çıkar */
.ortka-form .form-floating > label {
    color: #7e8299;
    font-weight: 500;
    margin-bottom: 0;                   /* .form-label kalıntısını etkisizleştirir */
}
.ortka-form .form-floating > .form-control:focus ~ label,
.ortka-form .form-floating > .form-select:focus ~ label { color: #009ef7; }

/* Salt okunur e-posta alanı (kayıt 2. adımı) */
.ortka-form .form-control[readonly] {
    background-color: #f5f8fa;
    color: #5e6278;
}

/* Şifre göster/gizle düğmesi — input-group içinde form-floating ile hizalı */
.ortka-form .input-group > .btn.abton {
    border: 1px solid #c5cad6;
    border-left-color: #dfe3ec;
    background-color: #f5f8fa;
    color: #7e8299;
    padding-left: 1rem;
    padding-right: 1rem;
}
.ortka-form .input-group > .btn.abton:hover { background-color: #eef1f5; color: #009ef7; }
.ortka-form .input-group:focus-within > .btn.abton { border-color: #009ef7; }
.ortka-form .input-group > .btn.abton i { font-size: 1.35rem; line-height: 1; }

/* Otomatik doldurmada tarayıcının sarı zeminini bastır */
.ortka-form .form-control:-webkit-autofill,
.ortka-form .form-control:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #fff inset;
    -webkit-text-fill-color: #181c32;
}

/* Doğrulama hatasında kırmızı çerçeve (FormValidation .is-invalid ekliyor) */
.ortka-form .form-control.is-invalid,
.ortka-form .form-select.is-invalid { border-color: #f1416c; }
.ortka-form .form-control.is-invalid:focus,
.ortka-form .form-select.is-invalid:focus { box-shadow: 0 0 0 .2rem rgba(241, 65, 108, .15); }

.ortka-form .form-text { color: #7e8299; font-size: .85rem; margin-top: .4rem; }

/* ---------------------------------------------------------------------
   Floating label geometrisi — px tabanlı.
   Metronic'in kuralları rem tabanlı; bu sitede kök font-size 12px olduğu
   için alan 47px'e, etiketin yükselişi 6px'e düşüyor ve etki görünmez
   hale geliyordu. Aşağıdaki ölçüler rem'den bağımsız olduğu için etiket
   her formda aynı ve net biçimde yukarı kalkar, altında yazı alanı kalır.
   --------------------------------------------------------------------- */

.ortka-form .form-floating > .form-control,
.ortka-form .form-floating > .form-select {
    height: 58px;
    min-height: 58px;
    padding: 23px 14px 7px;      /* üstte etikete yer bırakılır */
    line-height: 1.3;
    font-size: 15px;
}
.ortka-form .form-floating > .form-select { padding-right: 38px; }

.ortka-form .form-floating > label {
    padding: 17px 14px;
    font-size: 15px;
    line-height: 1.3;
    height: auto;
    border: 0;
    transition: transform .12s ease-in-out, color .12s ease-in-out;
}

/* Odaklanınca ya da alan doluyken etiket küçülüp yukarı kalkar */
.ortka-form .form-floating > .form-control:focus ~ label,
.ortka-form .form-floating > .form-control:not(:placeholder-shown) ~ label,
.ortka-form .form-floating > .form-select ~ label {
    transform: scale(.8) translateY(-10px) translateX(1px);
    opacity: 1;
}

/* Yer tutucu metni görünmesin; görevi etiketin */
.ortka-form .form-floating > .form-control::placeholder { color: transparent; }

/* Şifre alanı input-group içinde — düğme yüksekliği alanla eşit kalsın */
.ortka-form .input-group > .form-floating { flex: 1 1 auto; }
.ortka-form .input-group > .btn.abton { height: 58px; }