/**
 * Project Custom Dark Theme Overrides
 * This file contains all custom dark mode styling for the project
 * Separated for easier maintenance
 */

/* ============================================
   Navbar Brand Image Override
   ============================================ */
[data-bs-theme="dark"] .navbar-brand-autodark .navbar-brand-image {
  filter: none !important;
}

/* ============================================
   Tabler Button Overrides
   ============================================ */
[data-bs-theme="dark"] .btn-outline-primary {
  color: #818cf8;
  border-color: #6366f1;
}

[data-bs-theme="dark"] .btn-outline-primary:hover {
  color: #ffffff;
  background-color: #6366f1;
  border-color: #6366f1;
}

[data-bs-theme="dark"] .btn-outline-primary:focus,
[data-bs-theme="dark"] .btn-outline-primary.focus {
  box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.5);
}

[data-bs-theme="dark"] .btn-outline-primary:active,
[data-bs-theme="dark"] .btn-outline-primary.active {
  color: #ffffff;
  background-color: #4f46e5;
  border-color: #4f46e5;
}

/* ============================================
   Link Colors
   Only apply to links that are NOT buttons
   ============================================ */
[data-bs-theme="dark"] a:not([class*="btn"]) {
  color: #818cf8;
}

[data-bs-theme="dark"] a:not([class*="btn"]):hover {
  color: #a5b4fc;
}

[data-bs-theme="dark"] .btn-link {
  color: #818cf8;
}

[data-bs-theme="dark"] .btn-link:hover {
  color: #a5b4fc;
}

/* ============================================
   Text Colors
   ============================================ */
[data-bs-theme="dark"] .text-muted {
  color: #94a3b8 !important;
}

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

[data-bs-theme="dark"] .text-black-50 {
  color: #94a3b8 !important;
}

/* ============================================
   Form Controls
   ============================================ */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  background-color: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
  background-color: #0f172a;
  border-color: #6366f1;
  color: #e2e8f0;
  box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.25);
}

[data-bs-theme="dark"] .form-control::placeholder {
  color: #64748b;
}

/* ============================================
   Cards
   ============================================ */
[data-bs-theme="dark"] .card {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .card-header {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .card-footer {
  background-color: #1e293b;
  border-color: #334155;
}

/* ============================================
   List Groups
   ============================================ */
[data-bs-theme="dark"] .list-group-item {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .list-group-item:hover {
  background-color: #334155;
}

/* ============================================
   Modals
   ============================================ */
[data-bs-theme="dark"] .modal-content {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .modal-header {
  border-color: #334155;
}

[data-bs-theme="dark"] .modal-footer {
  border-color: #334155;
}

/* ============================================
   Dropdowns
   ============================================ */
[data-bs-theme="dark"] .dropdown-menu {
  background-color: #1e293b;
  border-color: #334155;
}

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

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
  background-color: #334155;
  color: #f1f5f9;
}

/* ============================================
   Tables
   ============================================ */
[data-bs-theme="dark"] .table {
  color: #e2e8f0;
  border-color: #334155;
}

[data-bs-theme="dark"] .table thead th {
  border-color: #334155;
}

[data-bs-theme="dark"] .table tbody td {
  border-color: #334155;
}

[data-bs-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(51, 65, 85, 0.3);
}

[data-bs-theme="dark"] .table-hover tbody tr:hover {
  background-color: #334155;
  color: #f1f5f9;
}

/* ============================================
   Alerts
   ============================================ */
[data-bs-theme="dark"] .alert {
  border-color: #334155;
}

[data-bs-theme="dark"] .alert-primary {
  background-color: #312e81;
  border-color: #312e81;
  color: #c7d2fe;
}

[data-bs-theme="dark"] .alert-success {
  background-color: #14532d;
  border-color: #14532d;
  color: #bbf7d0;
}

[data-bs-theme="dark"] .alert-warning {
  background-color: #713f12;
  border-color: #713f12;
  color: #fef08a;
}

[data-bs-theme="dark"] .alert-danger {
  background-color: #7f1d1d;
  border-color: #7f1d1d;
  color: #fecaca;
}

[data-bs-theme="dark"] .alert-info {
  background-color: #0c4a6e;
  border-color: #0c4a6e;
  color: #bae6fd;
}

/* ============================================
   Badges
   ============================================ */
[data-bs-theme="dark"] .badge {
  border: 1px solid #334155;
}

/* ============================================
   Nav Tabs
   ============================================ */
[data-bs-theme="dark"] .nav-tabs {
  border-color: #334155;
}

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

[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
  border-color: #334155;
  color: #e2e8f0;
}

[data-bs-theme="dark"] .nav-tabs .nav-link.active {
  background-color: #1e293b;
  border-color: #334155 #334155 #1e293b;
  color: #e2e8f0;
}

/* ============================================
   Borders
   ============================================ */
[data-bs-theme="dark"] .border {
  border-color: #334155 !important;
}

[data-bs-theme="dark"] hr {
  border-color: #334155;
  opacity: 1;
}

/* ============================================
   Income Component Specific
   ============================================ */
[data-bs-theme="dark"] .income .category {
  background-color: #1e293b;
  color: #818cf8;
  border-top: 1px solid #334155;
  border-bottom: 1px solid #334155;
}

[data-bs-theme="dark"] .income .unit-number {
  color: #94a3b8;
}

[data-bs-theme="dark"] .income .owner-name {
  color: #94a3b8;
}

[data-bs-theme="dark"] .income .p-datatable .p-datatable-tbody tr:last-child td:first-child {
  color: #cbd5e1;
}

[data-bs-theme="dark"] .income .highlight-current-month {
  background-color: rgba(251, 191, 36, 0.15);
  border-left: 2px solid #fbbf24 !important;
  border-right: 2px solid #fbbf24 !important;
}

[data-bs-theme="dark"] .income .highlight-header {
  background-color: rgba(251, 191, 36, 0.9);
  color: #0f172a;
}

/* ============================================
   Custom Tooltip
   ============================================ */
[data-bs-theme="dark"] .custom-tooltip {
  background-color: #1e293b;
  color: #e2e8f0;
  border: 1px solid #334155;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.5);
}

/* ============================================
   PrimeReact DataTable Dark Theme
   ============================================ */
[data-bs-theme="dark"] .p-datatable .p-datatable-header {
  border: 1px solid #334155 !important;
  background-color: #1e293b;
}

[data-bs-theme="dark"] .p-datatable .p-datatable-thead > tr > th,
[data-bs-theme="dark"] .p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th {
  border-color: #334155;
  background-color: #1e293b;
}

[data-bs-theme="dark"] .p-datatable-tbody > tr > td {
  border-color: #334155;
}

/* ============================================
   Navigation Menu Hover Styles
   ============================================ */
[data-bs-theme="dark"] .nav-link:hover,
[data-bs-theme="dark"] .dropdown-item:hover {
  background-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-bs-theme="dark"] .dropdown-menu-columns:hover {
  background-color: #334155 !important;
}

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

[data-bs-theme="dark"] .nav-link:focus {
  background-color: #334155;
}

/* ============================================
   Loading Spinner Dark Theme
   ============================================ */
[data-bs-theme="dark"] .loading-spinner-overlay {
  background: rgba(15, 23, 42, 0.85) !important;
}

[data-bs-theme="dark"] .loading-spinner {
  border: 4px solid rgba(148, 163, 184, 0.3) !important;
  border-left-color: #818cf8 !important;
}

/* ============================================
   PrimeReact OverlayPanel Dark Theme
   ============================================ */
[data-bs-theme="dark"] .p-overlaypanel {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

[data-bs-theme="dark"] .p-overlaypanel .p-overlaypanel-content {
  color: #e2e8f0;
}

[data-bs-theme="dark"] .p-overlaypanel .p-overlaypanel-close {
  background: #6366f1;
  color: #ffffff;
}

[data-bs-theme="dark"] .p-overlaypanel .p-overlaypanel-close:enabled:hover {
  background: #818cf8;
  color: #ffffff;
}

[data-bs-theme="dark"] .p-overlaypanel:after {
  border-color: rgba(30, 41, 59, 0);
  border-bottom-color: #1e293b;
}

[data-bs-theme="dark"] .p-overlaypanel:before {
  border-color: rgba(51, 65, 85, 0);
  border-bottom-color: #334155;
}

[data-bs-theme="dark"] .p-overlaypanel.p-overlaypanel-flipped:after {
  border-top-color: #1e293b;
}

[data-bs-theme="dark"] .p-overlaypanel.p-overlaypanel-flipped:before {
  border-top-color: #334155;
}