.accordion-button::after { margin-left: auto; }
.expandable .logs { white-space: pre-wrap; }
.navbar-brand { font-weight: 600; }
.table td, .table th { vertical-align: middle; }


/* Mobile-only smaller buttons for page actions */
@media (max-width: 576px) {
  .btn-mobile-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25;
    border-radius: 0.4rem;
  }
}

#tblHome.table.table-striped > tbody > tr.z-odd > * {
  background-color: var(--bs-table-striped-bg, rgba(0,0,0,.05)) !important;
}
#tblHome.table.table-striped > tbody > tr.z-even > * {
  background-color: transparent !important;
}
#tblHome.table.table-striped > tbody > tr.expandable > * {
  background-color: inherit !important;
}

/* Use Bootstrap's accent variable so striping renders correctly */
  --bs-table-accent-bg: var(--bs-table-striped-bg) !important;
  background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg)) !important;
}
#tblHome.table.table-striped > tbody > tr.z-even > * {
  --bs-table-accent-bg: transparent !important;
  background-image: none !important;
}
#tblHome.table.table-striped > tbody > tr.expandable > * {
  --bs-table-accent-bg: transparent !important;
  background-image: none !important;
}

/* --- Strong zebra override for #tblHome --- */
/* 1) Neutralize Bootstrap's default striping on this table */
#tblHome.table.table-striped > tbody > tr > * {
  --bs-table-accent-bg: transparent !important;
  background-image: none !important;
}
/* 2) Apply our own zebra only to data rows (z-odd / z-even), ignore expandable log rows */
#tblHome.table.table-striped > tbody > tr.z-odd > * {
  background-color: var(--bs-table-striped-bg, rgba(0,0,0,.05)) !important;
}
#tblHome.table.table-striped > tbody > tr.z-even > * {
  background-color: transparent !important;
}
#tblHome.table.table-striped > tbody > tr.expandable > * {
  background-color: inherit !important;
}

/* --- Responsive tweaks for #tblHome (mobile-first) --- */
@media (max-width: 768px) {
  #tblHome.table { font-size: 0.875rem; line-height: 1.2; }
  #tblHome.table td, #tblHome.table th { padding: 0.4rem 0.5rem; }
  #tblHome.table .btn, #tblHome.table .btn-sm { font-size: 0.75rem; padding: 0.2rem 0.4rem; }
  #tblHome.table .last-user { white-space: nowrap; }
}
@media (max-width: 576px) {
  #tblHome.table { font-size: 0.80rem; line-height: 1.15; }
  #tblHome.table td, #tblHome.table th { padding: 0.35rem 0.4rem; }
  #tblHome.table .btn, #tblHome.table .btn-sm { font-size: 0.70rem; padding: 0.18rem 0.35rem; }
}


/* --- Responsive typography for Gözetmen pages --- */
/* Desktop: unchanged (Bootstrap defaults). */

/* Tablets and down */
@media (max-width: 768px) {
  #tblGozetmen.table,
  #tblGozetmenKontrol.table { font-size: 0.875rem; line-height: 1.2; }
  #tblGozetmen.table th, #tblGozetmen.table td,
  #tblGozetmenKontrol.table th, #tblGozetmenKontrol.table td { padding: 0.40rem 0.50rem; }

  /* Make small controls actually small inside these tables */
  #tblGozetmen.table .btn, #tblGozetmen.table .btn-sm,
  #tblGozetmenKontrol.table .btn, #tblGozetmenKontrol.table .btn-sm { font-size: 0.75rem; padding: 0.20rem 0.40rem; }
  #tblGozetmen.table .badge, #tblGozetmenKontrol.table .badge { font-size: 0.70rem; }
}

/* Phones */
@media (max-width: 576px) {
  #tblGozetmen.table,
  #tblGozetmenKontrol.table { font-size: 0.80rem; line-height: 1.15; }
  #tblGozetmen.table th, #tblGozetmen.table td,
  #tblGozetmenKontrol.table th, #tblGozetmenKontrol.table td { padding: 0.35rem 0.40rem; }

  #tblGozetmen.table .btn, #tblGozetmen.table .btn-sm,
  #tblGozetmenKontrol.table .btn, #tblGozetmenKontrol.table .btn-sm { font-size: 0.70rem; padding: 0.18rem 0.35rem; }
  #tblGozetmen.table .badge, #tblGozetmenKontrol.table .badge { font-size: 0.68rem; }
}

/* === Responsive tweaks injected by ChatGPT v11 === */

/* On phones / small tablets:
   - Show session badge + action buttons on the same row
   - Make buttons compact chips
   - Shorten "Denemeyi Değiştir" -> "Değiştir"
*/
@media (max-width: 768px) {

  /* Put badge + buttons on same horizontal row instead of stacking */
  .row.align-items-center.g-1 {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: .25rem !important;
  }

  .row.align-items-center.g-1 > .col-12.col-lg-6 {
    width: auto !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: .25rem !important;
  }

  .row.align-items-center.g-1 > .col-12.col-lg-6 .d-grid.d-lg-flex {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: .25rem !important;
  }

  /* Compact button style on mobile */
  .btn-mobile-sm {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    width: auto !important;
    max-width: max-content !important;
    align-self: flex-start !important;
    justify-self: flex-start !important;
    padding: 0.2rem 0.4rem !important;
    font-size: 0.875rem !important;
    line-height: 1.25 !important;
    border-radius: 0.4rem !important;
  }

  /* Shorten "Denemeyi Değiştir" -> "Değiştir" on small screens */
  #btnChangeSession {
    font-size: 0 !important;               /* hide original long text */
    display: inline-block !important;
    line-height: 1.25 !important;
    min-width: auto !important;
    width: auto !important;
    padding: 0.2rem 0.4rem !important;      /* tighter horizontal space */
  }
  #btnChangeSession::before {
    content: "Değiştir";
    font-size: 0.875rem !important;         /* match btn-sm size */
    line-height: 1.25 !important;
  }
  #btnChangeSession::after {
    content: "" !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }
}

/* Input text color fix:
   - User typed text should use normal body color
   - Placeholder text stays light gray/silky
*/
.form-control {
  color: var(--bs-body-color) !important;
}
.form-control::placeholder {
  color: #adb5bd !important;
  opacity: 1;
}
@media (max-width: 576px) {
  .form-control::placeholder {
    font-size: 0.78rem !important;
  }
}


/* cheat_watch filters inline on md+ screens (6 per row) */
#scanForm .form-control-sm, #scanForm .form-select-sm { max-width: 100%; }
@media (min-width: 768px){
  #scanForm > .col-md-2 { flex: 0 0 auto; width: 16.66666667%; }
  #scanForm #only_kod.form-select-sm { white-space: nowrap; text-overflow: ellipsis; }
}


/* Home / Gözetmen tablosunda satır tıklanabilir olsun */
#tblGozetmen tbody tr[data-student-id] {
  cursor: pointer;
}

/* SMS sayfası: istatistik altındaki sınıf sayaç satırı */
.sms-classcounts{
  /* Kaydırma istemiyoruz; çok olursa alt satıra taşsın */
  white-space: normal;
  overflow: visible;
  padding-top: 2px;
  font-size: 11px; /* sınıf textlerini küçük yap */
  line-height: 1.15;
}

/* ===========================================================
   MODERN UI OVERHAUL â€” sadece gorsel, islevsellik korunur
   =========================================================== */

:root {
  --ui-radius:    10px;
  --ui-radius-sm: 7px;
  --ui-radius-lg: 14px;
  --ui-shadow:    0 1px 3px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.06);
  --ui-shadow-md: 0 2px 8px rgba(0,0,0,.10), 0 8px 24px rgba(0,0,0,.08);
  --ui-border:    #e2e8f0;
  --ui-blue:      #3b82f6;
  --ui-blue-dark: #2563eb;
  --ui-green:     #10b981;
  --ui-red:       #ef4444;
  --ui-yellow:    #f59e0b;
  --ui-gray-100:  #f1f5f9;
  --ui-gray-200:  #e2e8f0;
  --ui-gray-500:  #64748b;
  --ui-gray-700:  #334155;
  --ui-header-bg: #f8fafc;
  --ui-text:      #1e293b;
}

/* Body */
body:not(.login-page) { background: #f1f5f9 !important; color: var(--ui-text); }
.main-content { padding-top: 1.5rem; padding-bottom: 2rem; }

/* Cards */
.card { border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-lg) !important; box-shadow: var(--ui-shadow) !important; background: #fff !important; }
.card-body { padding: 1.25rem !important; }
.card-header { background: var(--ui-header-bg) !important; border-bottom: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius-lg) var(--ui-radius-lg) 0 0 !important; padding: .85rem 1.25rem !important; font-weight: 600; font-size: .9rem; color: var(--ui-gray-700); }
.card.bg-warning-subtle { background: linear-gradient(135deg,#fffbeb,#fef3c7) !important; border-left: 4px solid var(--ui-yellow) !important; box-shadow: none !important; }
.card.bg-success-subtle { background: linear-gradient(135deg,#f0fdf4,#dcfce7) !important; border-left: 4px solid var(--ui-green) !important; box-shadow: none !important; }
.card.bg-info-subtle    { background: linear-gradient(135deg,#eff6ff,#dbeafe) !important; border-left: 4px solid var(--ui-blue) !important; box-shadow: none !important; }
.card.bg-danger-subtle  { background: linear-gradient(135deg,#fef2f2,#fee2e2) !important; border-left: 4px solid var(--ui-red) !important; box-shadow: none !important; }
/* Ozel gradyanli banner'lar â€” bg: #fff !important override'ini gecer */
.card.card-dark-banner  { background: linear-gradient(135deg,#1e3a5f,#2c5282) !important; border: none !important; }
.card.bg-warning-subtle .card-body h5,
.card.bg-success-subtle .card-body h5,
.card.bg-info-subtle    .card-body h5 { font-size:.85rem !important; font-weight:700 !important; letter-spacing:.07em !important; text-transform:uppercase !important; }

/* Tables */
.table { font-size: 0.875rem; }
.table th { background: var(--ui-header-bg) !important; color: var(--ui-gray-500) !important; font-size: .72rem !important; font-weight: 700 !important; letter-spacing: .05em !important; text-transform: uppercase !important; padding: .65rem .85rem !important; border-bottom: 2px solid var(--ui-border) !important; border-top: none !important; white-space: nowrap; }
/* table-dark thead â€” koyu arkaplan ve beyaz yazi korunsun */
.table thead.table-dark th,
.table-dark th { background: #1e293b !important; color: #fff !important; border-bottom-color: #334155 !important; }
.table thead.table-dark th a,
.table-dark th a { color: #fff !important; }
.table td { padding: .65rem .85rem !important; vertical-align: middle !important; border-bottom: 1px solid var(--ui-gray-100) !important; transition: background .12s; }
.table tbody tr:hover > td { background: #eff6ff !important; }
.table-striped > tbody > tr:nth-of-type(odd) > td  { background: var(--ui-gray-100) !important; }
.table-striped > tbody > tr:nth-of-type(even) > td { background: #fff !important; }
.table tbody tr.expandable > td { background: inherit !important; }
#tblHome.table-striped > tbody > tr > td { --bs-table-accent-bg:transparent !important; background-image:none !important; }
#tblHome.table-striped > tbody > tr.z-odd  > td { background: var(--ui-gray-100) !important; }
#tblHome.table-striped > tbody > tr.z-even > td { background: #fff !important; }
#tblHome.table-striped > tbody > tr.expandable > td { background: inherit !important; }
.table thead th[data-order] { color: var(--ui-blue) !important; }
/* table-dark'ta sıralama linkleri de beyaz kalmali */
.table thead.table-dark th[data-order],
.table-dark th[data-order] { color: #93c5fd !important; }
.sort-ind { color: var(--ui-blue) !important; font-size: .7rem; }
.card > .table-responsive { margin:0; border-radius:0 0 var(--ui-radius-lg) var(--ui-radius-lg); overflow:hidden; }
.card > .table-responsive .table { margin-bottom:0; }

/* Buttons */
.btn { border-radius:var(--ui-radius-sm) !important; font-weight:500 !important; font-size:.835rem !important; letter-spacing:.01em !important; transition:transform .12s,box-shadow .12s !important; display:inline-flex !important; align-items:center !important; gap:.3rem !important; }
.btn:hover:not(:disabled) { transform:translateY(-1px) !important; box-shadow:0 4px 12px rgba(0,0,0,.15) !important; }
.btn:active:not(:disabled) { transform:translateY(0) !important; }
.btn-sm { padding:.3rem .65rem !important; font-size:.775rem !important; }
.btn-primary   { background:linear-gradient(135deg,var(--ui-blue),var(--ui-blue-dark)) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(59,130,246,.35) !important; }
.btn-success   { background:linear-gradient(135deg,#10b981,#059669) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(16,185,129,.3) !important; }
.btn-danger    { background:linear-gradient(135deg,#ef4444,#dc2626) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(239,68,68,.3) !important; }
.btn-warning   { background:linear-gradient(135deg,#f59e0b,#d97706) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(245,158,11,.3) !important; }
.btn-info      { background:linear-gradient(135deg,#0ea5e9,#0284c7) !important; border:none !important; color:#fff !important; }
.btn-secondary { background:linear-gradient(135deg,#64748b,#475569) !important; border:none !important; color:#fff !important; }
.btn-outline-primary   { color:var(--ui-blue) !important; border:1.5px solid var(--ui-blue) !important; background:transparent !important; }
.btn-outline-primary:hover:not(:disabled)   { background:var(--ui-blue) !important; color:#fff !important; }
.btn-outline-secondary { color:var(--ui-gray-500) !important; border:1.5px solid var(--ui-gray-200) !important; background:#fff !important; }
.btn-outline-secondary:hover:not(:disabled) { background:var(--ui-gray-100) !important; border-color:var(--ui-gray-500) !important; color:var(--ui-gray-700) !important; }
.btn-outline-danger    { color:var(--ui-red) !important; border:1.5px solid var(--ui-red) !important; background:transparent !important; }
.btn-outline-danger:hover:not(:disabled)    { background:var(--ui-red) !important; color:#fff !important; }
.btn-outline-success   { color:var(--ui-green) !important; border:1.5px solid var(--ui-green) !important; background:transparent !important; }
.btn-outline-success:hover:not(:disabled)   { background:var(--ui-green) !important; color:#fff !important; }

/* Badges */
.badge { font-size:.7rem !important; font-weight:600 !important; padding:.3em .6em !important; border-radius:6px !important; letter-spacing:.02em; }
.badge.bg-success, .badge.text-bg-success { background:#dcfce7 !important; color:#166534 !important; }
.badge.bg-primary   { background:#dbeafe !important; color:#1e40af !important; }
.badge.bg-warning   { background:#fef3c7 !important; color:#92400e !important; }
.badge.bg-danger    { background:#fee2e2 !important; color:#991b1b !important; }
.badge.bg-info      { background:#e0f2fe !important; color:#0c4a6e !important; }
.badge.bg-secondary { background:#f1f5f9 !important; color:#475569 !important; }

/* Form Controls */
.form-control, .form-select { border-radius:var(--ui-radius-sm) !important; border:1.5px solid var(--ui-gray-200) !important; font-size:.875rem !important; transition:border-color .15s,box-shadow .15s !important; }
.form-control:focus, .form-select:focus { border-color:var(--ui-blue) !important; box-shadow:0 0 0 3px rgba(59,130,246,.15) !important; }
.form-label { font-size:.77rem !important; font-weight:600 !important; color:var(--ui-gray-500) !important; letter-spacing:.04em; text-transform:uppercase; }
.form-control-sm, .form-select-sm { border-radius:var(--ui-radius-sm) !important; font-size:.82rem !important; padding:.3rem .65rem !important; }

/* Pagination */
.pagination { gap:3px !important; }
.page-item .page-link { border-radius:var(--ui-radius-sm) !important; border:1.5px solid var(--ui-gray-200) !important; color:var(--ui-gray-700) !important; font-size:.82rem !important; padding:.3rem .65rem !important; font-weight:500; min-width:34px; text-align:center; transition:background .12s,color .12s,border-color .12s; }
.page-item:not(.disabled) .page-link:hover { background:var(--ui-gray-100) !important; border-color:var(--ui-gray-500) !important; }
.page-item.active .page-link { background:var(--ui-blue) !important; border-color:var(--ui-blue) !important; color:#fff !important; box-shadow:0 2px 8px rgba(59,130,246,.35) !important; }
.page-item.disabled .page-link { opacity:.4 !important; }

/* Alerts */
.alert { border-radius:var(--ui-radius) !important; font-size:.875rem !important; }
.alert-success { background:#dcfce7 !important; color:#166534 !important; border:none !important; border-left:4px solid #22c55e !important; }
.alert-danger  { background:#fee2e2 !important; color:#991b1b !important; border:none !important; border-left:4px solid var(--ui-red) !important; }
.alert-warning { background:#fef3c7 !important; color:#92400e !important; border:none !important; border-left:4px solid var(--ui-yellow) !important; }
.alert-info    { background:#dbeafe !important; color:#1e40af !important; border:none !important; border-left:4px solid var(--ui-blue) !important; }

/* Modals */
.modal-content { border:none !important; border-radius:var(--ui-radius-lg) !important; box-shadow:0 20px 60px rgba(0,0,0,.2) !important; }
.modal-header  { border-bottom:1px solid var(--ui-border) !important; padding:1rem 1.25rem !important; }
.modal-footer  { border-top:1px solid var(--ui-border) !important; padding:.85rem 1.25rem !important; }
.modal-title   { font-weight:700 !important; font-size:1rem !important; }

/* Page dropdowns (not topbar) */
.dropdown-menu:not(.app-topbar .dropdown-menu) { border-radius:var(--ui-radius) !important; border:1px solid var(--ui-border) !important; box-shadow:var(--ui-shadow-md) !important; font-size:.865rem !important; padding:.35rem !important; }
.dropdown-menu:not(.app-topbar .dropdown-menu) .dropdown-item { border-radius:var(--ui-radius-sm) !important; padding:.45rem .75rem !important; }

/* Pointer on gozetmen rows */
#tblGozetmen tbody tr[data-student-id] { cursor: pointer; }

/* â”€â”€ Scrollbar gutter fix â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* Scrollbar cikinca sayfa daralmasin / kaymasin             */
html {
  scrollbar-gutter: stable;
  overflow-y: scroll;        /* her zaman scroll alan ayirt */
}
body.modal-open {
  padding-right: 0 !important;
}

/* â”€â”€ Navbar-banner mesafe & banner yukseklik â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* main-content padding'i azalt â€” banner navbara yakin olsun */
.main-content { padding-top: 0.5rem !important; }

/* container icindeki ilk py-3 padding'i de azalt */
.main-content .container.py-3 { padding-top: 0.6rem !important; }

/* Banner yuksekligini minimal tut */
.page-banner .card-body { padding: 0.35rem 0.85rem !important; }
.page-banner .card-body .fs-5 { font-size: 1rem !important; }
.page-banner { margin-bottom: 0.6rem !important; }

/* Mobil input auto-zoom engeli */
/* iOS/Safari: font-size < 16px olan inputlara tiklayin         */
/* ca sayfa zoom yapar. Mobilde min 16px zorunlu.               */
@media (max-width: 991.98px) {
  input[type="text"],
  input[type="number"],
  input[type="email"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="url"],
  input[type="date"],
  input[type="time"],
  select,
  textarea {
    font-size: 16px !important;
    touch-action: manipulation;
  }
}

/* Kirmizi gradyanli banner (control.php) */
.card.card-red-banner { background: linear-gradient(135deg,#1e40af,#2563eb) !important; border: none !important; }

/* ============================================================
   DARK THEME EXCEPTIONS
   Optik Editör, Salon Atama, Salon Listeleri, Kiosk sayfaları
   Bootstrap bg-dark / table-dark class'larını koruyan override'lar
   ============================================================ */

/* Cards with explicit dark backgrounds */
.card.bg-dark {
  background: linear-gradient(135deg, #1e293b 0%, #1a2332 100%) !important;
  border-color: rgba(255,255,255,0.1) !important;
  color: #e9ecef !important;
}
.card.bg-dark .card-header {
  background: rgba(0,0,0,0.3) !important;
  border-bottom-color: rgba(255,255,255,0.08) !important;
  color: #fff !important;
}
.card.bg-dark .card-body {
  color: #e9ecef !important;
}

/* Dark page banner — gradient header for dark-themed page titles */
.dark-page-banner {
  background: linear-gradient(135deg, #1e3a5f 0%, #2c5282 50%, #1e40af 100%) !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 20px rgba(30, 64, 175, 0.3) !important;
  padding: 1rem 1.5rem !important;
  margin-bottom: 1.25rem !important;
  color: #fff !important;
}
.dark-page-banner h2,
.dark-page-banner h3,
.dark-page-banner .h3 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.dark-page-banner p,
.dark-page-banner small {
  color: rgba(255,255,255,0.7) !important;
}

/* bg-black cards (sub-cards inside dark panels) */
.card.bg-black,
.bg-black.bg-opacity-25 {
  background: rgba(0,0,0,0.25) !important;
  border-color: #495057 !important;
}
.card.bg-black .card-header {
  background: rgba(0,0,0,0.4) !important;
  color: #fff !important;
}

/* Dark tables */
.table.table-dark,
.table-dark {
  --bs-table-bg: #212529 !important;
  --bs-table-color: #fff !important;
  background-color: #212529 !important;
  color: #fff !important;
}
.table.table-dark th,
.table-dark th {
  background: #1a1d21 !important;
  color: #adb5bd !important;
  border-bottom-color: #495057 !important;
}
.table.table-dark td,
.table-dark td {
  background: transparent !important;
  color: #e9ecef !important;
  border-bottom-color: #343a40 !important;
}
.table.table-dark tbody tr:hover > td,
.table-dark tbody tr:hover > td {
  background: rgba(255,255,255,0.05) !important;
}
/* Dark table striped override — prevent light stripes on dark tables */
.table-dark.table-striped > tbody > tr:nth-of-type(odd) > td {
  background: rgba(255,255,255,0.04) !important;
}
.table-dark.table-striped > tbody > tr:nth-of-type(even) > td {
  background: transparent !important;
}
/* Dark table bordered */
.table-dark.table-bordered,
.table-dark.table-bordered th,
.table-dark.table-bordered td {
  border-color: #343a40 !important;
}

/* Dark form controls */
.form-control.bg-black,
.form-select.bg-black,
.bg-dark .form-control.bg-black,
.bg-dark .form-select.bg-black {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #495057 !important;
}
.form-control.bg-black::placeholder {
  color: #6c757d !important;
}
.form-control.text-white,
.form-select.text-white {
  color: #fff !important;
}

/* Dark form labels inside dark cards */
.bg-dark .form-label,
.card.bg-dark .form-label {
  color: #adb5bd !important;
}

/* Dark list groups */
.list-group-item.bg-transparent {
  background: transparent !important;
}
.card.bg-dark .list-group-item {
  background: transparent !important;
  color: #e9ecef !important;
  border-color: #495057 !important;
}
.card.bg-dark .list-group-item:hover,
.card.bg-dark .list-group-item.active {
  background: rgba(255,255,255,0.08) !important;
}

/* Dark badges (inside dark-themed areas) */
.card.bg-dark .badge.bg-secondary,
.table-dark .badge.bg-secondary {
  background: #495057 !important;
  color: #e9ecef !important;
}
.card.bg-dark .badge.bg-success,
.table-dark .badge.bg-success {
  background: #198754 !important;
  color: #fff !important;
}
.card.bg-dark .badge.bg-primary,
.table-dark .badge.bg-primary {
  background: #0d6efd !important;
  color: #fff !important;
}
.card.bg-dark .badge.bg-warning,
.table-dark .badge.bg-warning {
  background: #ffc107 !important;
  color: #000 !important;
}
.card.bg-dark .badge.bg-danger,
.table-dark .badge.bg-danger {
  background: #dc3545 !important;
  color: #fff !important;
}
.card.bg-dark .badge.bg-info,
.table-dark .badge.bg-info {
  background: #0dcaf0 !important;
  color: #000 !important;
}

/* Dark modals */
.modal-content.bg-dark {
  background: #212529 !important;
  color: #e9ecef !important;
  border: 1px solid #495057 !important;
}
.modal-content.bg-dark .modal-header {
  background: rgba(0,0,0,0.3) !important;
  border-bottom-color: #495057 !important;
  color: #fff !important;
}
.modal-content.bg-dark .modal-footer {
  background: rgba(0,0,0,0.3) !important;
  border-top-color: #495057 !important;
}
.modal-content.bg-dark .form-label {
  color: #adb5bd !important;
}

/* Dark nav-pills / nav-tabs inside dark cards */
.card.bg-dark .nav-link {
  color: #adb5bd !important;
}
.card.bg-dark .nav-link.active {
  color: #fff !important;
  background: rgba(255,255,255,0.1) !important;
}
.card.bg-dark .nav-tabs {
  border-bottom-color: #495057 !important;
}

/* Dark text classes - only inside dark containers */
.card.bg-dark .text-white,
.modal-content.bg-dark .text-white { color: #fff !important; }
.card.bg-dark .text-light,
.modal-content.bg-dark .text-light { color: #f8f9fa !important; }
.card.bg-dark .text-secondary,
.modal-content.bg-dark .text-secondary { color: #adb5bd !important; }

/* btn-outline variants inside dark cards */
.card.bg-dark .btn-outline-secondary {
  color: #adb5bd !important;
  border-color: #6c757d !important;
  background: transparent !important;
}
.card.bg-dark .btn-outline-secondary:hover {
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
}
.card.bg-dark .btn-outline-warning {
  color: #ffc107 !important;
  border-color: #ffc107 !important;
  background: transparent !important;
}
.card.bg-dark .btn-outline-light {
  color: #f8f9fa !important;
  border-color: #f8f9fa !important;
  background: transparent !important;
}

