/* ============================================================
   ServisTakip Yönetim Paneli - Tema ve düzen
   Açık/koyu tema, sabit sol menü, yoğun veri tabloları.
   ============================================================ */

:root {
    --st-sidebar-width: 264px;
    --st-topbar-height: 56px;

    /* Yuzeyler: arka plan -> kart -> vurgulu satir seklinde yukselir */
    /* Arka plan kartlardan belirgin sekilde koyu olmalidir; aksi halde
       beyaz kartlar zeminle birlesip sayfa tek bir beyaz yuzey gibi gorunur. */
    --st-bg: #e4e9f0;
    --st-surface: #ffffff;
    --st-surface-alt: #f2f5f9;
    --st-surface-sunken: #e9edf3;
    --st-border: #d3dae4;
    --st-border-strong: #b9c3d1;

    --st-text: #1b2430;
    --st-text-muted: #64748b;
    --st-text-subtle: #94a3b8;

    --st-sidebar-bg: #0f1b2d;
    --st-sidebar-text: #9fb0c6;
    --st-sidebar-text-active: #ffffff;
    --st-sidebar-hover: rgba(255, 255, 255, .06);
    --st-sidebar-active: #2563eb;
    --st-sidebar-border: rgba(255, 255, 255, .07);

    --st-primary: #2563eb;
    --st-primary-soft: rgba(37, 99, 235, .1);

    --st-radius-sm: .45rem;
    --st-radius: .7rem;
    --st-radius-lg: .9rem;

    --st-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 2px 5px rgba(16, 24, 40, .06);
    --st-shadow-md: 0 2px 6px rgba(16, 24, 40, .08), 0 8px 20px rgba(16, 24, 40, .07);
    --st-shadow-lg: 0 12px 32px rgba(16, 24, 40, .16);
}

[data-bs-theme="dark"] {
    /* Lacivert-antrasit zemin; kart zeminden acik olacak sekilde kademelenir. */
    --st-bg: #0d1424;
    --st-surface: #161f33;
    --st-surface-alt: #1d2840;
    --st-surface-sunken: #111829;
    --st-border: #2a3752;
    --st-border-strong: #3a4a6b;

    /* Soluk gri yerine mavi-gri tonlar: koyu zeminde okunabilirlik artar. */
    --st-text: #e7edf8;
    --st-text-muted: #a3b2cc;
    --st-text-subtle: #7b8dab;

    --st-sidebar-bg: #0a1120;
    --st-sidebar-text: #a8b6d0;
    --st-sidebar-border: rgba(255, 255, 255, .06);

    --st-primary: #4d7cfe;
    --st-primary-soft: rgba(77, 124, 254, .18);

    --st-shadow: 0 1px 2px rgba(0, 0, 0, .4);
    --st-shadow-md: 0 4px 16px rgba(0, 0, 0, .45);
    --st-shadow-lg: 0 18px 44px rgba(0, 0, 0, .55);
}

* {
    scrollbar-width: thin;
}

body {
    background: var(--st-bg);
    color: var(--st-text);
    font-family: "Segoe UI Variable Text", "Segoe UI", Inter, system-ui, -apple-system,
        "Helvetica Neue", Arial, sans-serif;
    font-size: .925rem;
    line-height: 1.5;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-variant-numeric: tabular-nums;
}

/* Basliklar govde metninden belirgin sekilde ayrisir */
h1, h2, h3, h4, h5, h6, .page-title {
    font-family: "Segoe UI Variable Display", "Segoe UI", Inter, system-ui, sans-serif;
    letter-spacing: -.012em;
}

/* Bootstrap'in vurgu rengini panel paletiyle hizala */
:root, [data-bs-theme="dark"] {
    --bs-primary: var(--st-primary);
    --bs-link-color: var(--st-primary);
    --bs-link-hover-color: var(--st-primary);
    --bs-body-color: var(--st-text);
    --bs-border-color: var(--st-border);
    --bs-secondary-color: var(--st-text-muted);
}

.btn-primary {
    --bs-btn-bg: var(--st-primary);
    --bs-btn-border-color: var(--st-primary);
    --bs-btn-hover-bg: color-mix(in srgb, var(--st-primary) 88%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--st-primary) 88%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--st-primary) 80%, #000);
}

/* ---------------------------------------------------------- düzen */

.app-shell {
    min-height: 100vh;
}

.app-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--st-sidebar-width);
    background: var(--st-sidebar-bg);
    color: var(--st-sidebar-text);
    display: flex;
    flex-direction: column;
    z-index: 1040;
    transition: transform .2s ease;
}

.app-main {
    margin-left: var(--st-sidebar-width);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    transition: margin-left .2s ease;
}

.app-content {
    padding: 1.1rem 1.35rem 2rem;
    flex: 1;
}

/* Menü daraltılmış durum */
.app-shell.sidebar-collapsed .app-sidebar {
    transform: translateX(-100%);
}

.app-shell.sidebar-collapsed .app-main {
    margin-left: 0;
}

/* ---------------------------------------------------------- sol menü */

.sidebar-brand {
    height: var(--st-topbar-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    flex-shrink: 0;
}

.brand-link {
    display: flex;
    align-items: center;
    gap: .65rem;
    text-decoration: none;
    color: #fff;
    overflow: hidden;
}

.brand-mark {
    font-size: 1.5rem;
    color: var(--st-primary);
    line-height: 1;
}

.brand-text strong {
    display: block;
    font-size: .95rem;
    letter-spacing: .2px;
}

.brand-text small {
    display: block;
    font-size: .72rem;
    color: var(--st-sidebar-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding: .5rem 0 1rem;
}

.sidebar-nav::-webkit-scrollbar { width: 6px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .15); border-radius: 3px; }

.nav-group-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .55rem 1rem;
    background: none;
    border: 0;
    color: var(--st-sidebar-text);
    font-size: .855rem;
    font-weight: 550;
    letter-spacing: 0;
    cursor: pointer;
    border-radius: 0;
}

.nav-group-toggle:hover { color: #fff; }

.nav-chevron {
    margin-left: auto;
    font-size: .7rem;
    transition: transform .2s ease;
}

.nav-group.open .nav-chevron { transform: rotate(180deg); }

.nav-group-items {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .25s ease;
}

.nav-group.open .nav-group-items { max-height: 800px; }

.nav-group-items .nav-link {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .5rem 1rem .5rem 1.9rem;
    color: var(--st-sidebar-text);
    font-size: .855rem;
    text-decoration: none;
    border-left: 3px solid transparent;
}

.nav-group-items .nav-link:hover {
    background: var(--st-sidebar-hover);
    color: #fff;
}

.nav-group-items .nav-link.active {
    background: linear-gradient(90deg, rgba(77, 124, 254, .22), rgba(77, 124, 254, .04));
    color: var(--st-sidebar-text-active);
    border-left-color: var(--st-primary);
    font-weight: 550;
}

.nav-group-items .nav-link i { font-size: .95rem; width: 1.1rem; }

.sidebar-footer {
    padding: .75rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, .07);
    flex-shrink: 0;
}

.sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 1035;
}

/* ---------------------------------------------------------- üst bar */

.app-topbar {
    height: var(--st-topbar-height);
    background: var(--st-surface);
    border-bottom: 1px solid var(--st-border);
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 0 1.25rem;
    position: sticky;
    top: 0;
    z-index: 1020;
}

.btn-icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--st-radius);
    border: 0;
    background: transparent;
    color: var(--st-text-muted);
    font-size: 1.05rem;
}

.btn-icon:hover { background: var(--st-surface-alt); color: var(--st-text); }

.topbar-search {
    position: relative;
    flex: 1;
    max-width: 480px;
}

.topbar-search > i {
    position: absolute;
    left: .75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--st-text-muted);
    pointer-events: none;
}

.topbar-search input {
    padding-left: 2.2rem;
    background: var(--st-surface-alt);
    border-color: transparent;
}

.topbar-search input:focus { background: var(--st-surface); }

.search-results {
    position: absolute;
    top: calc(100% + .35rem);
    left: 0;
    right: 0;
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    box-shadow: var(--st-shadow-lg);
    max-height: 420px;
    overflow-y: auto;
    z-index: 1030;
}

.search-results .search-item {
    display: block;
    padding: .6rem .85rem;
    border-bottom: 1px solid var(--st-border);
    text-decoration: none;
    color: var(--st-text);
}

.search-results .search-item:last-child { border-bottom: 0; }
.search-results .search-item:hover { background: var(--st-surface-alt); }

.topbar-actions {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-left: auto;
}

.branch-picker select { min-width: 160px; }

.notification-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: .62rem;
    padding: .18rem .35rem;
}

.notification-menu { width: 360px; padding: 0; }
.notification-list { max-height: 400px; overflow-y: auto; }

.notification-item {
    display: block;
    padding: .7rem .9rem;
    border-bottom: 1px solid var(--st-border);
    text-decoration: none;
    color: var(--st-text);
}

.notification-item.unread { background: rgba(13, 110, 253, .06); }
.notification-item:hover { background: var(--st-surface-alt); }

.user-menu-button {
    display: flex;
    align-items: center;
    gap: .6rem;
    border: 0;
    background: transparent;
    padding: .25rem .5rem;
    border-radius: var(--st-radius);
}

.user-menu-button:hover { background: var(--st-surface-alt); }

.avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--st-primary);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: .82rem;
    flex-shrink: 0;
}

.user-info { text-align: left; line-height: 1.15; }
.user-info strong { display: block; font-size: .85rem; }
.user-info small { color: var(--st-text-muted); font-size: .72rem; }

/* ---------------------------------------------------------- sayfa başlığı */

.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .9rem;
}

.page-title {
    font-size: 1.35rem;
    font-weight: 650;
    letter-spacing: -.015em;
    margin: 0 0 .25rem;
}

.breadcrumb { margin: 0; font-size: .8rem; }
.breadcrumb a { color: var(--st-text-muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--st-primary); }
.breadcrumb .breadcrumb-item.active { color: var(--st-text-subtle); }

.page-actions { display: flex; gap: .5rem; flex-wrap: wrap; }

/* ---------------------------------------------------------- kartlar */

.card {
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    box-shadow: var(--st-shadow);
}

.card-header {
    background: transparent;
    border-bottom: 1px solid var(--st-border);
    padding: .7rem 1rem;
    font-weight: 600;
    font-size: .93rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

.card-header > span > i:first-child { color: var(--st-text-subtle); }

.card-body { padding: 1rem; }

.card-footer {
    background: transparent;
    border-top: 1px solid var(--st-border);
    padding: .7rem 1rem;
}

/* İstatistik kartı */
.stat-card {
    display: flex;
    /* Bootstrap .card sinifi column yonlendirmesi uyguladigi icin acikca satir yapilir;
       aksi halde ikon degerin ustune yigiliyor. */
    flex-direction: row;
    align-items: center;
    gap: .8rem;
    padding: .85rem 1rem;
    height: 100%;
}

.stat-card > div { min-width: 0; }

.stat-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--st-radius-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex-shrink: 0;
}

.stat-value {
    font-size: 1.4rem;
    font-weight: 680;
    line-height: 1.05;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

.stat-label {
    color: var(--st-text-muted);
    font-size: .78rem;
    margin-top: .1rem;
}

.stat-trend { font-size: .75rem; }

.stat-card.clickable { cursor: pointer; transition: transform .14s ease, box-shadow .14s ease; }

.stat-card.clickable:hover {
    transform: translateY(-2px);
    box-shadow: var(--st-shadow-md);
}

/* ---------------------------------------------------------- tablolar */

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--st-text);
    font-size: .885rem;
    margin-bottom: 0;
    border-color: var(--st-border);
}

.table > thead > tr > th {
    background: var(--st-surface-alt);
    border-bottom: 1px solid var(--st-border);
    font-weight: 600;
    font-size: .8rem;
    letter-spacing: 0;
    color: var(--st-text-muted);
    white-space: nowrap;
    padding: .65rem .9rem;
}

.table > tbody > tr > td {
    vertical-align: middle;
    padding: .7rem .9rem;
    border-color: var(--st-border);
}

.table > tbody > tr:last-child > td { border-bottom-width: 0; }

.table-hover > tbody > tr:hover > * {
    background: var(--st-surface-alt);
    --bs-table-accent-bg: transparent;
}

/* Kod, tarih ve tutar gibi kisa sutunlar satir kirmaz */
.table td, .table th { white-space: nowrap; }
.table td.wrap, .table th.wrap { white-space: normal; }

/* Sayisal sutunlar hizali okunur */
.table .text-end { font-variant-numeric: tabular-nums; }

/* ------------------------------------------------- DataTables kontrolleri */

.dataTables_wrapper { position: relative; }

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    font-size: .82rem;
    color: var(--st-text-muted);
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter { padding: 0 0 .9rem; }

/* DataTables kendi satirlarini ekledigi icin kart govdesi ustten daraltilir */
.card-body > .dataTables_wrapper { margin-top: -.15rem; }

.dataTables_wrapper .dataTables_info { padding-top: .9rem; }

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius-sm);
    padding: .35rem .6rem;
    background: var(--st-surface);
    color: var(--st-text);
    margin-left: .4rem;
    min-height: 34px;
}

.dataTables_wrapper .dataTables_filter input { min-width: 220px; }

.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    outline: 0;
    border-color: var(--st-primary);
    box-shadow: 0 0 0 3px var(--st-primary-soft);
}

.dataTables_wrapper .dataTables_paginate { padding-top: .9rem; }

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: 1px solid var(--st-border) !important;
    border-radius: var(--st-radius-sm) !important;
    background: var(--st-surface) !important;
    color: var(--st-text) !important;
    padding: .3rem .65rem !important;
    margin-left: .25rem;
    min-width: 34px;
    text-align: center;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--st-surface-alt) !important;
    border-color: var(--st-border-strong) !important;
    color: var(--st-text) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--st-primary) !important;
    border-color: var(--st-primary) !important;
    color: #fff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--st-text-subtle) !important;
    cursor: default;
}

/* Siralama okları */
.table > thead > tr > th.sorting,
.table > thead > tr > th.sorting_asc,
.table > thead > tr > th.sorting_desc { cursor: pointer; }

.table > thead > tr > th.sorting_asc,
.table > thead > tr > th.sorting_desc { color: var(--st-text); }

/* Durum rozeti */
.status-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .22rem .55rem;
    border-radius: 1rem;
    font-size: .74rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-badge .dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

/* Öncelik göstergesi */
.priority-indicator { display: inline-block; width: 4px; height: 22px; border-radius: 2px; }
.priority-low { background: #adb5bd; }
.priority-normal { background: #0d6efd; }
.priority-high { background: #fd7e14; }
.priority-urgent { background: #dc3545; }

/* ---------------------------------------------------------- boş durum */

.empty-state {
    text-align: center;
    padding: 2.75rem 1rem;
    color: var(--st-text-muted);
}

.empty-state i {
    font-size: 1.6rem;
    color: var(--st-text-subtle);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--st-surface-alt);
    margin-bottom: .9rem;
}

.empty-state h5 { font-size: .98rem; font-weight: 600; color: var(--st-text); margin-bottom: .25rem; }
.empty-state p { font-size: .85rem; }

/* ---------------------------------------------------------- yükleniyor */

.app-loading {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, .55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    backdrop-filter: blur(1px);
}

[data-bs-theme="dark"] .app-loading { background: rgba(0, 0, 0, .5); }

/* ---------------------------------------------------------- filtre paneli */

.filter-panel {
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    box-shadow: var(--st-shadow);
    padding: .7rem .9rem;
    margin-bottom: .9rem;
}

.filter-panel .row > [class^="col"] { margin-bottom: .4rem; }
.filter-panel .form-label { font-size: .75rem; margin-bottom: .2rem; }

/* Üst bar ile içerik arasındaki ayrımı belirginleştirir */
.app-topbar { box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }

/* ---------------------------------------------------------- zaman çizelgesi */

.timeline { position: relative; padding-left: 1.75rem; }

.timeline::before {
    content: "";
    position: absolute;
    left: .45rem;
    top: .35rem;
    bottom: .35rem;
    width: 2px;
    background: var(--st-border);
}

.timeline-item { position: relative; padding-bottom: 1.15rem; }

.timeline-item::before {
    content: "";
    position: absolute;
    left: -1.52rem;
    top: .3rem;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--st-primary);
    border: 2px solid var(--st-surface);
}

.timeline-item.muted::before { background: var(--st-text-muted); }
.timeline-time { font-size: .75rem; color: var(--st-text-muted); }

/* ---------------------------------------------------------- form tasarımcısı */

.form-designer { display: grid; grid-template-columns: 230px 1fr 300px; gap: 1rem; min-height: 620px; }

.designer-panel {
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.designer-panel-header {
    padding: .7rem .9rem;
    border-bottom: 1px solid var(--st-border);
    font-weight: 600;
    font-size: .82rem;
}

.designer-panel-body { padding: .8rem; overflow-y: auto; flex: 1; }

.field-type-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .65rem;
    border: 1px solid var(--st-border);
    border-radius: .45rem;
    margin-bottom: .4rem;
    cursor: grab;
    font-size: .82rem;
    background: var(--st-surface-alt);
}

.field-type-item:hover { border-color: var(--st-primary); color: var(--st-primary); }

.designer-canvas { min-height: 480px; padding: .8rem; }

.designer-field {
    border: 1px solid var(--st-border);
    border-radius: .45rem;
    padding: .65rem .8rem;
    margin-bottom: .5rem;
    background: var(--st-surface);
    cursor: pointer;
    position: relative;
}

.designer-field.selected { border-color: var(--st-primary); box-shadow: 0 0 0 2px rgba(13, 110, 253, .15); }
.designer-field .field-actions { position: absolute; top: .4rem; right: .5rem; display: none; gap: .25rem; }
.designer-field:hover .field-actions { display: flex; }
.designer-field.drag-over { border-top: 2px solid var(--st-primary); }

/* ---------------------------------------------------------- harita */

#technicianMap, #locationHistoryMap, #serviceMap { height: 620px; border-radius: var(--st-radius); }

.map-legend {
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    padding: .6rem .8rem;
    font-size: .78rem;
}

.kvkk-notice {
    background: rgba(255, 193, 7, .12);
    border: 1px solid rgba(255, 193, 7, .4);
    border-radius: var(--st-radius);
    padding: .6rem .85rem;
    font-size: .8rem;
    margin-bottom: 1rem;
}

/* ---------------------------------------------------------- giriş ekranı */

.auth-page {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--st-bg);
}

.auth-visual {
    background: linear-gradient(140deg, #0d3f8f 0%, #0d6efd 60%, #3d8bfd 100%);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem;
}

.auth-visual h2 { font-weight: 700; font-size: 1.9rem; }
.auth-visual ul { list-style: none; padding: 0; margin-top: 1.6rem; }
.auth-visual li { display: flex; gap: .6rem; align-items: flex-start; margin-bottom: .85rem; }

.auth-form-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.auth-card { width: 100%; max-width: 400px; }

/* ---------------------------------------------------------- yardımcı sınıflar */

.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cursor-pointer { cursor: pointer; }
.fs-7 { font-size: .8rem; }
.fs-8 { font-size: .72rem; }
.min-w-0 { min-width: 0; }

.chart-container { position: relative; height: 230px; }
.chart-container.sm { height: 180px; }

/* Veri olmadiginda bos eksen yerine gosterilen durum */
.chart-empty {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    color: var(--st-text-subtle);
    font-size: .85rem;
}

.chart-empty i {
    font-size: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--st-surface-alt);
}


/* ---------------------------------------------------------- form kontrolleri */

.form-label {
    font-size: .82rem;
    font-weight: 550;
    color: var(--st-text-muted);
    margin-bottom: .3rem;
}

.form-control,
.form-select {
    background: var(--st-surface);
    border-color: var(--st-border);
    color: var(--st-text);
    border-radius: var(--st-radius-sm);
    min-height: 40px;
    font-size: .9rem;
}

.form-control::placeholder { color: var(--st-text-subtle); }

.form-control:focus,
.form-select:focus {
    background: var(--st-surface);
    border-color: var(--st-primary);
    box-shadow: 0 0 0 3px var(--st-primary-soft);
    color: var(--st-text);
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
    background: var(--st-surface-sunken);
    color: var(--st-text-muted);
}

.form-control-sm, .form-select-sm { min-height: 34px; font-size: .85rem; }
.form-text { font-size: .78rem; color: var(--st-text-subtle); }
.input-group-text { background: var(--st-surface-alt); border-color: var(--st-border); color: var(--st-text-muted); }

/* ---------------------------------------------------------- sekmeler */

.nav-tabs {
    border-bottom: 1px solid var(--st-border);
    gap: .15rem;
}

.nav-tabs .nav-link {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--st-text-muted);
    font-size: .9rem;
    font-weight: 550;
    padding: .65rem 1rem;
}

.nav-tabs .nav-link:hover { color: var(--st-text); background: var(--st-surface-alt); }

.nav-tabs .nav-link.active {
    color: var(--st-primary);
    background: transparent;
    border-bottom-color: var(--st-primary);
}

/* ---------------------------------------------------------- tanım listeleri */

/* Detay ekranlarindaki etiket/deger ciftleri okunakli hizalanir */
dl.row > dt {
    font-weight: 500;
    color: var(--st-text-muted);
    font-size: .85rem;
    padding-top: .3rem;
    padding-bottom: .3rem;
}

dl.row > dd {
    font-size: .9rem;
    padding-top: .3rem;
    padding-bottom: .3rem;
    margin-bottom: 0;
}

/* ---------------------------------------------------------- rozetler */

.badge { font-weight: 600; letter-spacing: .01em; padding: .35em .6em; border-radius: .4rem; }

/* ---------------------------------------------------------- açılır menü */

.dropdown-menu {
    border-color: var(--st-border);
    border-radius: var(--st-radius);
    box-shadow: var(--st-shadow-md);
    font-size: .9rem;
}

.modal-content { border-color: var(--st-border); border-radius: var(--st-radius-lg); }
.modal-header, .modal-footer { border-color: var(--st-border); }


/* ---------------------------------------------------------- kimlik dokunuslari */

/* Koyu temada kartlara ust kenardan gelen ince bir isik verilir; duz kutu
   gorunumunu kirar ve yuzeyler arasinda derinlik olusturur. */
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .filter-panel {
    background-image: linear-gradient(180deg, rgba(255, 255, 255, .035), transparent 42%);
}

/* Ust bar zeminle butunlesir, beyaz serit gorunumu olusmaz */
[data-bs-theme="dark"] .app-topbar {
    background: rgba(13, 20, 36, .88);
    backdrop-filter: blur(10px);
    box-shadow: none;
}

/* Sol menu: duz blok yerine hafif dikey gecis */
.app-sidebar {
    background-image: linear-gradient(180deg, rgba(255, 255, 255, .04), transparent 220px);
}

.sidebar-brand { border-bottom-color: var(--st-sidebar-border); }

.brand-mark {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--st-primary), #7aa2ff);
    color: #fff;
    font-size: 1.05rem;
    box-shadow: 0 4px 12px rgba(77, 124, 254, .35);
}

/* Durum rozetleri: dolgu yerine yumusak tonlu zemin */
.status-badge { letter-spacing: 0; }

/* Birincil dugme markaya ait yumusak bir golge tasir */
.btn-primary { box-shadow: 0 2px 8px rgba(77, 124, 254, .28); }
.btn-primary:hover { box-shadow: 0 4px 14px rgba(77, 124, 254, .36); }

/* Odak halkasi her yerde marka renginde */
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.nav-link:focus-visible {
    outline: 2px solid var(--st-primary);
    outline-offset: 2px;
    box-shadow: none;
}

/* Kaydirma cubugu tema ile uyumlu */
[data-bs-theme="dark"] * { scrollbar-color: #2f3e5c transparent; }

/* Tablo satirlarinda ince ayrim; klasik zebra deseni kullanilmaz */
.table > tbody > tr { transition: background-color .12s ease; }

/* Sayfa basligi altinda ince marka cizgisi */
.page-title { position: relative; }

/* ---------------------------------------------------------- duyarlı */

@media (max-width: 991.98px) {
    .app-sidebar { transform: translateX(-100%); }
    .app-main { margin-left: 0; }

    .app-shell.sidebar-open .app-sidebar { transform: translateX(0); }
    .app-shell.sidebar-open .sidebar-backdrop { display: block; }

    .form-designer { grid-template-columns: 1fr; }
    .auth-page { grid-template-columns: 1fr; }
    .auth-visual { display: none; }
    .app-content { padding: 1rem; }
    .topbar-search { max-width: none; }
}

@media (max-width: 575.98px) {
    .page-header { flex-direction: column; align-items: stretch; }
    .page-actions { width: 100%; }
    .page-actions .btn { flex: 1; }
    .stat-value { font-size: 1.25rem; }
}

@media print {
    .app-sidebar, .app-topbar, .page-actions, .filter-panel, .no-print { display: none !important; }
    .app-main { margin-left: 0; }
    .card { border: 1px solid #ddd; box-shadow: none; }
}

/* ============================================================ Hata sayfası */

.error-page {
    background: var(--st-bg);
    color: var(--st-text);
}

.error-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.error-card {
    background: var(--st-surface);
    border: 1px solid var(--st-border);
    border-radius: var(--st-radius);
    box-shadow: var(--st-shadow);
    padding: 3rem 2.5rem;
    max-width: 520px;
    width: 100%;
}

.error-icon {
    font-size: 3rem;
    color: var(--bs-primary);
    line-height: 1;
}

.error-code {
    font-size: 3.5rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--st-text);
}

/* Zorunlu alan etiketi */
.form-label.required::after {
    content: " *";
    color: var(--bs-danger);
    font-weight: 700;
}

/* Sunucu doğrulama özeti: hata yokken boş kutu görünmesin. */
.validation-summary-valid { display: none; }
.field-validation-valid { display: none; }

/* Vekaleten oturum uyarı şeridi (platform yöneticisi firma panelindeyken). */
.impersonation-bar {
    background: #b45309;
    color: #fff;
    font-size: .85rem;
}