/* ==========================================================================
   Dark Theme Styles for PlainAdmin / CodeIgniter 4
   Theme Palette: Deep Bluish-Black / Dark Navy (Matching Screenshot Design)
   ========================================================================== */

:root {
  --bg-dark-body: #070c18;
  --bg-dark-sidebar: #0a1120;
  --bg-dark-card: #10192d;
  --bg-dark-input: #0a1222;
  --border-dark: #1c2944;
  --text-dark-primary: #ffffff;
  --text-dark-secondary: #cbd5e1;
  --accent-color: #2563eb;
  --scrollbar-thumb: #1d2d4a;
  --scrollbar-thumb-hover: #2b3e66;
  --scrollbar-track: #070c18;
}

/* ==========================================================================
   1. Browser Color Scheme & Custom Dark Scrollbars
   ========================================================================== */

html[data-theme="dark"],
html[data-theme="dark"] body,
[data-theme="dark"],
[data-theme="dark"] * {
  color-scheme: dark !important;
}

/* Firefox */
[data-theme="dark"],
[data-theme="dark"] *,
html[data-theme="dark"] * {
  scrollbar-width: thin !important;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track) !important;
}

/* Webkit Browsers (Chrome, Edge, Safari, Opera) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

html[data-theme="dark"] ::-webkit-scrollbar,
html[data-theme="dark"] *::-webkit-scrollbar,
[data-theme="dark"] ::-webkit-scrollbar,
[data-theme="dark"] *::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  background-color: var(--scrollbar-track) !important;
}

html[data-theme="dark"] ::-webkit-scrollbar-track,
html[data-theme="dark"] *::-webkit-scrollbar-track,
[data-theme="dark"] ::-webkit-scrollbar-track,
[data-theme="dark"] *::-webkit-scrollbar-track {
  background: var(--scrollbar-track) !important;
  border-radius: 4px !important;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb,
html[data-theme="dark"] *::-webkit-scrollbar-thumb,
[data-theme="dark"] ::-webkit-scrollbar-thumb,
[data-theme="dark"] *::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb) !important;
  border-radius: 4px !important;
  border: 2px solid var(--scrollbar-track) !important;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover,
html[data-theme="dark"] *::-webkit-scrollbar-thumb:hover,
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover,
[data-theme="dark"] *::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover) !important;
}

html[data-theme="dark"] ::-webkit-scrollbar-corner,
html[data-theme="dark"] *::-webkit-scrollbar-corner,
[data-theme="dark"] ::-webkit-scrollbar-corner,
[data-theme="dark"] *::-webkit-scrollbar-corner {
  background: var(--scrollbar-track) !important;
}

/* Fix layout scrollbars */
.sidebar-nav-wrapper {
  overflow-y: auto !important;
}

/* ==========================================================================
   2. Main Layout Elements & Global High-Contrast Typography
   ========================================================================== */

html[data-theme="dark"],
html[data-theme="dark"] body,
[data-theme="dark"] body {
  background-color: var(--bg-dark-body) !important;
  color: var(--text-dark-primary) !important;
}

[data-theme="dark"] .main-wrapper {
  background-color: var(--bg-dark-body) !important;
}

/* High Contrast Text Styles - No dark gray text anywhere! */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] strong,
[data-theme="dark"] b,
[data-theme="dark"] .text-dark,
[data-theme="dark"] .title h1,
[data-theme="dark"] .title h2,
[data-theme="dark"] .title h3,
[data-theme="dark"] .title h4,
[data-theme="dark"] .title h5,
[data-theme="dark"] .title h6 {
  color: #ffffff !important;
}

[data-theme="dark"] p,
[data-theme="dark"] span:not(.badge):not(.status-btn),
[data-theme="dark"] label,
[data-theme="dark"] small,
[data-theme="dark"] li,
[data-theme="dark"] .text-gray,
[data-theme="dark"] .text-muted,
[data-theme="dark"] .text-secondary,
[data-theme="dark"] .text-sm {
  color: #cbd5e1 !important;
}

/* Header & Navigation Bar */
[data-theme="dark"] .header {
  background-color: var(--bg-dark-sidebar) !important;
  border-bottom-color: var(--border-dark) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .sidebar-nav-wrapper {
  background-color: var(--bg-dark-sidebar) !important;
  border-right: 1px solid var(--border-dark) !important;
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .sidebar-nav ul .nav-item a {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .sidebar-nav ul .nav-item.active>a,
[data-theme="dark"] .sidebar-nav ul .nav-item a:hover {
  color: #ffffff !important;
  background-color: #172647 !important;
  border-radius: 8px;
}

[data-theme="dark"] .sidebar-nav ul .nav-item a .icon svg path {
  fill: #cbd5e1;
}

[data-theme="dark"] .sidebar-nav ul .nav-item.active>a .icon svg path,
[data-theme="dark"] .sidebar-nav ul .nav-item a:hover .icon svg path {
  fill: #ffffff;
}

/* Search Input */
[data-theme="dark"] .header-left .header-search input {
  background-color: var(--bg-dark-input) !important;
  border-color: var(--border-dark) !important;
  color: #ffffff !important;
}

/* Action Buttons in Header */
[data-theme="dark"] .header-right .notification-box .dropdown-toggle,
[data-theme="dark"] .header-right .header-message-box .dropdown-toggle,
[data-theme="dark"] .theme-toggle-btn {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border-color: var(--border-dark) !important;
  color: #ffffff !important;
}

/* Dropdown Menus */
[data-theme="dark"] .dropdown-menu {
  background-color: var(--bg-dark-card) !important;
  border-color: var(--border-dark) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .dropdown-menu li a,
[data-theme="dark"] .dropdown-item {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .dropdown-menu li a:hover,
[data-theme="dark"] .dropdown-item:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .dropdown-menu .divider {
  border-color: var(--border-dark) !important;
}

[data-theme="dark"] .profile-info .info h6 {
  color: #ffffff !important;
}

[data-theme="dark"] .profile-info .info p {
  color: #cbd5e1 !important;
}

/* ==========================================================================
   3. Cards & Widgets - No White Cards Allowed!
   ========================================================================== */

[data-theme="dark"] .card-style,
[data-theme="dark"] .icon-card,
[data-theme="dark"] .calendar-card,
[data-theme="dark"] .card {
  background-color: var(--bg-dark-card) !important;
  border-color: var(--border-dark) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

/* ==========================================================================
   4. Form Controls, Selects & Inputs
   ========================================================================== */

/* Form Controls, Selects & Inputs */
[data-theme="dark"] .select-style-1 select,
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] select,
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select.light-bg,
[data-theme="dark"] .light-bg {
  background: var(--bg-dark-input) !important;
  background-color: var(--bg-dark-input) !important;
  border-color: var(--border-dark) !important;
  color: #ffffff !important;
}

[data-theme="dark"] select option {
  background-color: var(--bg-dark-card) !important;
  color: #ffffff !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #94a3b8 !important;
  opacity: 0.8;
}

/* ==========================================================================
   5. Tables & Table Scrollbars
   ========================================================================== */

[data-theme="dark"] .table-responsive,
[data-theme="dark"] .table-wrapper,
[data-theme="dark"] .dataTables_wrapper,
[data-theme="dark"] .dataTables_scrollBody,
[data-theme="dark"] .table-wrapper-responsive {
  background-color: var(--bg-dark-card) !important;
  border-color: var(--border-dark) !important;
  color-scheme: dark !important;
}

[data-theme="dark"] .table {
  color: #ffffff !important;
  border-color: var(--border-dark) !important;
  background-color: transparent !important;
}

[data-theme="dark"] .table th,
[data-theme="dark"] .table td {
  border-color: var(--border-dark) !important;
  color: #e2e8f0 !important;
  background-color: transparent !important;
}

[data-theme="dark"] .table thead th {
  background-color: var(--bg-dark-input) !important;
  color: #ffffff !important;
  border-color: var(--border-dark) !important;
}

[data-theme="dark"] .table thead th h6 {
  color: #ffffff !important;
}

[data-theme="dark"] .table.top-selling-table tbody tr {
  border-color: var(--border-dark) !important;
}

[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(odd)>* {
  background-color: rgba(255, 255, 255, 0.02) !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] .table-hover>tbody>tr:hover>* {
  background-color: rgba(255, 255, 255, 0.05) !important;
  color: #ffffff !important;
}

/* DataTables pagination & controls */
[data-theme="dark"] .dataTables_info,
[data-theme="dark"] .dataTables_length,
[data-theme="dark"] .dataTables_filter {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .paginate_button {
  background-color: var(--bg-dark-input) !important;
  border-color: var(--border-dark) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   6. Buttons & Modals & Footer
   ========================================================================== */

[data-theme="dark"] .more-btn,
[data-theme="dark"] .edit {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: #cbd5e1 !important;
  border-color: var(--border-dark) !important;
}

[data-theme="dark"] .more-btn:hover,
[data-theme="dark"] .edit:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .modal-content {
  background-color: var(--bg-dark-card) !important;
  border-color: var(--border-dark) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer {
  border-color: var(--border-dark) !important;
}

[data-theme="dark"] .footer {
  background-color: var(--bg-dark-sidebar) !important;
  border-top-color: var(--border-dark) !important;
}

[data-theme="dark"] .footer p,
[data-theme="dark"] .footer a {
  color: #cbd5e1 !important;
}

/* ==========================================================================
   7. FullCalendar Complete Dark Mode Overrides - Absolute Zero White!
   ========================================================================== */

[data-theme="dark"] .fc,
[data-theme="dark"] .calendar-card,
[data-theme="dark"] #calendar-mini {
  --fc-page-bg-color: #10192d !important;
  --fc-border-color: #1c2944 !important;
  --fc-neutral-bg-color: #15223c !important;
  --fc-list-event-hover-bg-color: #172647 !important;
  --fc-button-bg-color: #172647 !important;
  --fc-button-border-color: #1c2944 !important;
  --fc-button-text-color: #ffffff !important;
  --fc-button-hover-bg-color: #2563eb !important;
  --fc-button-hover-border-color: #2563eb !important;
  --fc-button-active-bg-color: #2563eb !important;
  --fc-button-active-border-color: #2563eb !important;
  --fc-today-bg-color: rgba(37, 99, 235, 0.3) !important;
  background: #10192d !important;
  background-color: #10192d !important;
}

[data-theme="dark"] .fc *,
[data-theme="dark"] .fc-scrollgrid,
[data-theme="dark"] .fc-scrollgrid *,
[data-theme="dark"] .fc-col-header,
[data-theme="dark"] .fc-col-header *,
[data-theme="dark"] .fc-col-header-cell,
[data-theme="dark"] .fc-col-header-cell *,
[data-theme="dark"] .fc-scrollgrid-section,
[data-theme="dark"] .fc-scrollgrid-section *,
[data-theme="dark"] .fc-scrollgrid-section-header,
[data-theme="dark"] .fc-scrollgrid-section-header *,
[data-theme="dark"] .fc-scrollgrid-section-sticky,
[data-theme="dark"] .fc-scrollgrid-section-sticky *,
[data-theme="dark"] .fc-theme-standard td,
[data-theme="dark"] .fc-theme-standard th,
[data-theme="dark"] .fc-daygrid-day,
[data-theme="dark"] .fc-daygrid-day-frame,
[data-theme="dark"] .fc-daygrid-day-bg,
[data-theme="dark"] .fc-popover {
  background: #10192d !important;
  background-color: #10192d !important;
  border-color: #1c2944 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .fc .fc-col-header-cell,
[data-theme="dark"] .fc .fc-col-header-cell-cushion,
[data-theme="dark"] .fc .fc-daygrid-day-number,
[data-theme="dark"] .fc .fc-toolbar-title,
[data-theme="dark"] .fc a[data-navlink] {
  color: #ffffff !important;
  text-decoration: none !important;
}

[data-theme="dark"] .fc .fc-button-primary {
  background: #172647 !important;
  background-color: #172647 !important;
  border-color: #1c2944 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .fc .fc-button-primary:hover,
[data-theme="dark"] .fc .fc-button-primary:focus,
[data-theme="dark"] .fc .fc-button-primary.fc-button-active {
  background: #2563eb !important;
  background-color: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

[data-theme="dark"] .fc .fc-daygrid-day.fc-day-today,
[data-theme="dark"] .fc .fc-daygrid-day.fc-day-today * {
  background: rgba(37, 99, 235, 0.3) !important;
  background-color: rgba(37, 99, 235, 0.3) !important;
}

[data-theme="dark"] .fc .fc-day-other .fc-daygrid-day-top,
[data-theme="dark"] .fc .fc-day-other .fc-daygrid-day-number {
  opacity: 0.4 !important;
  color: #cbd5e1 !important;
}

/* Theme Toggle Button Styling */
.theme-toggle-btn {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  font-size: 20px;
  color: #475569;
}

.theme-toggle-btn:hover {
  background: #f1f5f9;
  color: var(--accent-color);
}