/* Global dark mode overrides for the entire portal */

/* Palette variables (scoped to dark) */
body.dark-mode {
  --dm-bg-base: #0b1220;        /* page background */
  --dm-bg-elev: #0f172a;        /* elevated surfaces */
  --dm-bg-elev-2: #111827;      /* cards/panels */
  --dm-bg-hover: #1f2937;       /* hover surface */
  --dm-text: #e5e7eb;           /* primary text */
  --dm-text-muted: #9ca3af;     /* secondary text */
  --dm-border: rgba(255,255,255,0.08);
  --dm-accent: #60a5fa;         /* sky-400 */
}

/* Page-level background + base text */
body.dark-mode {
  color: var(--dm-text);
}

body.dark-mode .team-portal-shortcode { 
  background: linear-gradient(135deg, #0b1220 0%, #0f172a 50%, #0b1220 100%) !important;
}

/* Containers */
body.dark-mode .team-portal-container,
body.dark-mode .portal-main-container,
body.dark-mode .tab-content-wrapper,
body.dark-mode .tabs-container,
body.dark-mode .grid-container {
  background: transparent !important;
  color: var(--dm-text);
}

/* Generic cards and blocks */
body.dark-mode .new-card-design,
body.dark-mode .service-card,
body.dark-mode .card,
body.dark-mode [class*="card-"],
body.dark-mode .widget,
body.dark-mode .panel,
body.dark-mode .box {
  background: var(--dm-bg-elev-2) !important;
  color: var(--dm-text) !important;
  border: 1px solid var(--dm-border) !important;
  box-shadow: none !important;
}

body.dark-mode .new-card-design:hover,
body.dark-mode .service-card:hover,
body.dark-mode .card:hover {
  background: var(--dm-bg-hover) !important;
}

/* Headings/text */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: var(--dm-text) !important;
}

body.dark-mode p,
body.dark-mode .text-muted,
body.dark-mode .portal-subtitle,
body.dark-mode .card-description {
  color: var(--dm-text-muted) !important;
}

/* Links */
body.dark-mode a { color: var(--dm-accent); }
body.dark-mode a:hover { color: #93c5fd; }

/* Tabs (top nav already dark; ensure content tabs) */
body.dark-mode .modern-tabs .tab-btn {
  color: var(--dm-text) !important;
}
body.dark-mode .modern-tabs .tab-btn.active,
body.dark-mode .modern-tabs .tab-btn:hover {
  background: rgba(255,255,255,0.06) !important;
  color: #fff !important;
}

/* Tables (DataTables and regular) */
body.dark-mode table,
body.dark-mode table.dataTable {
  background: var(--dm-bg-elev-2) !important;
  color: var(--dm-text) !important;
  border-color: var(--dm-border) !important;
}

body.dark-mode table thead th,
body.dark-mode table.dataTable thead th {
  background: #0b1220 !important;
  color: var(--dm-text) !important;
  border-bottom: 1px solid var(--dm-border) !important;
}

body.dark-mode table tbody tr,
body.dark-mode table.dataTable tbody tr {
  background: var(--dm-bg-elev-2) !important;
  border-bottom: 1px solid var(--dm-border) !important;
}

body.dark-mode .dataTables_wrapper .dataTables_length label,
body.dark-mode .dataTables_wrapper .dataTables_filter label,
body.dark-mode .dataTables_wrapper .dataTables_info,
body.dark-mode .dataTables_wrapper .dataTables_paginate a {
  color: var(--dm-text) !important;
}

body.dark-mode .dataTables_wrapper select,
body.dark-mode .dataTables_wrapper input[type="search"],
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
  background: #111827 !important;
  color: var(--dm-text) !important;
  border: 1px solid var(--dm-border) !important;
}

body.dark-mode select option {
  background: #111827 !important;
  color: var(--dm-text) !important;
}

body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button {
  background: transparent !important;
  color: var(--dm-text) !important;
  border: 1px solid transparent !important;
}
body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: rgba(255,255,255,0.06) !important;
  color: #fff !important;
  border-color: var(--dm-border) !important;
}

/* Forms and buttons */
body.dark-mode .btn,
body.dark-mode button,
body.dark-mode .control-btn {
  color: var(--dm-text) !important;
}

body.dark-mode .btn-primary,
body.dark-mode .button-primary {
  background: #2563eb !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
}

/* Filters/input bars */
body.dark-mode .filters-bar,
body.dark-mode .search-bar,
body.dark-mode .top-control-bar {
  background: var(--dm-bg-elev-2) !important;
  color: var(--dm-text) !important;
  border-color: var(--dm-border) !important;
}

/* Notifications panel content adjustments (complements existing) */
body.dark-mode #notificationsPanel,
body.dark-mode .notifications-panel {
  background: rgba(17,24,39,0.95) !important;
  border-color: var(--dm-border) !important;
}
body.dark-mode .notifications-header h3 { color: #fff !important; }
body.dark-mode .notification-item { color: var(--dm-text) !important; }
body.dark-mode .notification-message { color: var(--dm-text-muted) !important; }

/* Modal windows */
body.dark-mode .modal,
body.dark-mode .modal .modal-content,
body.dark-mode #editRecordModal .modal-content,
body.dark-mode .client-modal-content {
  background: var(--dm-bg-elev-2) !important;
  color: var(--dm-text) !important;
  border-color: var(--dm-border) !important;
}

/* Filter chips في الوضع الداكن */
body.dark-mode .filter-chip {
  background: #818cf8 !important;
  border-color: #6366f1 !important;
  color: #ffffff !important;
}

body.dark-mode .filter-chip .chip-label,
body.dark-mode .filter-chip .chip-value {
  color: #ffffff !important;
}

body.dark-mode .filter-chip .chip-remove {
  background: rgba(255, 255, 255, 0.25) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
  color: #ffffff !important;
}

body.dark-mode .filter-chip .chip-remove:hover {
  background: rgba(255, 255, 255, 0.35) !important;
}

/* Utility */
body.dark-mode .border { border-color: var(--dm-border) !important; }
body.dark-mode .muted { color: var(--dm-text-muted) !important; }