/*=============================================================
   Custom Modal – Bootstrap 5
   ------------------------------------------------------------
   • background‑clip, background‑color, border, border‑radius,
     box‑shadow, outline, position
   • z‑index for .modal‑dialog (opsiyonel – sizin 2200)
   • padding for .modal‑body, .modal‑header
   • .inmodal – ekstra stiller (arkaplan, başlık vb.)
   • .modal‑title, .modal‑icon
   • .modal‑footer
   ------------------------------------------------------------*/


/*------------------- 1. Modal Content -----------------------*/
.modal-content {
    /* bootstrap 5 variables are used so the look adapts to the current theme */
    background-clip: padding-box;
    background-color: #fff; /* aynı renk */
    border: var(--bs-modal-border-width) solid transparent;
    border-radius: var(--bs-modal-border-radius);
    box-shadow: var(--bs-box-shadow-sm); /* 0 1px 3px rgba(0,0,0,.3) gibi */
    outline: 0 none;
    position: relative; /* aynı */
}

/*------------------- 2. Modal Dialog -----------------------*/
/* Eğer başka bir modalın üstünde göstermek istiyorsanız z‑index’i artırın */
.modal-dialog {
    z-index: 2200; /* sizin isteğinize göre – Bootstrap’ın varsayılanı 1055 */
}

/*------------------- 3. Modal Body -------------------------*/
.modal-body {
    /* 20 px 30 px 30 px 30 px → rem’e çevirerek Bootstrap’ın tipografik ölçeğiyle uyumlu */
    padding: 1.25rem 1.875rem 1.875rem 1.875rem;
}

/* ek “in‑modal” arka plan */
.inmodal .modal-body {
    background: #f8fafb;
}

/*------------------- 4. Modal Header -----------------------*/
.inmodal .modal-header {
    /* 30 px 15 px → 1.875 rem 0.9375 rem */
    padding: 1.875rem .9375rem;
    text-align: center; /* ortala */
    display: block; /* aynı */
}

/*------------------- 5. Modal Title ------------------------*/
.inmodal .modal-title {
    font-size: 1.625rem; /* 26 px */
}

/*------------------- 6. Modal Icon (ekstra) ---------------*/
.inmodal .modal-icon {
    font-size: 5.25rem; /* 84 px */
    color: #e2e3e3;
}

/*------------------- 7. Modal Footer ----------------------*/
.modal-footer {
    margin-top: 0; /* varsayılanı sıfırla */
}

/*------------------- 8. Fade‑in animasyonu ----------------*/
/* Bootstrap 5 zaten .modal.fade .modal-dialog için bir translate‑y animasyonu tanımlar.
   Eğer animasyonu tamamen devre dışı bırakmak istiyorsanız: */
.modal.fade .modal-dialog {
    transform: none; /* varsayılan translate’i iptal eder */
}

/* -----------------------------------------------------------------
   (Opsiyonel) Close‑button stilini Bootstrap 5’e göre uyarlama:
   .btn-close’nun renk ve boyutunu değiştirmek isterseniz aşağıdaki gibi
   ekleyebilirsiniz.
   ----------------------------------------------------------------- */
.modal-header .btn-close {
    /* 2 × 2 rem standart “X” butonunun rengi */
    filter: invert(0.5);
}