/* ============================================
   TRIFOCUS UX - DARK THEME STYLES
   Activated when [data-theme="dark"] is on html element
   ============================================ */

[data-theme="dark"] {
  --brand-navy: #4A5B6C;
  --brand-navy-light: #5A6B7C;
  --brand-navy-dark: #3A4B5C;
  --brand-cyan: #6A7A8A;
  --brand-cyan-light: #9AAAAA;
  --brand-cyan-dark: #5A6A7A;
  
  --white: #1a1f2e;
  --gray-50: #1e2433;
  --gray-100: #242936;
  --gray-200: #2d3340;
  --gray-300: #3a4252;
  --gray-400: #5a6474;
  --gray-500: #8a94a4;
  --gray-600: #a0a8b8;
  --gray-700: #c0c8d8;
  --gray-800: #e0e4ea;
  --gray-900: #e4e7eb;
  
  --success: #34d399;
  --warning: #fbbf24;
  --error: #f87171;
  
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5);
  --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] body {
  background: #1a1f2e !important;
  color: #e4e7eb;
}

[data-theme="dark"] .navbar {
  background: linear-gradient(135deg, #242936, #1a1f2e) !important;
  border-bottom: 1px solid #3a4252;
}

[data-theme="dark"] .card {
  background: #242936 !important;
  border: 1px solid #3a4252 !important;
  color: #e4e7eb;
}

[data-theme="dark"] .card-header {
  background: #2d3340 !important;
  border-bottom: 1px solid #3a4252 !important;
  color: #e4e7eb;
}

[data-theme="dark"] .card-body {
  color: #e4e7eb;
}

[data-theme="dark"] .modal-content {
  background: #242936 !important;
  border: 1px solid #3a4252 !important;
  color: #e4e7eb;
}

[data-theme="dark"] .modal-header {
  border-bottom: 1px solid #3a4252 !important;
}

[data-theme="dark"] .modal-footer {
  border-top: 1px solid #3a4252 !important;
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
  background: #1a1f2e !important;
  border-color: #3a4252 !important;
  color: #e4e7eb !important;
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
  background: #1a1f2e !important;
  border-color: #5A6A7A !important;
  box-shadow: 0 0 0 0.25rem rgba(90, 106, 122, 0.25) !important;
}

[data-theme="dark"] .form-control::placeholder {
  color: #6a7484 !important;
}

[data-theme="dark"] .table {
  color: #e4e7eb;
}

[data-theme="dark"] .table > thead {
  background: #2d3340;
}

[data-theme="dark"] .table > tbody > tr {
  border-color: #3a4252;
}

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

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

[data-theme="dark"] .dropdown-menu {
  background: #242936 !important;
  border: 1px solid #3a4252 !important;
}

[data-theme="dark"] .dropdown-item {
  color: #e4e7eb !important;
}

[data-theme="dark"] .dropdown-item:hover {
  background: #2d3340 !important;
}

[data-theme="dark"] .alert {
  border: 1px solid #3a4252;
}

[data-theme="dark"] .alert-success {
  background: rgba(52, 211, 153, 0.15) !important;
  color: #34d399 !important;
}

[data-theme="dark"] .alert-warning {
  background: rgba(251, 191, 36, 0.15) !important;
  color: #fbbf24 !important;
}

[data-theme="dark"] .alert-danger {
  background: rgba(248, 113, 113, 0.15) !important;
  color: #f87171 !important;
}

[data-theme="dark"] .alert-info {
  background: rgba(96, 165, 250, 0.15) !important;
  color: #60a5fa !important;
}

[data-theme="dark"] .btn-outline-secondary {
  color: #a0a8b8 !important;
  border-color: #3a4252 !important;
}

[data-theme="dark"] .btn-outline-secondary:hover {
  background: #2d3340 !important;
  color: #e4e7eb !important;
}

[data-theme="dark"] .btn-light {
  background: #2d3340 !important;
  border-color: #3a4252 !important;
  color: #e4e7eb !important;
}

[data-theme="dark"] .btn-light:hover {
  background: #3a4252 !important;
}

[data-theme="dark"] .bg-white {
  background: #242936 !important;
}

[data-theme="dark"] .bg-light {
  background: #1e2433 !important;
}

[data-theme="dark"] .text-muted {
  color: #8a94a4 !important;
}

[data-theme="dark"] .text-dark {
  color: #e4e7eb !important;
}

[data-theme="dark"] .border {
  border-color: #3a4252 !important;
}

[data-theme="dark"] .border-bottom {
  border-color: #3a4252 !important;
}

[data-theme="dark"] footer {
  background: linear-gradient(135deg, #242936, #1a1f2e) !important;
  border-top: 1px solid #3a4252;
}

[data-theme="dark"] .hero,
[data-theme="dark"] .hero-section {
  background: linear-gradient(135deg, #2d3340, #1a1f2e) !important;
}

[data-theme="dark"] .list-group-item {
  background: #242936 !important;
  border-color: #3a4252 !important;
  color: #e4e7eb;
}

[data-theme="dark"] .breadcrumb {
  background: transparent;
}

[data-theme="dark"] .breadcrumb-item a {
  color: #8a9aaa;
}

[data-theme="dark"] .breadcrumb-item.active {
  color: #a0a8b8;
}

[data-theme="dark"] .nav-tabs .nav-link {
  color: #a0a8b8;
}

[data-theme="dark"] .nav-tabs .nav-link.active {
  background: #242936;
  border-color: #3a4252 #3a4252 #242936;
  color: #e4e7eb;
}

[data-theme="dark"] .nav-pills .nav-link {
  color: #a0a8b8;
}

[data-theme="dark"] .progress {
  background: #2d3340;
}

[data-theme="dark"] .badge.bg-secondary {
  background: #3a4252 !important;
}

[data-theme="dark"] .badge.bg-light {
  background: #2d3340 !important;
  color: #e4e7eb !important;
}

[data-theme="dark"] code {
  background: #2d3340;
  color: #f87171;
}

[data-theme="dark"] pre {
  background: #1a1f2e;
  border: 1px solid #3a4252;
}

[data-theme="dark"] hr {
  border-color: #3a4252;
}

[data-theme="dark"] .accordion-button {
  background: #242936;
  color: #e4e7eb;
}

[data-theme="dark"] .accordion-button:not(.collapsed) {
  background: #2d3340;
  color: #e4e7eb;
}

[data-theme="dark"] .accordion-body {
  background: #242936;
}

[data-theme="dark"] .offcanvas {
  background: #242936 !important;
}

[data-theme="dark"] .toast {
  background: #242936 !important;
  border: 1px solid #3a4252;
}

.theme-toggle-btn {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: inherit;
  padding: 0.5rem 0.75rem;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.theme-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.3);
}

.theme-toggle-btn i {
  font-size: 1rem;
}

[data-theme="dark"] .theme-toggle-btn {
  border-color: #3a4252;
  color: #e4e7eb;
}

[data-theme="dark"] .theme-toggle-btn:hover {
  background: #2d3340;
  border-color: #5a6474;
}

.theme-icon-light,
.theme-icon-dark {
  transition: opacity 0.2s ease;
}

[data-theme="dark"] .theme-icon-light {
  display: inline;
}

[data-theme="dark"] .theme-icon-dark {
  display: none;
}

[data-theme="light"] .theme-icon-light,
:root:not([data-theme="dark"]) .theme-icon-light {
  display: none;
}

[data-theme="light"] .theme-icon-dark,
:root:not([data-theme="dark"]) .theme-icon-dark {
  display: inline;
}

/* Dark Theme Dropdown Navigation */
[data-theme="dark"] .nav-dropdown-menu {
  background: #242936;
  border-color: #3a4252;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4), 0 2px 10px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .dropdown-item {
  color: #c0c8d8;
}

[data-theme="dark"] .dropdown-item:hover {
  background: #2d3340;
  color: #9AAAAA;
}

[data-theme="dark"] .dropdown-item.active {
  background: linear-gradient(135deg, rgba(106, 122, 138, 0.2), rgba(154, 170, 170, 0.2));
  color: #9AAAAA;
}

[data-theme="dark"] .nav-dropdown-trigger {
  color: #c0c8d8;
}

[data-theme="dark"] .nav-dropdown-trigger:hover {
  background: #2d3340;
  color: #9AAAAA;
}

[data-theme="dark"] .nav-dropdown.has-active .nav-dropdown-trigger {
  background: linear-gradient(135deg, rgba(106, 122, 138, 0.15), rgba(154, 170, 170, 0.15));
  color: #9AAAAA;
}

[data-theme="dark"] .mobile-nav-section-header {
  color: #8a94a4;
  border-color: #3a4252;
}