/* LogoSurec — modern kabuk: treeview menü + drawer + marka + dashboard (ERP Standardı "al benisi" katmanı).
   site.css'ten SONRA yüklenir; mevcut --ls-accent kmp dilini zenginleştirir. */
:root {
    --ls-sidebar-w: 256px;
    --ls-ease: cubic-bezier(.4, 0, .2, 1);
    --ls-trans: .26s var(--ls-ease);
    /* Radius ölçeği (sm/md/lg/pill) — --ls-radius = md ile eş (geriye dönük uyum) */
    --ls-radius-sm: .375rem;
    --ls-radius-md: .625rem;
    --ls-radius-lg: .875rem;
    --ls-radius-pill: 999px;
    --ls-radius: var(--ls-radius-md);
    --ls-accent-soft: color-mix(in srgb, var(--ls-accent) 12%, transparent);
    /* Katmanlı gölge ölçeği (xs–xl) — tutarlı 2-katmanlı; sayfa yüzeyleri token'a bağlanır */
    --ls-shadow-xs: 0 1px 1px rgba(16, 24, 40, .04), 0 1px 2px rgba(16, 24, 40, .06);
    --ls-shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .10);
    --ls-shadow-md: 0 4px 12px rgba(16, 24, 40, .10), 0 2px 6px rgba(16, 24, 40, .06);
    --ls-shadow-lg: 0 12px 28px rgba(16, 24, 40, .14), 0 4px 10px rgba(16, 24, 40, .08);
    --ls-shadow-xl: 0 24px 56px rgba(16, 24, 40, .20), 0 8px 18px rgba(16, 24, 40, .12);
    --ls-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    /* ERP Standardı: marka mavisini Bootstrap'a bağla → --bs-* bileşenleri (text/bg/link/border/badge) markaya miras alır.
       shell.css CDN'den SONRA yüklenir → override kazanır. (.btn/.form-focus için ayrıca aşağıda bileşen değişkeni ezilir.) */
    --bs-primary: var(--ls-accent);
    --bs-primary-rgb: var(--ls-accent-rgb);
    --bs-link-color: var(--ls-accent);
    --bs-link-color-rgb: var(--ls-accent-rgb);
    --bs-link-hover-color: color-mix(in srgb, var(--ls-accent) 80%, #000);
    --bs-primary-bg-subtle: color-mix(in srgb, var(--ls-accent) 12%, var(--bs-body-bg));
    --bs-primary-border-subtle: color-mix(in srgb, var(--ls-accent) 32%, var(--bs-body-bg));
    --bs-primary-text-emphasis: color-mix(in srgb, var(--ls-accent) 72%, #000);
    --bs-code-color: var(--bs-secondary-color); /* kod metni cırtlak crimson yerine sakin ikincil renk */
}

/* ERP Standardı — dark tema: marka mavisinin açık karşılığı (koyu zeminde kontrast) + saf-siyah düşük-yayılım gölge */
[data-bs-theme="dark"] {
    --ls-accent: #4f8fe0;
    --ls-accent-rgb: 79, 143, 224;
    --ls-accent-soft: color-mix(in srgb, var(--ls-accent) 22%, transparent);
    /* Dark: saf-siyah, düşük-yayılım gölge varyantları (derin nötr zeminde okunur) */
    --ls-shadow-xs: 0 1px 1px rgba(0, 0, 0, .34), 0 1px 2px rgba(0, 0, 0, .28);
    --ls-shadow-sm: 0 1px 2px rgba(0, 0, 0, .38), 0 1px 3px rgba(0, 0, 0, .30);
    --ls-shadow-md: 0 6px 16px rgba(0, 0, 0, .46), 0 2px 6px rgba(0, 0, 0, .34);
    --ls-shadow-lg: 0 14px 30px rgba(0, 0, 0, .52), 0 5px 12px rgba(0, 0, 0, .40);
    --ls-shadow-xl: 0 26px 56px rgba(0, 0, 0, .58), 0 10px 22px rgba(0, 0, 0, .46);
    --bs-primary-text-emphasis: color-mix(in srgb, var(--ls-accent) 72%, #fff);
}

/* Bootstrap bileşen renkleri derlemede literal → bileşen değişkenlerini markaya ez (buton/form-focus/checkbox) */
.btn-primary {
    --bs-btn-bg: var(--ls-accent);
    --bs-btn-border-color: var(--ls-accent);
    --bs-btn-hover-bg: color-mix(in srgb, var(--ls-accent) 88%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--ls-accent) 84%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--ls-accent) 80%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ls-accent) 76%, #000);
    --bs-btn-disabled-bg: var(--ls-accent);
    --bs-btn-disabled-border-color: var(--ls-accent);
}
.btn-outline-primary {
    --bs-btn-color: var(--ls-accent);
    --bs-btn-border-color: var(--ls-accent);
    --bs-btn-hover-bg: var(--ls-accent);
    --bs-btn-hover-border-color: var(--ls-accent);
    --bs-btn-active-bg: var(--ls-accent);
    --bs-btn-active-border-color: var(--ls-accent);
}
.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: color-mix(in srgb, var(--ls-accent) 55%, var(--bs-border-color));
    box-shadow: 0 0 0 .2rem var(--ls-accent-soft);
}
.form-check-input:checked { background-color: var(--ls-accent); border-color: var(--ls-accent); }

/* Klavye-dışı focus'ta UA outline gizli; klavye focus'ta tutarlı accent halkası (CLAUDE.md kuralı) */
:focus:not(:focus-visible) { outline: none; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--ls-accent-soft);
    border-radius: var(--ls-radius);
}

body {
    font-family: var(--ls-font);
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "cv02", "cv03", "cv04", "tnum";
}
h1, h2, h3, h4, h5, h6, .fw-bold, .fw-semibold { letter-spacing: -.012em; }
h1, h2, h3, h4, h5, h6 { font-weight: 600; }

/* ---- Topbar ---- */
.ls-topbar {
    position: sticky; top: 0; z-index: 1040;
    background: color-mix(in srgb, var(--bs-body-bg) 86%, transparent);
    backdrop-filter: saturate(1.4) blur(10px);
    border-bottom: 1px solid var(--bs-border-color);
    box-shadow: var(--ls-shadow-sm);
}
.ls-iconbtn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border: 1px solid transparent; border-radius: var(--ls-radius);
    background: transparent; color: var(--bs-secondary-color); font-size: 1.15rem;
    transition: background var(--ls-trans), color var(--ls-trans), border-color var(--ls-trans);
}
.ls-iconbtn:hover { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
.ls-iconbtn:focus-visible { outline: none; border-color: var(--ls-accent); box-shadow: 0 0 0 3px var(--ls-accent-soft); }
.ls-brand { color: var(--ls-accent); }
.ls-logo {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: var(--ls-radius-md); font-size: 1rem; color: #fff;
    background: linear-gradient(135deg, var(--ls-accent), color-mix(in srgb, var(--ls-accent) 55%, #2bb0ff));
    box-shadow: 0 2px 8px var(--ls-accent-soft);
}
.ls-brand-text { font-size: 1.08rem; letter-spacing: -.01em; }
@media (max-width: 575.98px) { .ls-brand-text { display: none; } }

/* ---- Body / main / push (dock-fill + footer-en-altta) ---- */
/* Kabuk dikey flex sütun → topbar (sabit) + body (flex:1) + (footer body içinde, en altta).
   Düz var(--bs-body-bg): içerik sayfalarında ASLA giriş ekranı filigranı/glow'u olmaz (yalnız .ls-login). */
.ls-shell { display: flex; flex-direction: column; min-height: 100vh; background: var(--bs-body-bg); }
/* Body, kalan dikey alanı doldurur (flex:1) → içerik kısa olsa bile footer dibe yapışır. */
.ls-body { position: relative; flex: 1 1 auto; min-height: 0; }
/* İçerik kabı: responsive yatay nefes; dikey flex sütun → içerik footer'a kadar uzar (dock-fill). */
.ls-main {
    min-width: 0; transition: margin-left var(--ls-trans);
    padding: clamp(.85rem, 2vw, 1.5rem);
    display: flex; flex-direction: column; min-height: 0;
}
/* @Body sarmalayıcısı: kalan alanı doldurur → footer'ı dibe iter (dock-fill). */
.ls-content { flex: 1 1 auto; min-height: 0; }
/* Okunur max-width (uzun ekranlarda ortalı) — eskiden .ls-main > *; artık @Body .ls-content içinde. */
.ls-content > * { max-width: 1600px; margin-inline: auto; }
/* ⚠ position:fixed overlay'leri (modal scrim/backdrop) max-width'ten MUAF (ayrı reset, (0,2,0) → broad kuralı yener
   AMA .ls-designer/.ls-dock-fill (0,2,0) override'larını BOZMAZ; eski :not() (0,3,0) onları eziyordu → regresyon).
   Aksi halde >1600px ekranda scrim büzülüp kayar → karartma tüm ekranı kaplamaz + modal sürükleme sola takılır. */
.ls-content > .kmp-modal-scrim, .ls-content > .kmp-modal-backdrop { max-width: none; margin-inline: 0; }
.ls-content > .ls-designer { max-width: none; } /* tasarımcılar (form/süreç) tam genişlik kullanır */
/* Tek-kök tam-yükseklik içerik (tasarımcı/dock-fill sayfa) → .ls-content'i de flex sütun yap ki çocuk dolabilsin. */
.ls-content:has(> .ls-designer),
.ls-content:has(> .ls-dock-fill) { display: flex; flex-direction: column; }
.ls-content > .ls-designer,
.ls-content > .ls-dock-fill { flex: 1 1 auto; min-height: 0; max-width: none; margin-inline: 0; }
/* ↑ margin-inline:0 KRİTİK: .ls-content flex-sütun olunca üstteki "margin-inline:auto" tasarımcıyı
   içerik-genişliğine büzüp ortalıyordu (v0.16.0 regresyonu). 0 → tam genişlik stretch + dock-fill. */
/* Footer daima en altta (içerik flex:1 ile yukarı itildiğinden); kendi yüksekliğini korur. */
.ls-footer { flex: 0 0 auto; max-width: 1600px; margin-inline: auto; width: 100%; }
/* Dar formlar için opt-in daraltma */
.ls-narrow { max-width: 760px; }

/* ---- Sidebar ---- */
.ls-sidebar {
    width: var(--ls-sidebar-w); min-width: var(--ls-sidebar-w);
    align-self: stretch; padding: .6rem .55rem 2rem;
    background: var(--bs-body-bg);
    border-right: 1px solid var(--bs-border-color);
    overflow-y: auto; overflow-x: hidden;
    max-height: calc(100vh - var(--ls-topbar-h));
    position: sticky; top: var(--ls-topbar-h);
    transition: transform var(--ls-trans), margin-left var(--ls-trans), width var(--ls-trans);
    scrollbar-width: thin;
}
/* Masaüstü daraltma: kenar çubuğu dışarı kayar, içerik genişler */
html.ls-sb-collapsed .ls-sidebar { margin-left: calc(-1 * var(--ls-sidebar-w)); }

/* ---- Menü arama ---- */
.ls-nav-search { position: relative; margin: .15rem .15rem .6rem; }
.ls-nav-search i { position: absolute; left: .65rem; top: 50%; transform: translateY(-50%); color: var(--bs-secondary-color); font-size: .85rem; pointer-events: none; }
.ls-nav-search input {
    width: 100%; padding: .42rem .6rem .42rem 2rem; font-size: .85rem;
    border: 1px solid var(--bs-border-color); border-radius: var(--ls-radius);
    background: var(--bs-secondary-bg); color: var(--bs-body-color);
    transition: border-color var(--ls-trans), box-shadow var(--ls-trans), background var(--ls-trans);
}
.ls-nav-search input:focus { outline: none; background: var(--bs-body-bg); border-color: var(--ls-accent); box-shadow: 0 0 0 3px var(--ls-accent-soft); }

/* ---- Treeview gruplar ---- */
.ls-navgroup { margin-bottom: .25rem; }
.ls-navgroup > summary.ls-navhead {
    list-style: none; cursor: pointer; user-select: none;
    display: flex; align-items: center; gap: .4rem;
    padding: .26rem .5rem; margin-top: .12rem;
    font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
    color: var(--bs-secondary-color); border-radius: var(--ls-radius);
    transition: color var(--ls-trans), background var(--ls-trans);
}
.ls-navgroup > summary.ls-navhead::-webkit-details-marker { display: none; }
.ls-navgroup > summary.ls-navhead:hover { color: var(--bs-body-color); background: var(--bs-secondary-bg); }
.ls-grp-chev, .ls-sub-chev { font-size: .7rem; transition: transform var(--ls-trans); }
details[open] > summary > .ls-grp-chev, details[open] > summary > .ls-sub-chev { transform: rotate(90deg); }
.ls-navgroup-body { padding-top: 0; }

/* ---- Nav linkleri (kompakt) ---- */
.ls-navlink {
    position: relative; display: flex; align-items: center; gap: .5rem;
    padding: .36rem .55rem; margin: .07rem .1rem; border-radius: var(--ls-radius);
    color: var(--bs-body-color); text-decoration: none; font-size: .875rem; font-weight: 500; line-height: 1.3;
    transition: background var(--ls-trans), color var(--ls-trans), transform var(--ls-trans);
}
.ls-navlink > i { font-size: 1rem; width: 1.15rem; text-align: center; color: var(--bs-secondary-color); flex: 0 0 auto; transition: color var(--ls-trans); }
.ls-navlink > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ls-navlink:hover { background: var(--bs-secondary-bg); transform: translateX(2px); }
.ls-navlink:hover > i { color: var(--bs-body-color); }
.ls-navlink:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ls-accent-soft); }
.ls-navlink.active {
    background: var(--ls-accent-soft); color: var(--ls-accent); font-weight: 600;
}
.ls-navlink.active > i { color: var(--ls-accent); }
/* Aktif link hover'da KAYMAZ (accent çubuğu + dolgu zaten konumu sabitliyor; translateX zıplaması olmasın). */
.ls-navlink.active:hover { transform: none; background: color-mix(in srgb, var(--ls-accent) 16%, transparent); }
.ls-navlink.active::before {
    content: ""; position: absolute; left: -.1rem; top: 18%; bottom: 18%;
    width: 3px; border-radius: 3px; background: var(--ls-accent);
}
/* Katlanır alt-ağaç (summary = link görünümlü) */
summary.ls-navlink-sum { list-style: none; cursor: pointer; }
summary.ls-navlink-sum::-webkit-details-marker { display: none; }
summary.ls-navlink-sum .ls-sub-chev { margin-left: auto; font-size: .68rem; }
.ls-subtree-body { padding-left: .6rem; margin-left: .28rem; border-left: 1px dashed var(--bs-border-color); }
.ls-navleaf { font-size: .82rem; font-weight: 500; }
.ls-navleaf > i.bi-dot { font-size: 1.1rem; opacity: .6; }
.ls-navleaf-2 { color: var(--bs-secondary-color); }

.ls-hidden { display: none !important; }

/* ---- Scrim (mobil) ---- */
.ls-scrim { display: none; }
@media (max-width: 991.98px) {
    .ls-sidebar {
        position: fixed; top: var(--ls-topbar-h); left: 0; bottom: 0; z-index: 1050;
        max-height: none; box-shadow: var(--ls-shadow-lg);
        /* Mobil drawer üst nefes payı + yumuşak iç köşe (topbar'a yapışık durmasın). */
        padding-top: 1rem;
        border-right: 1px solid var(--bs-border-color);
        border-top-right-radius: var(--ls-radius-lg);
        transform: translateX(-100%); margin-left: 0 !important;
    }
    html.ls-sb-open .ls-sidebar { transform: translateX(0); }
    .ls-scrim {
        display: block; position: fixed; inset: var(--ls-topbar-h) 0 0 0; z-index: 1045;
        background: color-mix(in srgb, rgb(16, 24, 40) 46%, transparent);
        -webkit-backdrop-filter: blur(3px) saturate(1.05); backdrop-filter: blur(3px) saturate(1.05);
        opacity: 0; visibility: hidden; transition: opacity var(--ls-trans), visibility var(--ls-trans);
    }
    [data-bs-theme="dark"] .ls-scrim { background: color-mix(in srgb, rgb(2, 6, 14) 56%, transparent); }
    html.ls-sb-open .ls-scrim { opacity: 1; visibility: visible; }
}

/* ---- Ortak sayfa başlığı (LsPageHeader) ---- */
.ls-page-header {
    display: flex; align-items: center; gap: .8rem;
    margin-bottom: 1.25rem;
}
.ls-page-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex: 0 0 auto;
    border-radius: .75rem; font-size: 1.25rem; color: #fff;
    background: linear-gradient(135deg, var(--ls-accent), color-mix(in srgb, var(--ls-accent) 55%, #2bb0ff));
    box-shadow: 0 2px 8px var(--ls-accent-soft);
}
.ls-page-titlebox { min-width: 0; }
.ls-page-title {
    margin: 0; font-size: 1.5rem; font-weight: 700;
    letter-spacing: -.02em; line-height: 1.2; color: var(--bs-emphasis-color);
}
.ls-page-sub {
    margin: .15rem 0 0; font-size: .875rem; line-height: 1.4;
    color: var(--bs-secondary-color);
}
.ls-page-actions {
    margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
}
@media (max-width: 575.98px) {
    .ls-page-header { flex-wrap: wrap; }
    .ls-page-actions { margin-left: 0; width: 100%; }
}

/* ---- Dashboard (Ana Sayfa) ---- */
.ls-dash-hero { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.1rem; }
.ls-dash-hero .ls-logo { width: 40px; height: 40px; font-size: 1.25rem; }

/* KPI + hızlı eylem: tek kart-dili (aynı radius / yüzey / gölge) */
.ls-kpi {
    display: block;   /* anchor varyantı (a.ls-kpi-link) inline kalmasın → padding accent-strip'i temizlesin (Pano KPI desc kırpılması fix) */
    border: 1px solid var(--bs-border-color); border-radius: var(--ls-radius-lg); padding: 1rem 1.1rem;
    background: var(--bs-body-bg); box-shadow: var(--ls-shadow-sm);
    position: relative; overflow: hidden;
    transition: transform var(--ls-trans), box-shadow var(--ls-trans);
}
.ls-kpi:hover { transform: translateY(-2px); box-shadow: var(--ls-shadow-md); }
.ls-kpi::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--ls-kpi-c, var(--ls-accent)); }
.ls-kpi-ico {
    width: 40px; height: 40px; border-radius: var(--ls-radius-md); margin-bottom: .65rem;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem;
    color: var(--ls-kpi-c, var(--ls-accent));
    background: color-mix(in srgb, var(--ls-kpi-c, var(--ls-accent)) 14%, transparent);
}
.ls-kpi-val { font-size: 1.75rem; font-weight: 700; line-height: 1.05; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ls-kpi-lbl { font-size: .78rem; font-weight: 500; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); }

/* Hızlı eylem kartı — KPI ile aynı dil + tinted ikon-tile (hover'da dolar) */
.ls-quick {
    display: flex; align-items: center; gap: .7rem; padding: .85rem 1rem;
    border: 1px solid var(--bs-border-color); border-radius: var(--ls-radius-lg); background: var(--bs-body-bg);
    color: var(--bs-body-color); text-decoration: none; box-shadow: var(--ls-shadow-sm);
    transition: transform var(--ls-trans), box-shadow var(--ls-trans), border-color var(--ls-trans);
}
.ls-quick > i {
    flex: 0 0 auto; width: 40px; height: 40px; border-radius: var(--ls-radius-md); font-size: 1.2rem;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--ls-accent); background: color-mix(in srgb, var(--ls-accent) 12%, transparent);
    transition: background var(--ls-trans), color var(--ls-trans);
}
.ls-quick:hover {
    transform: translateY(-2px); box-shadow: var(--ls-shadow-md);
    border-color: color-mix(in srgb, var(--ls-accent) 30%, var(--bs-border-color));
    color: var(--bs-body-color);
}
.ls-quick:hover > i { background: var(--ls-accent); color: #fff; }
.ls-quick:focus-visible { outline: none; border-color: var(--ls-accent); box-shadow: 0 0 0 3px var(--ls-accent-soft); }

/* KPI içi zarif boş-durum (ham "—" yerine) */
.ls-kpi-empty {
    display: inline-flex; align-items: center; gap: .35rem;
    font-size: .82rem; color: var(--bs-secondary-color);
}
.ls-kpi-empty > i { font-size: .9rem; opacity: .8; }

/* Merkezi boş-durum (liste/bölüm boşsa) */
.ls-empty {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: .15rem; padding: 2.2rem 1.25rem;
    border: 1px dashed var(--bs-border-color); border-radius: var(--ls-radius-lg);
    background: var(--bs-body-bg);
}
.ls-empty-ico {
    width: 52px; height: 52px; border-radius: 50%; margin-bottom: .55rem;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem;
    color: var(--ls-empty-c, var(--ls-accent));
    background: color-mix(in srgb, var(--ls-empty-c, var(--ls-accent)) 13%, transparent);
}
.ls-empty-title { font-weight: 600; color: var(--bs-body-color); }
.ls-empty-sub { font-size: .85rem; color: var(--bs-secondary-color); }

/* Açık-görev tablo başlığı (kmpGrid uppercase head diliyle hizalı) */
.ls-tbl-head th {
    text-transform: uppercase; font-size: .72rem; font-weight: 600; letter-spacing: .04em;
    color: var(--bs-secondary-color);
    background: color-mix(in srgb, var(--bs-secondary-bg) 55%, transparent);
    border-bottom: 1px solid var(--bs-border-color);
}
/* Havuz/rol rozeti — ham emoji yerine accent-soft pill */
.ls-pool-pill {
    display: inline-flex; align-items: center; gap: .3rem;
    padding: .1rem .5rem; border-radius: var(--ls-radius-pill); font-size: .78rem;
    color: var(--ls-accent); background: var(--ls-accent-soft);
}
.ls-pool-pill > i { font-size: .82rem; }

/* Dark: kartlar gövdeden hafif aydınlanan elevated yüzey (kenarlar okunur) */
[data-bs-theme=dark] .ls-kpi,
[data-bs-theme=dark] .ls-quick,
[data-bs-theme=dark] .ls-empty {
    background: color-mix(in srgb, var(--bs-body-bg) 92%, #fff);
}

/* —— Ayarlar (Settings) —— */
/* (max-width artık .ls-main > * global kuralından geliyor) */
.ls-settings-card {
    border: 1px solid var(--bs-border-color); border-radius: var(--ls-radius-lg); overflow: hidden;
    box-shadow: var(--ls-shadow-sm); background: var(--bs-body-bg);
}
.ls-settings-head {
    display: flex; align-items: center; gap: .85rem; padding: 1.05rem 1.25rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: color-mix(in srgb, var(--ls-accent) 5%, var(--bs-body-bg));
}
.ls-settings-head h5 { font-weight: 600; letter-spacing: -.01em; }
.ls-settings-ic {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: var(--ls-radius-md);
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem;
    color: var(--ls-accent); background: color-mix(in srgb, var(--ls-accent) 14%, transparent);
}
.ls-settings-ic-admin { color: var(--bs-warning, #d97706); background: color-mix(in srgb, var(--bs-warning, #d97706) 16%, transparent); }
.ls-settings-body { padding: 1.25rem; }
.ls-settings-grp {
    font-size: .82rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
    color: var(--bs-secondary-color); margin: 1.25rem 0 .35rem;
}
.ls-settings-grp:first-child { margin-top: 0; }
.ls-settings-foot {
    display: flex; align-items: center; gap: .5rem; margin-top: 1.4rem;
    padding-top: 1.1rem; border-top: 1px dashed var(--bs-border-color);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; }
    /* Hover-lift kullanan tüm yüzeylerde transform'u sıfırla (zıplama/kayma olmasın) */
    .ls-navlink:hover, .ls-ikon-tile:hover, .ls-node:hover, .ls-canvas-item:hover,
    .ls-sablon-kart:hover, .ls-kpi:hover, .ls-quick:hover, .ls-login-submit:hover {
        transform: none !important;
    }
}

/* ---- Flat (ghost) butonlar — al benisi: sert/siyah border yok ---- */
.btn-outline-secondary, .btn-outline-primary, .btn-outline-info,
.btn-outline-dark, .btn-outline-danger, .btn-outline-success, .btn-outline-warning {
    border-color: transparent !important;
    background-color: transparent;
}
.btn-outline-success { color: var(--bs-success); }
.btn-outline-success:hover, .btn-outline-success:focus-visible { background-color: color-mix(in srgb, var(--bs-success) 14%, transparent); color: var(--bs-success); }
.btn-outline-warning { color: var(--bs-warning-text-emphasis, #997404); }
.btn-outline-warning:hover, .btn-outline-warning:focus-visible { background-color: color-mix(in srgb, var(--bs-warning) 18%, transparent); }
.btn-outline-secondary:hover, .btn-outline-secondary:focus-visible,
.btn-outline-dark:hover, .btn-outline-dark:focus-visible,
.btn-outline-info:hover, .btn-outline-info:focus-visible {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-body-color);
}
.btn-outline-primary:hover, .btn-outline-primary:focus-visible {
    background-color: var(--ls-accent-soft); color: var(--ls-accent);
}
.btn-outline-dark { color: var(--bs-body-color); }
.btn-outline-danger { color: var(--bs-danger); }
.btn-outline-danger:hover, .btn-outline-danger:focus-visible {
    background-color: color-mix(in srgb, var(--bs-danger) 14%, transparent); color: var(--bs-danger);
}
/* Kart/yüzeylerde de yumuşak: ls-quick zaten flat; genel card border'ı koru ama yumuşat */
.card { border-color: var(--bs-border-color); }

/* ── Form aksiyon çubuğu — kart altına sabit, sağa hizalı birincil aksiyon (Başlat/Kaydet) ── */
.ls-form-card { overflow: hidden; }
.ls-form-actions {
    display: flex; align-items: center; justify-content: flex-end; gap: .6rem;
    padding: .8rem 1.1rem; border-top: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
}

/* ── Uygulama footer'ı ── */
.ls-footer {
    display: flex; align-items: center; gap: .55rem; flex-wrap: wrap;
    margin-top: 2.5rem; padding: .9rem .15rem .4rem;
    border-top: 1px solid var(--bs-border-color);
    color: var(--bs-secondary-color); font-size: .8rem;
}
.ls-footer b { color: var(--bs-body-color); font-weight: 600; }
.ls-footer-muted { color: var(--bs-secondary-color); }
.ls-footer-logo { width: 22px; height: 22px; font-size: .72rem; border-radius: .5rem; }
@media print { .ls-footer { display: none; } }

/* ── Türkçe dosya seçici — native "Choose File" yerine "Dosya Seç" butonu ── */
.ls-file { position: relative; display: inline-flex; cursor: pointer; }
.ls-file > input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.ls-file__btn {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .34rem .75rem; font-size: .85rem; white-space: nowrap;
    border: 1px solid var(--bs-border-color); border-radius: var(--ls-radius-md, .55rem);
    background: var(--bs-body-bg); color: var(--bs-body-color);
    transition: background var(--ls-trans), border-color var(--ls-trans);
}
.ls-file:hover .ls-file__btn { background: var(--bs-secondary-bg); border-color: var(--ls-accent); }
/* Org ağacı: tıklanabilir düğüm (ağaç↔liste senkron — modalı açar) */
.ls-orgtree-clickable { cursor: pointer; border-radius: var(--ls-radius-sm, .375rem); transition: background var(--ls-trans); }
.ls-orgtree-clickable:hover { background: var(--ls-accent-soft); }
.ls-file > input:focus-visible + .ls-file__btn { outline: none; box-shadow: 0 0 0 3px var(--ls-accent-soft); border-color: var(--ls-accent); }