/* =========================================================================
   KAYTAŞ — Tasarım sistemi çekirdeği
   Tokenlar, temel tipografi ve Metronic/Bootstrap bileşen ezmeleri.
   style.bundle.css'ten SONRA yüklenmelidir.
   ========================================================================= */

:root {
    /* --- Yüzeyler ------------------------------------------------------ */
    --kt-bg: oklch(0.972 0.006 277);
    --kt-surface: #ffffff;
    --kt-surface-2: oklch(0.964 0.009 277);
    --kt-surface-3: oklch(0.938 0.012 277);

    /* --- Çizgiler ------------------------------------------------------ */
    --kt-line: oklch(0.905 0.011 277);
    --kt-line-soft: oklch(0.940 0.008 277);
    --kt-line-strong: oklch(0.628 0.022 277);

    /* --- Metin (hepsi beyaz ve --kt-bg üzerinde ≥4.5:1) ----------------- */
    --kt-ink: oklch(0.235 0.030 277);
    --kt-ink-2: oklch(0.420 0.026 277);
    --kt-muted: oklch(0.520 0.022 277);
    --kt-on-brand: #ffffff;

    /* --- Marka (logodan örneklendi: #2C2A86) ---------------------------- */
    --kt-brand: oklch(0.3525 0.1486 276.5);
    --kt-brand-800: oklch(0.295 0.130 276.5);
    --kt-brand-600: oklch(0.430 0.170 276.5);
    --kt-brand-100: oklch(0.905 0.045 277);
    --kt-brand-050: oklch(0.958 0.018 277);

    /* --- Semantik durumlar --------------------------------------------- */
    --kt-success: oklch(0.520 0.110 155);
    --kt-success-bg: oklch(0.955 0.030 155);
    --kt-warning: oklch(0.515 0.105 70);
    --kt-warning-bg: oklch(0.960 0.032 80);
    --kt-danger: oklch(0.520 0.190 25);
    --kt-danger-bg: oklch(0.955 0.022 25);
    --kt-info: var(--kt-brand);
    --kt-info-bg: var(--kt-brand-050);

    /* --- Tipografi ------------------------------------------------------ */
    --kt-font: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif;

    /* Sabit rem ölçeği — ürün arayüzünde akışkan başlık istemiyoruz.
       Oran ~1.15; veri yoğun ekranda abartılı kontrast gürültü yaratır. */
    --kt-fs-xs: 0.75rem;    /* 12px — etiket, dipnot */
    --kt-fs-sm: 0.8125rem;  /* 13px — ikincil */
    --kt-fs-base: 0.9375rem;/* 15px — gövde */
    --kt-fs-md: 1.0625rem;  /* 17px — vurgulu gövde */
    --kt-fs-lg: 1.25rem;    /* 20px — h3 */
    --kt-fs-xl: 1.5rem;     /* 24px — h2 */
    --kt-fs-2xl: 1.875rem;  /* 30px — h1 */

    /* --- Uzay ölçeği ---------------------------------------------------- */
    --kt-s1: 0.25rem;
    --kt-s2: 0.5rem;
    --kt-s3: 0.75rem;
    --kt-s4: 1rem;
    --kt-s5: 1.5rem;
    --kt-s6: 2rem;
    --kt-s7: 3rem;
    --kt-s8: 4rem;

    /* --- Köşe yarıçapı --------------------------------------------------- */
    --kt-r-sm: 6px;
    --kt-r: 10px;
    --kt-r-lg: 14px;
    --kt-r-pill: 999px;

    /* --- Gölge (indigo tonlu, nötr gri değil) --------------------------- */
    --kt-shadow-sm: 0 1px 2px oklch(0.235 0.030 277 / 0.06);
    --kt-shadow: 0 1px 2px oklch(0.235 0.030 277 / 0.05),
                 0 4px 12px oklch(0.235 0.030 277 / 0.05);
    --kt-shadow-lg: 0 2px 4px oklch(0.235 0.030 277 / 0.05),
                    0 12px 32px oklch(0.235 0.030 277 / 0.09);

    /* --- Hareket -------------------------------------------------------- */
    --kt-ease: cubic-bezier(0.22, 1, 0.36, 1); /* ease-out-quint */
    --kt-dur-1: 120ms;
    --kt-dur-2: 180ms;
    --kt-dur-3: 240ms;

    /* --- z ölçeği (anlamsal, keyfi 9999 yok) ---------------------------- */
    --kt-z-base: 1;
    --kt-z-sticky: 100;
    --kt-z-dropdown: 200;
    --kt-z-backdrop: 300;
    --kt-z-modal: 400;
    --kt-z-toast: 500;

    /* --- Bootstrap/Metronic köprüsü ------------------------------------ */
    --bs-font-sans-serif: var(--kt-font);
    --bs-body-font-family: var(--kt-font);
    --bs-body-font-size: var(--kt-fs-base);
    --bs-body-color: var(--kt-ink);
    --bs-body-bg: var(--kt-bg);
    --bs-primary: #2c2a86;
    --bs-primary-rgb: 44, 42, 134;
    --bs-link-color: #2c2a86;
    --bs-border-color: oklch(0.905 0.011 277);
}

/* =========================================================================
   Temel
   ========================================================================= */

*,
*::before,
*::after { box-sizing: border-box; }

/* Metronic kökü `font-size:13px!important` ile sabitliyor. Bu hem bütün rem
   ölçeğimizi %19 küçültüyor hem de kullanıcının tarayıcı yazı boyutu tercihini
   yok sayıyor. Kökü tarayıcı varsayılanına geri veriyoruz. */
html {
    font-size: 100% !important;
    -webkit-text-size-adjust: 100%;
}

body,
body#kt_body {
    font-family: var(--kt-font);
    /* Metronic `body,html{font-size:13px!important}` diyor ve dar ekranda
       12px'e düşürüyor. Gövde ölçeği bizde. */
    font-size: var(--kt-fs-base) !important;
    line-height: 1.55;
    color: var(--kt-ink);
    background-color: var(--kt-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "cv05" 1, "ss01" 1; /* Inter: tek katlı l, düz a */
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--kt-font);
    color: var(--kt-ink);
    letter-spacing: -0.015em;
    line-height: 1.25;
    text-wrap: balance;
    margin-top: 0;
}

h1, .h1 { font-size: var(--kt-fs-2xl); font-weight: 700; letter-spacing: -0.022em; }
h2, .h2 { font-size: var(--kt-fs-xl);  font-weight: 700; }
h3, .h3 { font-size: var(--kt-fs-lg);  font-weight: 650; }
h4, .h4 { font-size: var(--kt-fs-md);  font-weight: 650; }
h5, .h5 { font-size: var(--kt-fs-base);font-weight: 650; }

p { text-wrap: pretty; }

a {
    color: var(--kt-brand);
    text-decoration: none;
    transition: color var(--kt-dur-1) var(--kt-ease);
}

a:hover { color: var(--kt-brand-600); }

/* Klavye odağı: her yerde, tek dil. */
:where(a, button, input, select, textarea, [tabindex], .btn, .menu-link):focus-visible {
    outline: 2px solid var(--kt-brand-600);
    outline-offset: 2px;
    border-radius: var(--kt-r-sm);
}

/* Metronic bazı yerlerde odak halkasını kapatıyor — geri açıyoruz. */
.btn:focus-visible,
.menu-link:focus-visible,
.form-control:focus-visible {
    outline: 2px solid var(--kt-brand-600) !important;
    outline-offset: 2px;
}

::selection {
    background: var(--kt-brand-100);
    color: var(--kt-ink);
}

/* Rakamlar her yerde hizalı. Fiyat okumanın temeli bu. */
.kt-num,
td.kt-num,
.kt-price,
time,
.kt-tabular {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1, "cv05" 1;
}

/* Yalnızca ekran okuyucular için */
.kt-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* İçeriğe atla — klavye kullanıcısı için ilk durak */
.kt-skip-link {
    position: absolute;
    left: var(--kt-s4);
    top: calc(-1 * var(--kt-s8));
    z-index: var(--kt-z-toast);
    padding: var(--kt-s2) var(--kt-s4);
    background: var(--kt-brand);
    color: var(--kt-on-brand);
    border-radius: 0 0 var(--kt-r) var(--kt-r);
    font-size: var(--kt-fs-sm);
    font-weight: 600;
    transition: top var(--kt-dur-2) var(--kt-ease);
}

.kt-skip-link:focus {
    top: 0;
    color: var(--kt-on-brand);
}

.kt-container {
    width: 100%;
    max-width: 1120px;
    margin-inline: auto;
    padding-inline: var(--kt-s4);
}

@media (min-width: 768px) {
    .kt-container { padding-inline: var(--kt-s5); }
}

/* =========================================================================
   Butonlar — Metronic ezmesi
   ========================================================================= */

.btn {
    --btn-bg: var(--kt-surface);
    --btn-fg: var(--kt-ink);
    --btn-bd: var(--kt-line);
    font-family: var(--kt-font);
    font-size: var(--kt-fs-base);
    font-weight: 600;
    letter-spacing: -0.005em;
    border-radius: var(--kt-r);
    padding: 0.625rem 1.125rem;
    min-height: 44px; /* dokunma hedefi */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--kt-s2);
    border: 1px solid var(--btn-bd);
    color: var(--btn-fg);
    background-color: var(--btn-bg);
    box-shadow: var(--kt-shadow-sm);
    transition: background-color var(--kt-dur-1) var(--kt-ease),
                border-color var(--kt-dur-1) var(--kt-ease),
                color var(--kt-dur-1) var(--kt-ease),
                box-shadow var(--kt-dur-1) var(--kt-ease);
}

.btn:active { transform: none; }

.btn.btn-sm {
    font-size: var(--kt-fs-sm);
    padding: 0.375rem 0.75rem;
    min-height: 34px;
    border-radius: var(--kt-r-sm);
}

.btn.btn-lg {
    font-size: var(--kt-fs-md);
    padding: 0.8125rem 1.5rem;
    min-height: 50px;
}

/* Birincil */
.btn.btn-primary,
.btn.btn-primary:not(:disabled):not(.disabled) {
    --btn-bg: var(--kt-brand);
    --btn-fg: var(--kt-on-brand);
    --btn-bd: var(--kt-brand);
    background-color: var(--kt-brand) !important;
    border-color: var(--kt-brand);
    color: var(--kt-on-brand);
}

.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:not(:disabled):not(.disabled):hover,
.btn.btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--kt-brand-800) !important;
    border-color: var(--kt-brand-800);
    color: var(--kt-on-brand);
    box-shadow: var(--kt-shadow);
}

/* İkincil / nötr */
.btn.btn-secondary,
.btn.btn-light,
.btn.btn-light-primary {
    --btn-bg: var(--kt-surface);
    --btn-fg: var(--kt-ink);
    --btn-bd: var(--kt-line);
    background-color: var(--kt-surface);
    border-color: var(--kt-line);
    color: var(--kt-ink);
}

.btn.btn-secondary:hover,
.btn.btn-light:hover,
.btn.btn-light-primary:hover {
    background-color: var(--kt-surface-2);
    border-color: var(--kt-line-strong);
    color: var(--kt-ink);
}

.btn.btn-light-primary { color: var(--kt-brand); }
.btn.btn-light-primary:hover { color: var(--kt-brand-800); background-color: var(--kt-brand-050); border-color: var(--kt-brand-100); }

/* Semantik */
.btn.btn-success { background-color: var(--kt-success) !important; border-color: var(--kt-success); color: #fff; }
.btn.btn-success:hover { filter: brightness(0.92); color: #fff; }

.btn.btn-danger { background-color: var(--kt-danger) !important; border-color: var(--kt-danger); color: #fff; }
.btn.btn-danger:hover { filter: brightness(0.92); color: #fff; }

.btn.btn-info { background-color: var(--kt-brand-600) !important; border-color: var(--kt-brand-600); color: #fff; }
.btn.btn-info:hover { background-color: var(--kt-brand) !important; border-color: var(--kt-brand); color: #fff; }

.btn.btn-warning { background-color: var(--kt-warning) !important; border-color: var(--kt-warning); color: #fff; }
.btn.btn-warning:hover { filter: brightness(0.92); color: #fff; }

/* Devre dışı ve yükleniyor — her bileşenin tam durum seti olmalı */
.btn:disabled,
.btn.disabled,
.btn[disabled] {
    opacity: 1;
    background-color: var(--kt-surface-3) !important;
    border-color: var(--kt-line) !important;
    color: var(--kt-muted) !important;
    box-shadow: none;
    cursor: not-allowed;
}

.btn[data-kt-busy="true"] { position: relative; color: transparent !important; }

.btn[data-kt-busy="true"]::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 1rem; height: 1rem;
    margin: -0.5rem 0 0 -0.5rem;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    color: var(--kt-on-brand);
    animation: kt-spin 700ms linear infinite;
}

@keyframes kt-spin { to { transform: rotate(360deg); } }

/* =========================================================================
   Form kontrolleri
   ========================================================================= */

.form-label,
label.form-label {
    font-size: var(--kt-fs-sm);
    font-weight: 600;
    color: var(--kt-ink-2);
    margin-bottom: var(--kt-s2);
    letter-spacing: -0.005em;
}

.form-label.required::after,
label.required::after {
    content: "*";
    color: var(--kt-danger);
    margin-inline-start: 0.25rem;
    font-weight: 700;
}

.form-control,
.form-select,
.form-control.form-control-solid,
.form-control.form-control-lg {
    font-family: var(--kt-font);
    font-size: var(--kt-fs-base);
    font-weight: 450;
    line-height: 1.5;
    color: var(--kt-ink);
    background-color: var(--kt-surface);
    /* 3:1 non-text kontrast — kontrolün sınırı görülebilir olmalı */
    border: 1px solid var(--kt-line-strong);
    border-radius: var(--kt-r);
    padding: 0.6875rem 0.875rem;
    min-height: 46px;
    box-shadow: none;
    transition: border-color var(--kt-dur-1) var(--kt-ease),
                box-shadow var(--kt-dur-1) var(--kt-ease),
                background-color var(--kt-dur-1) var(--kt-ease);
}

.form-control:hover:not(:disabled):not(:focus),
.form-select:hover:not(:disabled):not(:focus) {
    border-color: var(--kt-ink-2);
}

.form-control:focus,
.form-select:focus,
.form-control.form-control-solid:focus {
    color: var(--kt-ink);
    background-color: var(--kt-surface);
    border-color: var(--kt-brand-600);
    box-shadow: 0 0 0 3px oklch(0.430 0.170 276.5 / 0.16) !important;
    outline: none !important;
}

/* Placeholder da 4.5:1 olmalı — açık gri varsayılan burada geçmez.
   Metronic `.form-control.form-control-solid::placeholder{color:#a1a5b7}`
   diyor (beyaz üzerinde 2.45:1); aynı özgüllükle karşılıyoruz. */
/* DİKKAT: satıcı öneki taşıyan bir pseudo-element'i aynı seçici grubuna
   koymak, tarayıcı onu tanımadığında kuralın TAMAMINI düşürür. Ayrı yazılır. */
.form-control::placeholder,
.form-select::placeholder,
.form-control.form-control-solid::placeholder {
    color: var(--kt-muted);
    opacity: 1;
}

.form-control::-moz-placeholder,
.form-control.form-control-solid::-moz-placeholder {
    color: var(--kt-muted);
    opacity: 1;
}

/* Metronic'in "solid" girdi varyantı kenarlığı zemine eşitleyip kontrolü
   görünmez kılıyor. Tek bir girdi dili kullanıyoruz. */
.form-control.form-control-solid {
    background-color: var(--kt-surface);
    border-color: var(--kt-line-strong);
    color: var(--kt-ink);
}

.form-control.form-control-solid:focus {
    background-color: var(--kt-surface);
    border-color: var(--kt-brand-600);
    color: var(--kt-ink);
}

.form-control:disabled,
.form-control[readonly] {
    background-color: var(--kt-surface-2);
    color: var(--kt-muted);
    border-color: var(--kt-line);
    cursor: not-allowed;
}

.form-control.input-validation-error,
.form-control.is-invalid,
.form-control[aria-invalid="true"] {
    border-color: var(--kt-danger);
}

.form-control.input-validation-error:focus,
.form-control.is-invalid:focus {
    box-shadow: 0 0 0 3px oklch(0.520 0.190 25 / 0.18) !important;
}

.field-validation-error,
.text-danger,
.validation-summary-errors {
    color: var(--kt-danger) !important;
    font-size: var(--kt-fs-sm);
    font-weight: 500;
}

.field-validation-error { display: block; margin-top: var(--kt-s2); }

.validation-summary-errors ul {
    margin: 0;
    padding-inline-start: 1.1rem;
    text-align: start;
}

/* Girdi içi eylem düğmesi (şifre göster/gizle, kopyala).
   Hem müşteri hem yönetim kabuğunda kullanılıyor. */
.kt-input-wrap { position: relative; }

.kt-input-wrap .form-control { padding-inline-end: 2.875rem; }

.kt-input-wrap--wide .form-control { padding-inline-end: 6.5rem; }

.kt-input-action,
.kt-reveal {
    position: absolute;
    inset-block: 1px;
    inset-inline-end: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    min-width: 2.75rem;
    padding-inline: 0.625rem;
    border: 0;
    background: transparent;
    color: var(--kt-muted);
    font-family: var(--kt-font);
    font-size: var(--kt-fs-sm);
    font-weight: 600;
    border-radius: 0 var(--kt-r) var(--kt-r) 0;
    cursor: pointer;
    transition: color var(--kt-dur-1) var(--kt-ease),
                background-color var(--kt-dur-1) var(--kt-ease);
}

.kt-input-action:hover,
.kt-reveal:hover { color: var(--kt-ink); background: var(--kt-surface-2); }

.kt-input-action:focus-visible,
.kt-reveal:focus-visible {
    outline: 2px solid var(--kt-brand-600);
    outline-offset: -2px;
}

/* Kopyalama onayı — durum bildiren tek işaret */
.kt-input-action[data-kt-copied="true"] { color: var(--kt-success); }

/* Şifre göster/gizle simgesi tek kaynaktan sürülür: düğmenin basılı durumu.
   JavaScript yalnızca aria-pressed'i çevirir. */
.kt-reveal [data-kt-reveal-on],
.kt-reveal [data-kt-reveal-off] { display: none; }

.kt-reveal[aria-pressed="false"] [data-kt-reveal-on],
.kt-reveal[aria-pressed="true"] [data-kt-reveal-off] { display: block; }

/* Onay kutusu */
.form-check-input {
    width: 1.15rem;
    height: 1.15rem;
    margin-top: 0.15rem;
    border: 1px solid var(--kt-line-strong);
    border-radius: 5px;
    background-color: var(--kt-surface);
    transition: background-color var(--kt-dur-1) var(--kt-ease),
                border-color var(--kt-dur-1) var(--kt-ease);
}

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

.form-check-input:focus-visible {
    outline: 2px solid var(--kt-brand-600);
    outline-offset: 2px;
}

.form-check-label,
.form-check .form-check-label {
    font-size: var(--kt-fs-base);
    color: var(--kt-ink-2);
}

/* =========================================================================
   Kart
   ========================================================================= */

.card {
    background-color: var(--kt-surface);
    border: 1px solid var(--kt-line);
    border-radius: var(--kt-r-lg);
    box-shadow: var(--kt-shadow-sm);
}

.card .card-header {
    border-bottom: 1px solid var(--kt-line);
    padding: var(--kt-s4) var(--kt-s5);
    min-height: 0;
    align-items: center;
}

.card .card-header .card-title { margin: 0; }

.card .card-header .card-title h1,
.card .card-header .card-title h2,
.card .card-header .card-title h3 {
    font-size: var(--kt-fs-lg);
    font-weight: 650;
    margin: 0;
}

.card .card-body { padding: var(--kt-s5); }

.card .card-footer {
    border-top: 1px solid var(--kt-line);
    padding: var(--kt-s4) var(--kt-s5);
    background: transparent;
}

/* İç içe kart her zaman yanlış — şablondan sızarsa düzleştir. */
.card .card { border: 0; box-shadow: none; background: transparent; }
.card .card > .card-body { padding: 0; }

/* =========================================================================
   Tablo
   Yönetim panelindeki tablolar Metronic'in kendi görünümünü kullanır
   (table-row-dashed + gs-0 gy-4). Buradaki ezmeler kaldırıldı; yalnızca
   gövde tipografisi (font ailesi/boyutu) ortak sistemden gelir.
   Müşteri tarafındaki fiyat tablosu ayrı bir bileşendir: .kt-prices
   (bkz. kaytas-public.css).
   ========================================================================= */

/* =========================================================================
   Rozet / durum çipi
   ========================================================================= */

.kt-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.1875rem 0.625rem;
    border-radius: var(--kt-r-pill);
    font-size: var(--kt-fs-xs);
    font-weight: 650;
    line-height: 1.5;
    letter-spacing: -0.005em;
    white-space: nowrap;
    border: 1px solid transparent;
}

.kt-chip::before {
    content: "";
    width: 6px; height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex: none;
}

.kt-chip--live    { color: var(--kt-success); background: var(--kt-success-bg); border-color: oklch(0.520 0.110 155 / 0.25); }
.kt-chip--past    { color: var(--kt-muted);   background: var(--kt-surface-2);  border-color: var(--kt-line); }
.kt-chip--brand   { color: var(--kt-brand);   background: var(--kt-brand-050);  border-color: var(--kt-brand-100); }

.badge {
    font-family: var(--kt-font);
    font-weight: 650;
    font-size: var(--kt-fs-xs);
    border-radius: var(--kt-r-pill);
    padding: 0.25rem 0.625rem;
}

.badge.badge-light-success { color: var(--kt-success); background: var(--kt-success-bg); }
.badge.badge-light-primary { color: var(--kt-brand);   background: var(--kt-brand-050); }
.badge.badge-light-danger  { color: var(--kt-danger);  background: var(--kt-danger-bg); }

/* =========================================================================
   Uyarı kutuları
   ========================================================================= */

.alert {
    display: flex;
    align-items: flex-start;
    gap: var(--kt-s3);
    padding: var(--kt-s3) var(--kt-s4);
    border-radius: var(--kt-r);
    border: 1px solid;
    font-size: var(--kt-fs-base);
    font-weight: 500;
    box-shadow: none;
}

.alert .kt-alert-icon { flex: none; margin-top: 1px; }
.alert .kt-alert-body { flex: 1; min-width: 0; }

.alert-success, .alert.alert-success { color: var(--kt-success); background: var(--kt-success-bg); border-color: oklch(0.520 0.110 155 / 0.28); }
.alert-danger,  .alert.alert-danger  { color: var(--kt-danger);  background: var(--kt-danger-bg);  border-color: oklch(0.520 0.190 25 / 0.28); }
.alert-warning, .alert.alert-warning { color: var(--kt-warning); background: var(--kt-warning-bg); border-color: oklch(0.515 0.105 70 / 0.30); }
.alert-info,    .alert.alert-info,
.alert-primary, .alert.alert-primary { color: var(--kt-brand);   background: var(--kt-brand-050);  border-color: var(--kt-brand-100); }

/* Metronic bu sınıfları metni beyaza zorlamak için kullanıyor — geri al. */
.alert .text-light,
.alert .svg-icon-light { color: inherit !important; }
.alert .svg-icon svg [fill]:not(.permanent):not(g) { fill: currentColor; }

.alert .btn-close { margin-inline-start: auto; }

/* =========================================================================
   Boş durum — "burada bir şey yok" değil, arayüzü öğreten
   ========================================================================= */

.kt-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--kt-s2);
    padding: var(--kt-s7) var(--kt-s4);
    color: var(--kt-ink-2);
}

.kt-empty__icon {
    width: 44px; height: 44px;
    display: grid;
    place-items: center;
    border-radius: var(--kt-r);
    background: var(--kt-surface-2);
    color: var(--kt-muted);
    margin-bottom: var(--kt-s2);
}

.kt-empty__title {
    font-size: var(--kt-fs-md);
    font-weight: 650;
    color: var(--kt-ink);
    margin: 0;
}

.kt-empty__text {
    font-size: var(--kt-fs-base);
    color: var(--kt-ink-2);
    margin: 0;
    max-width: 46ch;
}

/* =========================================================================
   Modal
   ========================================================================= */

.modal-content {
    border: 1px solid var(--kt-line);
    border-radius: var(--kt-r-lg);
    box-shadow: var(--kt-shadow-lg);
}

.modal-header {
    border-bottom: 1px solid var(--kt-line);
    padding: var(--kt-s4) var(--kt-s5);
}

.modal-title { font-size: var(--kt-fs-md); font-weight: 650; }
.modal-body { padding: var(--kt-s5); font-size: var(--kt-fs-base); }
.modal-footer { border-top: 1px solid var(--kt-line); padding: var(--kt-s4) var(--kt-s5); }

/* =========================================================================
   DataTables — Metronic + jquery.dataTables.css üzerine
   ========================================================================= */

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    font-size: var(--kt-fs-sm);
    color: var(--kt-ink-2);
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    font-family: var(--kt-font);
    font-size: var(--kt-fs-sm);
    color: var(--kt-ink);
    background: var(--kt-surface);
    border: 1px solid var(--kt-line-strong);
    border-radius: var(--kt-r-sm);
    padding: 0.4375rem 0.625rem;
    min-height: 38px;
    margin-inline-start: var(--kt-s2);
    transition: border-color var(--kt-dur-1) var(--kt-ease),
                box-shadow var(--kt-dur-1) var(--kt-ease);
}

.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--kt-brand-600);
    box-shadow: 0 0 0 3px oklch(0.430 0.170 276.5 / 0.16);
    outline: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    border: 1px solid var(--kt-line) !important;
    border-radius: var(--kt-r-sm) !important;
    background: var(--kt-surface) !important;
    color: var(--kt-ink-2) !important;
    padding: 0.375rem 0.75rem !important;
    margin-inline-start: var(--kt-s1);
    min-width: 36px;
    text-align: center;
    transition: background-color var(--kt-dur-1) var(--kt-ease),
                border-color var(--kt-dur-1) var(--kt-ease),
                color var(--kt-dur-1) var(--kt-ease);
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled) {
    background: var(--kt-surface-2) !important;
    border-color: var(--kt-line-strong) !important;
    color: var(--kt-ink) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--kt-brand) !important;
    border-color: var(--kt-brand) !important;
    color: var(--kt-on-brand) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: var(--kt-surface-2) !important;
    color: var(--kt-muted) !important;
    border-color: var(--kt-line) !important;
    cursor: not-allowed;
}

table.dataTable thead th.sorting,
table.dataTable thead th.sorting_asc,
table.dataTable thead th.sorting_desc { cursor: pointer; }

table.dataTable thead th.sorting:focus-visible {
    outline: 2px solid var(--kt-brand-600);
    outline-offset: -2px;
}

/* =========================================================================
   Yukarı çık
   ========================================================================= */

.scrolltop {
    background-color: var(--kt-brand) !important;
    border-radius: var(--kt-r) !important;
    box-shadow: var(--kt-shadow-lg) !important;
    width: 42px; height: 42px;
    z-index: var(--kt-z-sticky);
}

.scrolltop .svg-icon svg [fill]:not(.permanent):not(g) { fill: #fff; }

/* =========================================================================
   Yardımcılar
   ========================================================================= */

.text-primary { color: var(--kt-brand) !important; }
.text-muted { color: var(--kt-muted) !important; }
.text-gray-400, .text-gray-500, .text-gray-600 { color: var(--kt-muted) !important; }
.text-gray-700, .text-gray-800, .text-gray-900, .text-dark { color: var(--kt-ink) !important; }
.link-primary { color: var(--kt-brand) !important; font-weight: 600; }
.link-primary:hover { color: var(--kt-brand-800) !important; }
.separator { border-bottom: 1px solid var(--kt-line); }

/* =========================================================================
   Hareket tercihi
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .btn[data-kt-busy="true"]::after {
        animation: none;
        border-top-color: currentColor;
        opacity: 0.6;
    }
}