/* ═══════════════════════════════════════════════════════════════
   BACKOFFICE — theme-custom.css
   Kaynak SCSS dosyaları incelenerek yazılmıştır.
   Yerleştirme: assets/stylesheets/theme-custom.css
═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300&family=JetBrains+Mono:wght@400;500&display=swap');

/* ─────────────────────────────────────────
   DESIGN TOKENS
───────────────────────────────────────── */
:root {
  --font:       'Plus Jakarta Sans', sans-serif;
  --mono:       'JetBrains Mono', monospace;

  /* Arkaplan katmanları */
  --bg-deep:    #070a12;
  --bg-base:    #0b0f1a;
  --bg-card:    #0e1422;
  --bg-raised:  #121826;
  --bg-input:   #0f1520;
  --bg-hover:   rgba(59,130,246,0.08);

  /* Kenarlıklar */
  --bd:         rgba(59,130,246,0.13);
  --bd-2:       rgba(59,130,246,0.25);
  --bd-3:       rgba(255,255,255,0.06);

  /* Mavi ton skalası */
  --b1: #1e3a8a;
  --b2: #1d4ed8;
  --b3: #2563eb;
  --b4: #3b82f6;
  --b5: #60a5fa;
  --b6: #93c5fd;

  /* Durum renkleri */
  --green:   #34d399;
  --yellow:  #fbbf24;
  --red:     #f87171;
  --teal:    #2dd4bf;

  /* Metin */
  --tx1: #eef2ff;   /* birincil — parlak */
  --tx2: #a5b4cc;   /* ikincil */
  --tx3: #566680;   /* soluk */
  --tx4: #2a3650;   /* çok soluk */

  --r1: 6px;
  --r2: 10px;
  --r3: 16px;
  --t:  0.18s cubic-bezier(0.4,0,0.2,1);
}

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

html, body {
  font-family: var(--font) !important;
  background-color: var(--bg-base) !important;
  color: var(--tx2) !important;
  -webkit-font-smoothing: antialiased;
}

/* ═══════════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════════ */
.header {
  background: var(--bg-deep) !important;
  border-bottom: 1px solid var(--bd) !important;
  box-shadow: 0 1px 0 rgba(59,130,246,0.08), 0 4px 20px rgba(0,0,0,0.55) !important;
}

.header .logo,
.header-logo a,
.header a.logo {
  font-family: var(--font) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--tx1) !important;
  font-size: 1.1rem !important;
  text-decoration: none !important;
}

/* Arama kutusu */
.header .form-search input[type="text"],
.header .input-search,
.header .search input {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid var(--bd) !important;
  border-radius: var(--r2) !important;
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-size: 0.85rem !important;
}

.header .form-search input[type="text"]:focus,
.header .input-search:focus {
  border-color: var(--b4) !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.2) !important;
  background: rgba(255,255,255,0.07) !important;
}

/* Bildirim badge'leri */
.header .badge,
.header .notifications-badge {
  background: var(--red) !important;
  color: #fff !important;
  border-radius: 99px !important;
  font-size: 0.63rem !important;
  font-weight: 700 !important;
  min-width: 17px !important;
  height: 17px !important;
  line-height: 17px !important;
  padding: 0 5px !important;
  text-align: center !important;
  font-family: var(--font) !important;
}

/* Header nav items */
.header-nav-features a,
.header .userbox a,
.header .header-nav > li > a {
  color: var(--tx2) !important;
  font-family: var(--font) !important;
}
.header-nav-features a:hover,
.header .userbox a:hover {
  color: var(--tx1) !important;
}

/* ═══════════════════════════════════════════════════════════════
   SIDEBAR ★ estetik iyileştirme
═══════════════════════════════════════════════════════════════ */

/* Temel arka plan */
.sidebar-left {
  background: linear-gradient(180deg, #080b14 0%, #070a12 50%, #060912 100%) !important;
  border-right: 1px solid var(--bd) !important;
}

/* Nano scroller arka planı */
.sidebar-left .nano,
html.sidebar-left-collapsed .sidebar-left .nano {
  background: transparent !important;
  box-shadow: none !important;
}

/* Nano scrollbar */
.sidebar-left .nano > .nano-pane {
  background: rgba(255,255,255,0.04) !important;
  width: 3px !important;
  border-radius: 99px !important;
}
.sidebar-left .nano > .nano-pane > .nano-slider {
  background: rgba(59,130,246,0.4) !important;
  border-radius: 99px !important;
}

/* Sidebar başlık alanı */
.sidebar-left .sidebar-header {
  background: #060911 !important;
  border-bottom: 1px solid var(--bd) !important;
}

.sidebar-left .sidebar-header .sidebar-title {
  background: transparent !important;
  color: var(--tx3) !important;
  font-family: var(--font) !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

/* Sidebar toggle butonu */
.sidebar-left .sidebar-header .sidebar-toggle {
  background-color: rgba(255,255,255,0.04) !important;
  border-left: 1px solid var(--bd) !important;
  border-radius: 0 !important;
  transition: background var(--t) !important;
}
.sidebar-left .sidebar-header .sidebar-toggle:hover {
  background-color: rgba(59,130,246,0.12) !important;
}
.sidebar-left .sidebar-header .sidebar-toggle i {
  color: var(--tx3) !important;
  transition: color var(--t) !important;
}
.sidebar-left .sidebar-header .sidebar-toggle:hover i {
  color: var(--b5) !important;
}

/* ── NAV MAIN — ANA MENÜ ÖĞELERİ ── */
ul.nav-main {
  margin-right: 0 !important;
  padding: 8px 0 !important;
}

ul.nav-main li {
  width: 100% !important;
}

ul.nav-main li a {
  font-family: var(--font) !important;
  font-size: 0.84rem !important;
  font-weight: 500 !important;
  color: var(--tx2) !important;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 10px 20px 10px 22px !important;
  text-decoration: none !important;
  transition: background var(--t), color var(--t), border-color var(--t) !important;
  border-left: 3px solid transparent !important;
  position: relative;
}

ul.nav-main li a i {
  font-size: 0.95rem !important;
  width: 22px !important;
  min-width: 22px !important;
  text-align: center !important;
  color: var(--tx3) !important;
  margin-right: 10px !important;
  transition: color var(--t) !important;
  vertical-align: middle !important;
}

/* Hover */
ul.nav-main > li > a:hover,
ul.nav-main > li > a:focus {
  background-color: rgba(59,130,246,0.07) !important;
  color: var(--tx1) !important;
  border-left-color: rgba(59,130,246,0.3) !important;
}
ul.nav-main > li > a:hover > i {
  color: var(--b5) !important;
}

/* Aktif öğe — nav-active */
ul.nav-main > li.nav-active > a {
  background: linear-gradient(90deg, rgba(37,99,235,0.2) 0%, rgba(37,99,235,0.07) 100%) !important;
  color: var(--b5) !important;
  border-left-color: var(--b4) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
ul.nav-main > li.nav-active > a > i {
  color: var(--b5) !important;
}

/* Açılmış parent (nav-expanded) */
ul.nav-main > li.nav-expanded > a {
  background-color: rgba(255,255,255,0.04) !important;
  color: var(--tx1) !important;
  border-left-color: var(--bd-2) !important;
}
ul.nav-main > li.nav-expanded > a > i {
  color: var(--b5) !important;
}

/* Ok işareti (chevron) */
ul.nav-main li.nav-parent > a:after {
  color: var(--tx3) !important;
  transition: transform var(--t), color var(--t) !important;
}
ul.nav-main li.nav-expanded > a:after {
  color: var(--b5) !important;
  transform: rotate(180deg) !important;
}

/* ── ALT MENÜ (nav-children) ── */
ul.nav-main li ul.nav-children {
  background: rgba(5,8,16,0.7) !important;
  border-left: none !important;
  border-top: 1px solid var(--bd) !important;
  padding: 4px 0 6px !important;
  margin: 0 !important;
}

ul.nav-main li ul.nav-children li a {
  font-size: 0.81rem !important;
  color: var(--tx3) !important;
  padding: 8px 16px 8px 54px !important;
  border-left: 3px solid transparent !important;
  font-weight: 400 !important;
}

ul.nav-main li ul.nav-children li a:hover {
  background: rgba(59,130,246,0.07) !important;
  color: var(--b5) !important;
  border-left-color: rgba(59,130,246,0.25) !important;
}

ul.nav-main li ul.nav-children li.nav-active > a {
  background: rgba(37,99,235,0.12) !important;
  color: var(--b5) !important;
  border-left-color: var(--b4) !important;
  font-weight: 600 !important;
}

/* Separator çizgisi */
ul.nav-main li.separator,
.sidebar-left hr.separator {
  border-color: var(--bd) !important;
  margin: 8px 16px !important;
}

/* ── SIDEBAR WIDGET ("Hızlı Menü" etiketi) ── */
.sidebar-left .sidebar-widget {
  padding: 16px 22px 4px !important;
}

.sidebar-left .sidebar-widget p,
.sidebar-left .sidebar-widget .widget-header {
  font-family: var(--font) !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--tx3) !important;
  opacity: 0.8;
}

/* ═══════════════════════════════════════════════════════════════
   PAGE HEADER / CONTENT AREA
═══════════════════════════════════════════════════════════════ */
.inner-wrapper,
.content-body,
section.body {
  background: var(--bg-base) !important;
}

/* Sayfa başlık çubuğu */
.page-header {
  background: #09111f !important;
  border-bottom: 1px solid var(--bd) !important;
  border-left: none !important;
  box-shadow: 0 1px 0 rgba(59,130,246,0.05) !important;
  height: auto !important;
  padding: 0 24px !important;
  display: flex !important;
  align-items: center !important;
  min-height: 52px !important;
}

.page-header h2,
.page-header .breadcrumb-title {
  font-family: var(--font) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  color: var(--tx1) !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
}

/* Breadcrumb */
.breadcrumb {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}
.breadcrumb > li,
.breadcrumb > li + li:before {
  font-size: 0.78rem !important;
  color: var(--tx3) !important;
  font-family: var(--font) !important;
}
.breadcrumb > li > a { color: var(--b5) !important; }
.breadcrumb > .active { color: var(--tx2) !important; }

/* ═══════════════════════════════════════════════════════════════
   PANEL / KART — beyaz arka planları gider
═══════════════════════════════════════════════════════════════ */
.panel {
  background: var(--bg-card) !important;
  border: 1px solid var(--bd-3) !important;
  border-radius: var(--r3) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.03) inset !important;
  color: var(--tx1) !important;
  transition: border-color var(--t), box-shadow var(--t) !important;
}

.panel:hover {
  border-color: var(--bd) !important;
  box-shadow: 0 4px 24px rgba(37,99,235,0.10), 0 0 0 1px rgba(59,130,246,0.08) inset !important;
}

.panel-heading {
  background: var(--bg-raised) !important;
  border-bottom: 1px solid var(--bd-3) !important;
  border-radius: var(--r3) var(--r3) 0 0 !important;
  padding: 13px 20px !important;
}

.panel-title {
  font-family: var(--font) !important;
  font-weight: 700 !important;
  font-size: 0.86rem !important;
  color: var(--tx1) !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
}

.panel-body {
  background: var(--bg-card) !important;
  color: var(--tx2) !important;
  padding: 20px !important;
}

.panel-footer {
  background: var(--bg-raised) !important;
  border-top: 1px solid var(--bd-3) !important;
  border-radius: 0 0 var(--r3) var(--r3) !important;
  padding: 12px 20px !important;
}

/* Panel renk varyantları */
.panel-default > .panel-heading {
  background: linear-gradient(135deg, var(--bg-raised), rgba(37,99,235,0.05)) !important;
  border-color: var(--bd-3) !important;
  color: var(--tx1) !important;
}
.panel-primary > .panel-heading { background: linear-gradient(135deg,rgba(29,78,216,0.4),rgba(29,78,216,0.2)) !important; border-color: rgba(59,130,246,0.3) !important; }
.panel-success > .panel-heading { background: linear-gradient(135deg,rgba(5,150,105,0.3),rgba(5,150,105,0.15)) !important; border-color: rgba(52,211,153,0.25) !important; }
.panel-danger  > .panel-heading { background: linear-gradient(135deg,rgba(220,38,38,0.3),rgba(220,38,38,0.15)) !important; border-color: rgba(248,113,113,0.25) !important; }
.panel-warning > .panel-heading { background: linear-gradient(135deg,rgba(217,119,6,0.3),rgba(217,119,6,0.15)) !important; border-color: rgba(251,191,36,0.25) !important; }
.panel-info    > .panel-heading { background: linear-gradient(135deg,rgba(2,132,199,0.3),rgba(2,132,199,0.15)) !important; border-color: rgba(56,189,248,0.25) !important; }

/* İçerik alanı genel boşluk */
.content-body > .container-fluid,
.content-body > .row {
  padding-top: 24px !important;
}

/* ═══════════════════════════════════════════════════════════════
   İSTATİSTİK KARTLARI (Bahis Tutarı, Bekleyen…)
═══════════════════════════════════════════════════════════════ */
.panel-body h3,
.panel-body h2 {
  font-family: var(--font) !important;
  font-weight: 800 !important;
  color: var(--tx1) !important;
  letter-spacing: -0.04em !important;
}

.panel-body small,
.panel-body .text-muted {
  color: var(--tx2) !important;
  font-size: 0.79rem !important;
}

/* "AYRINTI GÖRÜNTÜLE" */
.panel-body > a,
.panel-body .text-right a {
  color: var(--b5) !important;
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 0.75;
  transition: opacity var(--t), color var(--t) !important;
}
.panel-body > a:hover,
.panel-body .text-right a:hover {
  opacity: 1;
  color: var(--b6) !important;
}

/* ═══════════════════════════════════════════════════════════════
   FORMLAR ★ görsel zenginlik
═══════════════════════════════════════════════════════════════ */

label,
.control-label,
.form-label {
  font-family: var(--font) !important;
  font-weight: 600 !important;
  font-size: 0.76rem !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--tx2) !important;
  margin-bottom: 6px !important;
  display: block;
}

/* Tüm input türleri */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="date"],
input[type="datetime-local"],
input[type="tel"],
input[type="url"],
textarea,
select,
.form-control {
  font-family: var(--font) !important;
  font-size: 0.87rem !important;
  font-weight: 400 !important;
  color: var(--tx1) !important;
  background: var(--bg-input) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  border-radius: var(--r2) !important;
  padding: 10px 14px !important;
  line-height: 1.5 !important;
  transition: border-color var(--t), box-shadow var(--t), background var(--t) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.025) inset,
    0 2px 6px rgba(0,0,0,0.35) !important;
  -webkit-appearance: none;
  appearance: none;
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus {
  border-color: var(--b4) !important;
  background: #0c1523 !important;
  box-shadow:
    0 0 0 3px rgba(59,130,246,0.22),
    0 1px 0 rgba(255,255,255,0.04) inset,
    0 2px 12px rgba(37,99,235,0.18) !important;
  outline: none !important;
  color: var(--tx1) !important;
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder {
  color: var(--tx3) !important;
  font-weight: 400 !important;
}

/* Select ok */
select.form-control {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23566680' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 13px center !important;
  padding-right: 36px !important;
}

/* Tarih inputları mono font */
input[type="date"],
input[type="datetime-local"] {
  font-family: var(--mono) !important;
  font-size: 0.84rem !important;
  color-scheme: dark;
}

/* Input group */
.input-group-addon {
  background: var(--bg-raised) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  color: var(--tx3) !important;
  font-family: var(--font) !important;
  font-size: 0.85rem !important;
}

.form-group {
  margin-bottom: 18px !important;
}

textarea.form-control {
  min-height: 100px !important;
  resize: vertical !important;
  line-height: 1.65 !important;
}

/* Select2 */
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
  background: var(--bg-input) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  border-radius: var(--r2) !important;
  height: auto !important;
  min-height: 40px !important;
  display: flex !important;
  align-items: center !important;
}

.select2-selection__rendered {
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-size: 0.87rem !important;
  padding: 6px 14px !important;
  line-height: 1.5 !important;
}

.select2-selection__arrow {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
}

.select2-container--open .select2-selection--single,
.select2-container--open .select2-selection--multiple {
  border-color: var(--b4) !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.2) !important;
}

.select2-dropdown {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r2) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.65) !important;
  z-index: 9999 !important;
}

.select2-results__option {
  color: var(--tx2) !important;
  font-family: var(--font) !important;
  font-size: 0.85rem !important;
  padding: 9px 14px !important;
  border-radius: 6px !important;
  margin: 2px 5px !important;
  transition: background var(--t), color var(--t) !important;
}

.select2-results__option--highlighted[aria-selected] {
  background: rgba(59,130,246,0.15) !important;
  color: var(--b5) !important;
}

.select2-results__option[aria-selected="true"] {
  background: rgba(59,130,246,0.1) !important;
  color: var(--b5) !important;
}

.select2-search--dropdown .select2-search__field {
  background: var(--bg-input) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  border-radius: 7px !important;
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-size: 0.85rem !important;
  padding: 8px 12px !important;
}

/* Bootstrap-select / multiselect */
.bootstrap-select > .btn,
.btn-group.bootstrap-select > .btn {
  background: var(--bg-input) !important;
  color: var(--tx1) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  border-radius: var(--r2) !important;
  font-family: var(--font) !important;
  font-size: 0.87rem !important;
  padding: 9px 14px !important;
}

.bootstrap-select .dropdown-menu,
.open > .dropdown-menu {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r2) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.6) !important;
  padding: 5px !important;
}

.bootstrap-select .dropdown-menu > li > a,
.bootstrap-select .dropdown-menu li a {
  color: var(--tx2) !important;
  font-family: var(--font) !important;
  font-size: 0.84rem !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  transition: background var(--t), color var(--t) !important;
}

.bootstrap-select .dropdown-menu li.active > a,
.bootstrap-select .dropdown-menu li > a:hover {
  background: rgba(59,130,246,0.14) !important;
  color: var(--b5) !important;
}

/* Datepicker */
.datepicker,
.datepicker-dropdown {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r2) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.6) !important;
  font-family: var(--font) !important;
}

.datepicker table tr td,
.datepicker table tr th {
  color: var(--tx2) !important;
  border-radius: 6px !important;
  font-family: var(--font) !important;
  font-size: 0.83rem !important;
}

.datepicker table tr td:hover {
  background: rgba(59,130,246,0.14) !important;
  color: var(--b5) !important;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled {
  background: var(--b3) !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(37,99,235,0.4) !important;
  text-shadow: none !important;
}

.datepicker table tr td.today {
  background: rgba(59,130,246,0.18) !important;
  color: var(--b5) !important;
}

.datepicker .datepicker-switch,
.datepicker .prev,
.datepicker .next {
  color: var(--tx2) !important;
}
.datepicker .datepicker-switch:hover,
.datepicker .prev:hover,
.datepicker .next:hover {
  background: rgba(59,130,246,0.1) !important;
  color: var(--b5) !important;
}

/* ═══════════════════════════════════════════════════════════════
   BUTONLAR ★ yüksek kalite
═══════════════════════════════════════════════════════════════ */
.btn {
  font-family: var(--font) !important;
  font-weight: 600 !important;
  font-size: 0.83rem !important;
  letter-spacing: 0.005em;
  border-radius: var(--r2) !important;
  padding: 9px 18px !important;
  line-height: 1.4 !important;
  border: 1px solid transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  text-decoration: none !important;
  -webkit-font-smoothing: antialiased;
  vertical-align: middle;
  transition:
    transform var(--t),
    box-shadow var(--t),
    background var(--t),
    border-color var(--t),
    color var(--t) !important;
}

/* Parlama efekti */
.btn::after {
  content: '';
  position: absolute;
  top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.13), transparent);
  transform: skewX(-20deg);
  transition: left 0.5s ease;
  pointer-events: none;
}
.btn:hover::after { left: 150%; }
.btn:hover        { transform: translateY(-2px); text-decoration: none !important; }
.btn:active       { transform: translateY(0) scale(0.97) !important; }
.btn:focus        { outline: none !important; }

/* Primary */
.btn-primary {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 5px 18px rgba(37,99,235,0.42) !important;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.2) inset, 0 9px 26px rgba(37,99,235,0.56) !important;
  color: #fff !important;
}
.btn-primary:focus {
  box-shadow: 0 0 0 3px rgba(59,130,246,0.4) !important;
}

/* Success */
.btn-success {
  background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 5px 18px rgba(5,150,105,0.36) !important;
}
.btn-success:hover {
  background: linear-gradient(135deg, #34d399 0%, #059669 100%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.2) inset, 0 9px 26px rgba(52,211,153,0.42) !important;
  color: #fff !important;
}

/* Danger */
.btn-danger {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.12) inset, 0 5px 18px rgba(220,38,38,0.36) !important;
}
.btn-danger:hover {
  background: linear-gradient(135deg, #f87171 0%, #dc2626 100%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 9px 26px rgba(248,113,113,0.42) !important;
  color: #fff !important;
}

/* Warning */
.btn-warning {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.12) inset, 0 5px 18px rgba(217,119,6,0.32) !important;
}
.btn-warning:hover {
  background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 9px 26px rgba(251,191,36,0.38) !important;
  color: #fff !important;
}

/* Info */
.btn-info {
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 5px 18px rgba(2,132,199,0.36) !important;
}
.btn-info:hover {
  background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.2) inset, 0 9px 26px rgba(56,189,248,0.42) !important;
  color: #fff !important;
}

/* Default */
.btn-default {
  background: var(--bg-raised) !important;
  color: var(--tx2) !important;
  border-color: rgba(59,130,246,0.18) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.04) inset, 0 2px 6px rgba(0,0,0,0.3) !important;
}
.btn-default:hover {
  background: rgba(255,255,255,0.07) !important;
  border-color: var(--bd-2) !important;
  color: var(--tx1) !important;
}

/* Boyutlar */
.btn-xs { padding: 4px 10px !important; font-size: 0.71rem !important; border-radius: 5px !important; }
.btn-sm { padding: 7px 14px !important; font-size: 0.80rem !important; }
.btn-lg { padding: 12px 26px !important; font-size: 0.95rem !important; border-radius: var(--r3) !important; }

/* ═══════════════════════════════════════════════════════════════
   TABLOLAR
═══════════════════════════════════════════════════════════════ */
.table {
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-size: 0.84rem !important;
  background: transparent !important;
}

.table > thead > tr > th {
  background: var(--bg-raised) !important;
  border-top: none !important;
  border-bottom: 1px solid var(--bd-2) !important;
  color: var(--tx3) !important;
  font-weight: 700 !important;
  font-size: 0.71rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 12px 16px !important;
  white-space: nowrap;
}

.table > tbody > tr > td {
  border-bottom: 1px solid var(--bd-3) !important;
  border-top: none !important;
  padding: 11px 16px !important;
  color: var(--tx1) !important;
  vertical-align: middle !important;
  background: transparent !important;
}

.table > tbody > tr:hover > td {
  background: rgba(59,130,246,0.035) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
  background: rgba(255,255,255,0.014) !important;
}

/* DataTables */
.dataTables_wrapper { color: var(--tx1) !important; font-family: var(--font) !important; }
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate { color: var(--tx2) !important; font-size: 0.82rem !important; }

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  background: var(--bg-input) !important;
  border: 1px solid rgba(59,130,246,0.18) !important;
  border-radius: var(--r1) !important;
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  padding: 6px 10px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-3) !important;
  color: var(--tx2) !important;
  border-radius: 6px !important;
  font-family: var(--font) !important;
  font-size: 0.81rem !important;
  padding: 5px 12px !important;
  transition: var(--t) !important;
  margin: 0 2px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: rgba(59,130,246,0.14) !important;
  color: var(--b5) !important;
  border-color: var(--bd-2) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: linear-gradient(135deg, var(--b3), var(--b2)) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(37,99,235,0.38) !important;
}

/* "No data available" text */
.dataTables_empty {
  color: var(--tx3) !important;
  font-style: italic;
  font-size: 0.84rem !important;
  padding: 24px !important;
}

/* ═══════════════════════════════════════════════════════════════
   LABEL & BADGE
═══════════════════════════════════════════════════════════════ */
.label, .badge {
  font-family: var(--font) !important;
  font-weight: 600 !important;
  font-size: 0.69rem !important;
  letter-spacing: 0.04em !important;
  padding: 3px 8px !important;
  border-radius: 5px !important;
  border: 1px solid transparent !important;
}

.label-default, .badge-default { background: rgba(255,255,255,0.07) !important; color: var(--tx2) !important; border-color: var(--bd-3) !important; }
.label-primary, .badge-primary { background: rgba(29,78,216,0.2) !important;    color: var(--b5) !important;  border-color: rgba(59,130,246,0.3) !important; }
.label-success, .badge-success { background: rgba(5,150,105,0.18) !important;   color: #6ee7b7 !important;     border-color: rgba(52,211,153,0.28) !important; }
.label-danger,  .badge-danger  { background: rgba(220,38,38,0.18) !important;   color: #fca5a5 !important;     border-color: rgba(248,113,113,0.28) !important; }
.label-warning, .badge-warning { background: rgba(217,119,6,0.18) !important;   color: #fcd34d !important;     border-color: rgba(251,191,36,0.28) !important; }
.label-info,    .badge-info    { background: rgba(2,132,199,0.18) !important;    color: #7dd3fc !important;     border-color: rgba(56,189,248,0.28) !important; }

/* ═══════════════════════════════════════════════════════════════
   DROPDOWN MENÜLER
═══════════════════════════════════════════════════════════════ */
.dropdown-menu {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r2) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.65) !important;
  padding: 5px !important;
}

.dropdown-menu > li > a {
  font-family: var(--font) !important;
  font-size: 0.84rem !important;
  color: var(--tx2) !important;
  padding: 9px 14px !important;
  border-radius: 6px !important;
  transition: background var(--t), color var(--t) !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li.active > a {
  background: rgba(59,130,246,0.12) !important;
  color: var(--b5) !important;
}

.dropdown-menu .divider {
  background: var(--bd-3) !important;
  margin: 5px 0 !important;
}

/* ═══════════════════════════════════════════════════════════════
   ALERT / BİLDİRİM
═══════════════════════════════════════════════════════════════ */
.alert {
  border-radius: var(--r2) !important;
  border-left-width: 3px !important;
  font-family: var(--font) !important;
  font-size: 0.85rem !important;
  padding: 12px 16px !important;
  border-top-width: 0 !important;
  border-right-width: 0 !important;
  border-bottom-width: 0 !important;
}

.alert-success { background: rgba(5,150,105,0.12) !important;  border-left-color: var(--green) !important;  color: #a7f3d0 !important; }
.alert-warning { background: rgba(217,119,6,0.12) !important;  border-left-color: var(--yellow) !important; color: #fde68a !important; }
.alert-danger  { background: rgba(220,38,38,0.12) !important;  border-left-color: var(--red) !important;    color: #fecaca !important; }
.alert-info    { background: rgba(2,132,199,0.12) !important;   border-left-color: var(--b4) !important;    color: #bae6fd !important; }

/* ═══════════════════════════════════════════════════════════════
   MODAL
═══════════════════════════════════════════════════════════════ */
.modal-content {
  background: var(--bg-card) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r3) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.8) !important;
}

.modal-header {
  background: var(--bg-raised) !important;
  border-bottom: 1px solid var(--bd-3) !important;
  border-radius: var(--r3) var(--r3) 0 0 !important;
  padding: 16px 22px !important;
}

.modal-title {
  font-family: var(--font) !important;
  font-weight: 700 !important;
  font-size: 0.98rem !important;
  color: var(--tx1) !important;
}

.modal-body {
  background: var(--bg-card) !important;
  color: var(--tx2) !important;
  padding: 22px !important;
}

.modal-footer {
  background: var(--bg-raised) !important;
  border-top: 1px solid var(--bd-3) !important;
  border-radius: 0 0 var(--r3) var(--r3) !important;
  padding: 12px 22px !important;
}

.modal-backdrop.in { opacity: 0.7 !important; }

/* ═══════════════════════════════════════════════════════════════
   SWEETALERT
═══════════════════════════════════════════════════════════════ */
.sweet-alert {
  background: var(--bg-raised) !important;
  border: 1px solid var(--bd-2) !important;
  border-radius: var(--r3) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.7) !important;
  font-family: var(--font) !important;
}

.sweet-alert h2 {
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-weight: 700 !important;
}

.sweet-alert p {
  color: var(--tx2) !important;
  font-family: var(--font) !important;
}

.sweet-overlay { background: rgba(7,10,18,0.75) !important; }

/* ═══════════════════════════════════════════════════════════════
   SCROLLBAR
═══════════════════════════════════════════════════════════════ */
::-webkit-scrollbar             { width: 5px; height: 5px; }
::-webkit-scrollbar-track       { background: var(--bg-deep); }
::-webkit-scrollbar-thumb       { background: rgba(59,130,246,0.22); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: rgba(59,130,246,0.45); }

/* ═══════════════════════════════════════════════════════════════
   YARDIMCI / UTILITY
═══════════════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font) !important;
  color: var(--tx1) !important;
  letter-spacing: -0.02em;
}

p, li, td, th { font-family: var(--font) !important; }

.text-muted   { color: var(--tx3) !important; }
.text-primary { color: var(--b5)  !important; }
.text-success { color: var(--green) !important; }
.text-danger  { color: var(--red)   !important; }
.text-warning { color: var(--yellow) !important; }
.text-info    { color: #7dd3fc !important; }

hr {
  border-top: 1px solid var(--bd-3) !important;
  margin: 20px 0 !important;
}

/* Focus ring erişilebilirlik */
*:focus-visible {
  outline: 2px solid var(--b4) !important;
  outline-offset: 2px !important;
}

/* Disable button */
.btn[disabled],
.btn.disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   PATCH 1 — TABLO BEYAZ ARKA PLAN SORUNU
   DataTables varsayılan beyaz/açık arka planları eziyoruz
═══════════════════════════════════════════════════════════════ */

/* Tüm tablo sarmalayıcıları */
.dataTables_wrapper,
.dataTables_wrapper table,
.DTFC_LeftWrapper,
.DTFC_RightWrapper,
div.dataTables_scrollBody,
div.dataTables_scrollHead,
div.dataTables_scrollFoot {
  background: var(--bg-card) !important;
  color: var(--tx1) !important;
}

/* Tablo kendisi */
table.dataTable,
table.dataTable tbody,
table.dataTable thead,
.table,
.table tbody,
.table thead {
  background: transparent !important;
}

/* thead satırı */
table.dataTable thead tr,
table.dataTable thead th,
.table > thead > tr,
.table > thead > tr > th {
  background: var(--bg-raised) !important;
  color: var(--tx3) !important;
  border-bottom: 1px solid var(--bd-2) !important;
}

/* Sıralama oklarının üzerine tıklanabilir başlıklar */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
  background-color: var(--bg-raised) !important;
  color: var(--tx3) !important;
}

/* tbody satırları — en önemli kısım */
table.dataTable tbody tr,
table.dataTable tbody tr td,
.table > tbody > tr,
.table > tbody > tr > td {
  background: var(--bg-card) !important;
  color: var(--tx1) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

/* Tek/çift satır renklendirmesi */
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd,
.table-striped > tbody > tr:nth-of-type(odd) > td {
  background: rgba(255,255,255,0.02) !important;
}

table.dataTable.stripe tbody tr.even,
table.dataTable.display tbody tr.even {
  background: var(--bg-card) !important;
}

/* Hover satırı */
table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover,
table.dataTable tbody tr:hover > td,
.table-hover > tbody > tr:hover > td {
  background: rgba(59,130,246,0.07) !important;
  color: var(--tx1) !important;
}

/* Seçili satır */
table.dataTable tbody tr.selected,
table.dataTable tbody tr.selected > td {
  background: rgba(37,99,235,0.15) !important;
  color: var(--tx1) !important;
}

/* Linkler içinde tablo */
table.dataTable tbody td a {
  color: var(--b5) !important;
}
table.dataTable tbody td a:hover {
  color: var(--b6) !important;
}

/* Alt kolon etiketi butonları (görüntüdeki koyu yuvarlak butonlar) */
table.dataTable tfoot tr,
table.dataTable tfoot td {
  background: var(--bg-raised) !important;
  color: var(--tx2) !important;
  border-top: 1px solid var(--bd-2) !important;
}

table.dataTable tfoot td input,
table.dataTable tfoot td select {
  background: var(--bg-input) !important;
  color: var(--tx1) !important;
  border: 1px solid rgba(59,130,246,0.2) !important;
  border-radius: var(--r2) !important;
  padding: 7px 12px !important;
  font-family: var(--font) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  width: 100% !important;
}

/* DataTables scroll konteyneri */
.dataTables_scrollBody {
  background: var(--bg-card) !important;
}

/* DataTables bilgi alanı */
.dataTables_info {
  color: var(--tx3) !important;
  font-size: 0.81rem !important;
  font-family: var(--font) !important;
}

/* ═══════════════════════════════════════════════════════════════
   PATCH 2 — SIDEBAR YAZI BOYUTU VE OKUNURLUĞU
═══════════════════════════════════════════════════════════════ */

/* Ana menü link metni — daha büyük ve parlak */
ul.nav-main li a {
  font-size: 0.93rem !important;
  color: #b8c8e0 !important;
  font-weight: 500 !important;
}

/* Ana menü ikonları */
ul.nav-main li a i {
  font-size: 1rem !important;
  color: #6a82a0 !important;
}

/* Hover daha belirgin */
ul.nav-main > li > a:hover,
ul.nav-main > li > a:focus {
  color: #e8f0ff !important;
}
ul.nav-main > li > a:hover > i {
  color: var(--b5) !important;
}

/* Aktif öğe çok daha parlak */
ul.nav-main > li.nav-active > a {
  color: #93c5fd !important;
  font-weight: 700 !important;
  font-size: 0.93rem !important;
}
ul.nav-main > li.nav-active > a > i {
  color: #60a5fa !important;
}

/* Açılmış parent */
ul.nav-main > li.nav-expanded > a {
  color: #d0ddf0 !important;
  font-weight: 600 !important;
}

/* Alt menü linkleri */
ul.nav-main li ul.nav-children li a {
  font-size: 0.88rem !important;
  color: #8a9ab8 !important;
  font-weight: 400 !important;
}

ul.nav-main li ul.nav-children li a:hover {
  color: #93c5fd !important;
}

ul.nav-main li ul.nav-children li.nav-active > a {
  color: #60a5fa !important;
  font-weight: 600 !important;
}

/* "HIZLI MENÜ" etiketi */
.sidebar-left .sidebar-widget p,
.sidebar-left .sidebar-header .sidebar-title {
  font-size: 0.72rem !important;
  color: #4a6080 !important;
  font-weight: 700 !important;
  letter-spacing: 0.13em !important;
}

/* ═══════════════════════════════════════════════════════════════
   PATCH 3 — GENEL AÇIK GRİ METİN SORUNU
   Açık arka plan üzerindeki okunmaz metinleri düzelt
═══════════════════════════════════════════════════════════════ */

/* İçerik alanındaki tüm metin varsayılanı */
.content-body,
.content-body * {
  color: inherit;
}

/* Bootstrap varsayılan gri metinlerini override et */
.text-muted,
.help-block,
small.text-muted,
span.text-muted {
  color: #7a90b0 !important;
}

/* Okunmaz açık gri başlıklar */
.panel-body p,
.panel-body span,
.panel-body div {
  color: var(--tx2) !important;
}

/* DataTables filter/length labels */
.dataTables_filter label,
.dataTables_length label {
  color: var(--tx2) !important;
  font-family: var(--font) !important;
  font-size: 0.83rem !important;
}

/* Sayfalama "Showing X to Y" */
.dataTables_info,
#DataTables_Table_0_info,
[id$="_info"] {
  color: #6a82a0 !important;
  font-size: 0.82rem !important;
}

/* Portlet / widget başlık alanları */
.portlet-title .caption,
.portlet-title .caption .caption-subject {
  color: var(--tx1) !important;
  font-family: var(--font) !important;
  font-weight: 700 !important;
}

/* Form alanı yardım metinleri */
.help-block {
  color: #6a82a0 !important;
  font-size: 0.8rem !important;
}

/* Tablodaki buton sütunları — "İşlem" kolonundaki butonlar */
.table .btn-xs,
.table .btn-sm {
  font-size: 0.72rem !important;
  padding: 4px 10px !important;
}

/* Beyaz kalabilen wrapper'ları kesin olarak kapat */
.panel > .table,
.panel > .table-responsive > .table,
.panel-body > .table {
  background: transparent !important;
}

.panel > .table > tbody > tr > td,
.panel > .table > tbody > tr > th,
.panel-body > .table > tbody > tr > td {
  background: var(--bg-card) !important;
  color: var(--tx1) !important;
}

/* Tablo responsive wrapper */
.table-responsive {
  background: var(--bg-card) !important;
  border: 1px solid var(--bd-3) !important;
  border-radius: var(--r2) !important;
}

/* ═══════════════════════════════════════════════════════════════
   PATCH 4 — PROGRESİF KONTRAST ARTIŞI
   Hiçbir metin #ccc veya daha açık gri kalmamalı koyu bg'de
═══════════════════════════════════════════════════════════════ */

/* Renk "inherit" eden alt elemanların ana rengini garanti et */
.inner-wrapper { color: var(--tx2) !important; }
.content-body  { color: var(--tx2) !important; }

/* Tüm th ve td'lerin varsayılan rengi */
th { color: var(--tx3) !important; font-family: var(--font) !important; }
td { color: var(--tx1) !important; font-family: var(--font) !important; }