/* =========================================================
   Bootstrap 5.3 -> KRM token koprusu
   Bu dosya BU PROJEYE OZELDIR. Bootstrap ileride cikarilirsa
   yalniz bu dosya silinir.
   ========================================================= */

/* ---------------- Butonlar ---------------- */

.btn {
    font-family: var(--krm-font);
    font-size: var(--fs-body);
    font-weight: 600;
    height: var(--h-btn);
    padding: 0 var(--sp-4);
    border-radius: var(--r-btn);
    border: 1.5px solid transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    line-height: 1;
}

.btn-sm {
    height: var(--h-btn-sm);
    padding: 0 var(--sp-3);
    font-size: 13px;
}

.btn:focus-visible {
    outline: 2px solid var(--krm-navy);
    outline-offset: 2px;
    box-shadow: none;
}

.btn-primary {
    background: var(--krm-navy);
    border-color: var(--krm-navy);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: var(--krm-navy-dark) !important;
    border-color: var(--krm-navy-dark) !important;
    color: #fff !important;
}

.btn-secondary,
.btn-outline-secondary {
    background: #fff;
    color: var(--krm-navy);
    border-color: var(--krm-grey-300);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background: var(--krm-navy-tint) !important;
    border-color: var(--krm-navy) !important;
    color: var(--krm-navy) !important;
}

.btn-outline-primary {
    background: #fff;
    color: var(--krm-navy);
    border-color: var(--krm-navy);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: var(--krm-navy) !important;
    border-color: var(--krm-navy) !important;
    color: #fff !important;
}

.btn-danger {
    background: var(--krm-error);
    border-color: var(--krm-error);
    color: #fff;
}

.btn-danger:hover,
.btn-danger:focus {
    background: #8F1E18 !important;
    border-color: #8F1E18 !important;
    color: #fff !important;
}

.btn-outline-danger {
    background: #fff;
    color: var(--krm-error);
    border-color: var(--krm-error);
}

.btn-outline-danger:hover,
.btn-outline-danger:focus {
    background: var(--krm-error) !important;
    border-color: var(--krm-error) !important;
    color: #fff !important;
}

.btn-success {
    background: var(--krm-success);
    border-color: var(--krm-success);
    color: #fff;
}

.btn-success:hover,
.btn-success:focus {
    background: #166036 !important;
    border-color: #166036 !important;
    color: #fff !important;
}

.btn-outline-warning {
    background: #fff;
    color: var(--krm-warning);
    border-color: var(--krm-warning);
}

.btn-outline-warning:hover,
.btn-outline-warning:focus {
    background: var(--krm-warning) !important;
    border-color: var(--krm-warning) !important;
    color: #fff !important;
}

.btn-outline-success {
    background: #fff;
    color: var(--krm-success);
    border-color: var(--krm-success);
}

.btn-outline-success:hover,
.btn-outline-success:focus {
    background: var(--krm-success) !important;
    border-color: var(--krm-success) !important;
    color: #fff !important;
}

.btn:disabled,
.btn.disabled {
    background: var(--krm-grey-200);
    color: var(--krm-grey-400);
    border-color: transparent;
    opacity: 1;
}

/* ---------------- Form kontrolleri ---------------- */

.form-control,
.form-select {
    font-family: var(--krm-font);
    font-size: var(--fs-body);
    color: var(--krm-ink);
    border: 1px solid var(--krm-grey-300);
    border-radius: var(--r-input);
    min-height: var(--h-input);
    padding: 0 12px;
}

textarea.form-control {
    min-height: 80px;
    padding: 10px 12px;
    line-height: 1.45;
}

.form-control-sm,
.form-select-sm {
    min-height: var(--h-btn-sm);
    font-size: 13px;
    padding: 0 8px;
    border-radius: var(--r-input);
}

textarea.form-control-sm {
    padding: 6px 8px;
    min-height: var(--h-btn-sm);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--krm-navy);
    outline: 2px solid var(--krm-navy);
    outline-offset: 1px;
    box-shadow: none;
}

.form-control::placeholder {
    color: var(--krm-grey-400);
}

.form-control:disabled,
.form-select:disabled {
    background: var(--krm-grey-100);
    color: var(--krm-grey-400);
}

.form-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--krm-ink);
    margin-bottom: 6px;
}

.form-text {
    font-size: 12px;
    color: var(--krm-grey-600);
}

.form-check-input {
    border-color: var(--krm-grey-400);
}

.form-check-input:checked {
    background-color: var(--krm-navy);
    border-color: var(--krm-navy);
}

.form-check-input:indeterminate {
    background-color: var(--krm-navy-mid);
    border-color: var(--krm-navy-mid);
}

.form-check-input:focus {
    border-color: var(--krm-navy);
    box-shadow: none;
    outline: 2px solid var(--krm-navy);
    outline-offset: 1px;
}

.form-check-label {
    font-size: var(--fs-body);
}

/* ---------------- Kartlar ---------------- */

.card {
    border: 1px solid var(--krm-grey-300);
    border-radius: var(--r-card);
    box-shadow: var(--sh-sm);
    background: #fff;
}

.card-body {
    padding: var(--sp-4) var(--sp-5);
}

/* ---------------- Tablolar ----------------
   Tasarim sistemi bolum 8: uygulama ici tablo basligi ACIK olur.
   Lacivert baslik yalniz PDF/rapor ciktisinda kullanilir. */

.table {
    font-size: var(--fs-table);
    color: var(--krm-ink);
    margin-bottom: 0;
    --bs-table-bg: transparent;
}

.table > thead > tr > th {
    background: var(--krm-grey-50);
    color: var(--krm-grey-600);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 600;
    text-align: left;
    border-bottom: 2px solid var(--krm-grey-300);
    white-space: nowrap;
    vertical-align: middle;
    padding: 0 12px;
    height: 40px;
}

.table > tbody > tr > td {
    border-bottom: 1px solid var(--krm-grey-200);
    vertical-align: middle;
    padding: 10px 12px;
}

.table > tbody > tr:hover > td {
    background: var(--app-row-hover);
}

.table a {
    color: var(--krm-navy);
    font-weight: 600;
    text-decoration: none;
}

.table a:hover {
    text-decoration: underline;
}

.table .num,
.table th.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.table-responsive {
    border-radius: var(--r-card);
}

/* ---------------- Uyarilar ---------------- */

/* Tasarim sistemi .alert'i "ikon + metin" yapisi icin flex kurgulanmis
   (display:flex; gap:10px). Biz ikon kullanmiyoruz ve uyari kutularinin
   icinde satir ici <strong>, <ul> gibi ogeler var; flex bunlarin her
   birini ayri SUTUN yapiyor ve metin parcalaniyordu. Blok akisa alindi.
   max-width kaldirildi: sayfa genisliginde bilgi kutulari kullaniyoruz. */
.alert {
    display: block;
    border-radius: var(--r-input);
    padding: 12px 16px;
    font-size: var(--fs-body);
    border: 1px solid;
    margin-bottom: var(--sp-3);
    max-width: none;
}

.alert-success {
    background: var(--krm-success-tint);
    border-color: var(--krm-success);
    color: var(--krm-success);
}

.alert-danger {
    background: var(--krm-error-tint);
    border-color: var(--krm-error);
    color: var(--krm-error);
}

.alert-warning {
    background: var(--krm-warning-tint);
    border-color: var(--krm-warning);
    color: var(--krm-warning);
}

.alert-info {
    background: var(--krm-info-tint);
    border-color: var(--krm-navy);
    color: var(--krm-navy);
}

/* ---------------- Offcanvas (mobil kenar cubugu) ---------------- */

.offcanvas.krm-mobile-sidebar {
    background: var(--app-sidebar-bg);
    color: var(--app-sidebar-text);
    width: var(--app-sidebar-w);
}

.krm-mobile-sidebar .offcanvas-header {
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
}

.krm-mobile-sidebar .offcanvas-title {
    color: #fff;
}

.krm-mobile-sidebar .btn-close {
    filter: invert(1);
}

/* Mobil drawer icinde kenar cubugu her zaman genis moddadir. */
.krm-mobile-sidebar .krm-sidebar__link span,
.krm-mobile-sidebar .krm-sidebar__group {
    display: block;
}

.krm-mobile-sidebar .krm-sidebar__logo img {
    display: block;
}

/* ---------------- Modal ---------------- */

.modal-content {
    border-radius: var(--r-modal);
    border: 0;
    box-shadow: var(--sh-lg);
}

.modal-backdrop.show {
    background: var(--krm-navy);
    opacity: .55;
}

/* ---------------- Dropdown ---------------- */

.dropdown-menu {
    border: 1px solid var(--krm-grey-300);
    border-radius: var(--r-card);
    box-shadow: var(--sh-md);
    font-size: var(--fs-body);
    padding: var(--sp-1) 0;
}

.dropdown-item:active {
    background: var(--krm-navy);
}

.dropdown-header {
    padding: var(--sp-2) var(--sp-4);
}

/* ---------------- Yardimci ---------------- */

.text-muted {
    color: var(--krm-grey-600) !important;
}

a {
    color: var(--krm-navy);
}

/* Bootstrap .badge'i tasarim sistemi .badge'ini ezmesin diye
   nokta+metin rozetlerimiz .st-* ile birlikte kullanilir. */
.badge {
    font-family: var(--krm-font);
}