/*
 * AllInvestView Premium Dark Theme
 * A modern, Revolut-inspired dark theme with professional fintech styling
 * Built on Bootstrap 5.3 CSS variables
 */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");

/* =============================================
   CSS Variables - Premium Dark Color Palette
   ============================================= */

:root {
  /* Core Background Colors */
  --premium-bg-primary: #0d1117;
  --premium-bg-secondary: #161b22;
  --premium-bg-tertiary: #1c2128;
  --premium-bg-elevated: #21262d;

  /* Text Colors */
  --premium-text-primary: #e6edf3;
  --premium-text-secondary: #a8b2bd; /* Brightened from #8b949e for better visibility */
  --premium-text-muted: #8b949e; /* Brightened from #6e7681 */
  --premium-text-link: #58a6ff;

  /* Brand Colors */
  --premium-brand-primary: #3b82f6;
  --premium-brand-primary-hover: #2563eb;
  --premium-brand-primary-rgb: 59, 130, 246;

  /* Semantic Colors */
  --premium-success: #22c55e;
  --premium-success-bg: rgba(34, 197, 94, 0.1);
  --premium-danger: #ef4444;
  --premium-danger-bg: rgba(239, 68, 68, 0.1);
  --premium-warning: #f59e0b;
  --premium-warning-bg: rgba(245, 158, 11, 0.1);
  --premium-info: #06b6d4;
  --premium-info-bg: rgba(6, 182, 212, 0.1);

  /* Border Colors */
  --premium-border: #30363d;
  --premium-border-subtle: #21262d;
  --premium-border-muted: #1c2128;

  /* Shadows */
  --premium-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --premium-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
  --premium-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.4);
  --premium-shadow-glow: 0 0 20px rgba(59, 130, 246, 0.15);

  /* DataTables FixedColumns dark mode variables */
  --dt-html-background: #161b22;
  --dtfc_background: #161b22;
  --dtfc-thead-cell_background: #1c2128;
  --dtfc-tbody-cell_background: #161b22;
  --dt-row-background: #161b22;
  --dt-row-stripe: #1c2128;

  /* Bootstrap Variable Overrides */
  --bs-body-bg: var(--premium-bg-primary);
  --bs-body-bg-rgb: 22, 27, 34;
  --bs-body-color: var(--premium-text-primary);
  --bs-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --bs-primary: var(--premium-brand-primary);
  --bs-primary-rgb: var(--premium-brand-primary-rgb);
  --bs-secondary: #6c757d;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success: var(--premium-success);
  --bs-success-rgb: 34, 197, 94;
  --bs-danger: var(--premium-danger);
  --bs-danger-rgb: 239, 68, 68;
  --bs-warning: var(--premium-warning);
  --bs-warning-rgb: 245, 158, 11;
  --bs-info: var(--premium-info);
  --bs-info-rgb: 6, 182, 212;

  --bs-link-color: var(--premium-text-link);
  --bs-link-hover-color: #79b8ff;
  --bs-code-color: #f778ba;

  --bs-border-color: var(--premium-border);
  --bs-border-color-translucent: rgba(255, 255, 255, 0.1);

  --bs-card-bg: var(--premium-bg-secondary);
  --bs-card-border-color: var(--premium-border);

  --bs-modal-bg: var(--premium-bg-secondary);

  --bs-tertiary-bg: var(--premium-bg-tertiary);
  --bs-secondary-bg: var(--premium-bg-secondary);
}

/* =============================================
   Base Styles
   ============================================= */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

/* DataTables FixedColumns uses html.dark selector for dark mode
   Define the variable specifically on html.dark for CDN detection */
html.dark {
  --dt-html-background: #161b22;
  --dtfc_background: #161b22;
  --dtfc-thead-cell_background: #1c2128;
  --dtfc-tbody-cell_background: #161b22;
}

body {
  background: linear-gradient(135deg, var(--premium-bg-primary) 0%, #0a0e14 100%);
  background-attachment: fixed;
  color: var(--premium-text-primary);
  font-family: var(--bs-body-font-family);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* =============================================
   Typography
   ============================================= */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--premium-text-primary);
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.75rem;
}

h1, .h1 { font-size: 2.25rem; }
h2, .h2 { font-size: 1.875rem; }
h3, .h3 { font-size: 1.5rem; }
h4, .h4 { font-size: 1.25rem; }
h5, .h5 { font-size: 1.125rem; }
h6, .h6 { font-size: 1rem; }

p {
  color: var(--premium-text-secondary);
  margin-bottom: 1rem;
}

a {
  color: var(--premium-text-link);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: #79b8ff;
}

.text-muted {
  color: var(--premium-text-muted) !important;
}

.text-secondary {
  color: var(--premium-text-secondary) !important;
}

/* =============================================
   Cards
   ============================================= */

.card {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.75rem;
  box-shadow: var(--premium-shadow-sm);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card:hover {
  border-color: var(--premium-border);
  box-shadow: var(--premium-shadow-md);
}

.card-header {
  background: var(--premium-bg-tertiary);
  border-bottom: 1px solid var(--premium-border);
  padding: 1rem 1.25rem;
  font-weight: 600;
}

.card-body {
  padding: 1.25rem;
}

.card-footer {
  background: var(--premium-bg-tertiary);
  border-top: 1px solid var(--premium-border);
  padding: 1rem 1.25rem;
}

.card-title {
  color: var(--premium-text-primary);
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.card-subtitle {
  color: var(--premium-text-secondary);
}

.card-text {
  color: var(--premium-text-secondary);
}

/* =============================================
   Buttons
   ============================================= */

.btn {
  border-radius: 0.5rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
  transition: all 0.2s ease;
  border: none;
}

.btn-primary {
  background: var(--premium-brand-primary);
  color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--premium-brand-primary-hover);
  color: #fff;
  box-shadow: var(--premium-shadow-md), var(--premium-shadow-glow);
  transform: translateY(-1px);
}

.btn-primary:active {
  transform: translateY(0);
}

.btn-secondary {
  background: var(--premium-bg-tertiary);
  border: 1px solid var(--premium-border);
  color: var(--premium-text-primary);
}

.btn-secondary:hover,
.btn-secondary:focus {
  background: var(--premium-bg-elevated);
  border-color: var(--premium-border);
  color: var(--premium-text-primary);
}

.btn-success {
  background: var(--premium-success);
  color: #fff;
}

.btn-success:hover {
  background: #16a34a;
  color: #fff;
}

.btn-danger {
  background: var(--premium-danger);
  color: #fff;
}

.btn-danger:hover {
  background: #dc2626;
  color: #fff;
}

.btn-warning {
  background: var(--premium-warning);
  color: #000;
}

.btn-warning:hover {
  background: #d97706;
  color: #000;
}

.btn-info {
  background: var(--premium-info);
  color: #000;
}

.btn-info:hover {
  background: #0891b2;
  color: #000;
}

.btn-outline-primary {
  border: 1px solid var(--premium-brand-primary);
  color: var(--premium-brand-primary);
  background: transparent;
}

.btn-outline-primary:hover {
  background: var(--premium-brand-primary);
  color: #fff;
}

.btn-outline-secondary {
  border: 1px solid var(--premium-border);
  color: var(--premium-text-secondary);
  background: transparent;
}

.btn-outline-secondary:hover {
  background: var(--premium-bg-tertiary);
  border-color: var(--premium-border);
  color: var(--premium-text-primary);
}

.btn-link {
  color: var(--premium-text-link);
}

.btn-link:hover {
  color: #79b8ff;
}

/* =============================================
   Forms
   ============================================= */

.form-control,
.form-select {
  background: var(--premium-bg-tertiary);
  border: 1px solid var(--premium-border);
  border-radius: 0.5rem;
  color: var(--premium-text-primary);
  padding: 0.625rem 0.875rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus,
.form-select:focus {
  background: var(--premium-bg-tertiary);
  border-color: var(--premium-brand-primary);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
  color: var(--premium-text-primary);
  outline: none;
}

.form-control::placeholder {
  color: var(--premium-text-muted);
}

.form-control:disabled,
.form-select:disabled {
  background: var(--premium-bg-primary);
  color: var(--premium-text-muted);
  cursor: not-allowed;
}

.form-label {
  color: var(--premium-text-primary);
  font-weight: 500;
  margin-bottom: 0.5rem;
}

.form-text {
  color: var(--premium-text-muted);
  font-size: 0.875rem;
}

.form-check-input {
  background-color: var(--premium-bg-tertiary);
  border: 1px solid var(--premium-border);
}

.form-check-input:checked {
  background-color: var(--premium-brand-primary);
  border-color: var(--premium-brand-primary);
}

.form-check-input:focus {
  border-color: var(--premium-brand-primary);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.form-check-label {
  color: var(--premium-text-secondary);
}

.input-group-text {
  background: var(--premium-bg-elevated);
  border: 1px solid var(--premium-border);
  color: var(--premium-text-secondary);
}

/* =============================================
   Tables
   ============================================= */

.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--premium-text-primary);
  --bs-table-border-color: var(--premium-border);
  --bs-table-striped-bg: var(--premium-bg-tertiary);
  --bs-table-hover-bg: var(--premium-bg-tertiary);
  color: var(--premium-text-primary);
  margin-bottom: 0;
}

.table > thead {
  background: var(--premium-bg-tertiary);
}

.table > thead > tr > th {
  border-bottom: 1px solid var(--premium-border);
  color: var(--premium-text-secondary);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 0.875rem 1rem;
  text-transform: uppercase;
}

.table > tbody > tr > td {
  border-bottom: 1px solid var(--premium-border-subtle);
  padding: 0.875rem 1rem;
  vertical-align: middle;
}

.table > tbody > tr:last-child > td {
  border-bottom: none;
}

.table-hover > tbody > tr:hover {
  background: var(--premium-bg-tertiary);
}

.table-striped > tbody > tr:nth-of-type(odd) {
  background: rgba(255, 255, 255, 0.02);
}

.table-dark {
  --bs-table-bg: var(--premium-bg-secondary);
  --bs-table-border-color: var(--premium-border);
}

/* =============================================
   Navigation
   ============================================= */

.navbar {
  background: var(--premium-bg-secondary) !important;
  border-bottom: 1px solid var(--premium-border);
  box-shadow: var(--premium-shadow-sm);
}

.navbar-brand {
  color: var(--premium-text-primary) !important;
  font-weight: 600;
}

.navbar-nav .nav-link {
  color: var(--premium-text-secondary) !important;
  font-weight: 500;
  padding: 0.5rem 1rem;
  transition: color 0.2s ease;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: var(--premium-text-primary) !important;
}

.navbar-toggler {
  border-color: var(--premium-border);
}

.navbar-toggler-icon {
  filter: invert(1);
}

.nav-tabs {
  border-bottom: 1px solid var(--premium-border);
}

.nav-tabs .nav-link {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--premium-text-secondary);
  font-weight: 500;
  padding: 0.75rem 1rem;
  transition: all 0.2s ease;
}

.nav-tabs .nav-link:hover {
  border-bottom-color: var(--premium-border);
  color: var(--premium-text-primary);
}

.nav-tabs .nav-link.active {
  background: transparent;
  border-bottom-color: var(--premium-brand-primary);
  color: var(--premium-brand-primary);
}

.nav-pills .nav-link {
  background: transparent;
  border-radius: 0.5rem;
  color: var(--premium-text-secondary);
  font-weight: 500;
  padding: 0.5rem 1rem;
}

.nav-pills .nav-link:hover {
  background: var(--premium-bg-tertiary);
  color: var(--premium-text-primary);
}

.nav-pills .nav-link.active {
  background: var(--premium-brand-primary);
  color: #fff;
}

/* =============================================
   Dropdowns
   ============================================= */

.dropdown-menu {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.5rem;
  box-shadow: var(--premium-shadow-lg);
  padding: 0.5rem;
}

.dropdown-item {
  border-radius: 0.375rem;
  color: var(--premium-text-primary);
  padding: 0.5rem 0.75rem;
  transition: background 0.15s ease;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--premium-bg-tertiary);
  color: var(--premium-text-primary);
}

.dropdown-item.active,
.dropdown-item:active {
  background: var(--premium-brand-primary);
  color: #fff;
}

.dropdown-divider {
  border-top-color: var(--premium-border);
  margin: 0.5rem 0;
}

.dropdown-header {
  color: var(--premium-text-muted);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 0.5rem 0.75rem;
  text-transform: uppercase;
}

/* =============================================
   Modals
   ============================================= */

.modal-content {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.75rem;
  box-shadow: var(--premium-shadow-lg);
}

.modal-header {
  border-bottom: 1px solid var(--premium-border);
  padding: 1.25rem 1.5rem;
}

.modal-title {
  color: var(--premium-text-primary);
  font-weight: 600;
}

.modal-body {
  padding: 1.5rem;
}

.modal-footer {
  border-top: 1px solid var(--premium-border);
  padding: 1rem 1.5rem;
}

.btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 0.5;
}

.btn-close:hover {
  opacity: 1;
}

.modal-backdrop {
  background-color: rgba(0, 0, 0, 0.7);
}

/* =============================================
   Date Range Picker - Premium Dark Theme
   ============================================= */

.daterangepicker {
  background-color: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 0.5rem !important;
  box-shadow: var(--premium-shadow-lg) !important;
  color: var(--premium-text-primary) !important;
}

.daterangepicker::before,
.daterangepicker::after {
  border-bottom-color: var(--premium-bg-secondary) !important;
}

.daterangepicker .calendar-table {
  background-color: var(--premium-bg-secondary) !important;
  border: none !important;
}

.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td {
  color: var(--premium-text-primary) !important;
  border-radius: 4px !important;
}

.daterangepicker .calendar-table th {
  color: var(--premium-text-secondary) !important;
  font-weight: 500 !important;
}

.daterangepicker .calendar-table td.available:hover {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.daterangepicker .calendar-table td.active,
.daterangepicker .calendar-table td.active:hover {
  background-color: var(--premium-brand-primary) !important;
  color: #fff !important;
}

.daterangepicker .calendar-table td.in-range {
  background-color: rgba(59, 130, 246, 0.2) !important;
  color: var(--premium-text-primary) !important;
}

.daterangepicker .calendar-table td.start-date,
.daterangepicker .calendar-table td.end-date {
  background-color: var(--premium-brand-primary) !important;
  color: #fff !important;
  border-radius: 4px !important;
}

.daterangepicker .calendar-table td.off,
.daterangepicker .calendar-table td.off.in-range,
.daterangepicker .calendar-table td.off.start-date,
.daterangepicker .calendar-table td.off.end-date {
  color: var(--premium-text-muted) !important;
  background-color: transparent !important;
}

.daterangepicker .drp-calendar {
  max-width: none !important;
}

.daterangepicker .drp-calendar.left,
.daterangepicker .drp-calendar.right {
  border: none !important;
}

.daterangepicker .drp-calendar.left {
  border-right: 1px solid var(--premium-border) !important;
}

/* Month/Year selectors */
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
  background-color: var(--premium-bg-tertiary) !important;
  border: 1px solid var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

.daterangepicker select.monthselect:focus,
.daterangepicker select.yearselect:focus {
  border-color: var(--premium-brand-primary) !important;
  outline: none !important;
}

/* Navigation arrows */
.daterangepicker th.prev,
.daterangepicker th.next {
  color: var(--premium-text-secondary) !important;
}

.daterangepicker th.prev:hover,
.daterangepicker th.next:hover {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* Ranges sidebar */
.daterangepicker .ranges {
  border-right: 1px solid var(--premium-border) !important;
}

.daterangepicker .ranges ul {
  padding: 0.5rem !important;
}

.daterangepicker .ranges li {
  color: var(--premium-text-secondary) !important;
  padding: 8px 12px !important;
  border-radius: 4px !important;
  margin-bottom: 2px !important;
  transition: all 0.15s ease !important;
}

.daterangepicker .ranges li:hover {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.daterangepicker .ranges li.active {
  background-color: var(--premium-brand-primary) !important;
  color: #fff !important;
}

/* Buttons */
.daterangepicker .drp-buttons {
  border-top: 1px solid var(--premium-border) !important;
  padding: 0.75rem 1rem !important;
}

.daterangepicker .drp-selected {
  color: var(--premium-text-secondary) !important;
  font-size: 0.875rem !important;
}

.daterangepicker .applyBtn {
  background-color: var(--premium-brand-primary) !important;
  border-color: var(--premium-brand-primary) !important;
  color: #fff !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-weight: 500 !important;
}

.daterangepicker .applyBtn:hover {
  background-color: var(--premium-brand-primary-hover) !important;
  border-color: var(--premium-brand-primary-hover) !important;
}

.daterangepicker .cancelBtn {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-secondary) !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-weight: 500 !important;
}

.daterangepicker .cancelBtn:hover {
  background-color: var(--premium-bg-elevated) !important;
  color: var(--premium-text-primary) !important;
}

/* Input display for dates */
.daterangepicker .drp-calendar .calendar-time {
  border-top: 1px solid var(--premium-border) !important;
  padding-top: 8px !important;
}

.daterangepicker .drp-calendar .calendar-time select {
  background-color: var(--premium-bg-tertiary) !important;
  border: 1px solid var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
  border-radius: 4px !important;
}

/* =============================================
   Date Picker Container Cards (Dashboard)
   Override inline styles for date picker cards
   ============================================= */

.date-picker-container {
  background-color: transparent !important;
}

.date-picker-container .card {
  background-color: var(--premium-bg-tertiary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 6px !important;
  transition: all 0.15s ease !important;
}

.date-picker-container .card:hover {
  border-color: var(--premium-brand-primary) !important;
  background-color: var(--premium-bg-elevated) !important;
}

.date-picker-container .card .btn {
  color: var(--premium-text-primary) !important;
  background: none !important;
}

.date-picker-container .card strong {
  color: var(--premium-text-secondary) !important;
}

.date-picker-container .card span {
  color: var(--premium-text-primary) !important;
}

.date-picker-container .card .fas.fa-calendar-alt,
.date-picker-container .card i {
  color: var(--premium-text-secondary) !important;
}

.date-picker-container .card:hover .fas.fa-calendar-alt,
.date-picker-container .card:hover i {
  color: var(--premium-brand-primary) !important;
}

/* Override any inline color styles on these elements */
.date-picker-container .card [style*="color: #333"],
.date-picker-container .card [style*="color:#333"] {
  color: var(--premium-text-secondary) !important;
}

.date-picker-container .card [style*="color: #555"],
.date-picker-container .card [style*="color:#555"] {
  color: var(--premium-text-primary) !important;
}

.date-picker-container .card [style*="color: #777"],
.date-picker-container .card [style*="color:#777"] {
  color: var(--premium-text-secondary) !important;
}

/* =============================================
   Alerts
   ============================================= */

.alert {
  border: none;
  border-radius: 0.5rem;
  padding: 1rem 1.25rem;
}

.alert-primary {
  background: rgba(59, 130, 246, 0.1);
  color: #93c5fd;
}

.alert-secondary {
  background: var(--premium-bg-tertiary);
  color: var(--premium-text-secondary);
}

.alert-success {
  background: var(--premium-success-bg);
  color: #86efac;
}

.alert-danger {
  background: var(--premium-danger-bg);
  color: #fca5a5;
}

.alert-warning {
  background: var(--premium-warning-bg);
  color: #fcd34d;
}

.alert-info {
  background: var(--premium-info-bg);
  color: #67e8f9;
}

/* =============================================
   Badges
   ============================================= */

.badge {
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0.25rem 0.5rem;
}

.bg-primary {
  background-color: var(--premium-brand-primary) !important;
}

.bg-secondary {
  background-color: var(--premium-bg-elevated) !important;
  color: var(--premium-text-secondary) !important;
}

.bg-success {
  background-color: var(--premium-success) !important;
}

.bg-danger {
  background-color: var(--premium-danger) !important;
}

.bg-warning {
  background-color: var(--premium-warning) !important;
  color: #000 !important;
}

.bg-info {
  background-color: var(--premium-info) !important;
  color: #000 !important;
}

.bg-dark {
  background-color: var(--premium-bg-elevated) !important;
}

.bg-light {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* =============================================
   Progress Bars
   ============================================= */

/* Override Bootstrap's progress bar CSS variable so inline styles from JS take effect */
/* The chart palette colors are applied via JavaScript bar.style.backgroundColor */
.progress,
.progress-stacked {
  --bs-progress-bar-bg: transparent;
  background: var(--premium-bg-tertiary);
}

/* Dashboard allocation progress bars use position:relative */
.progress[style*="position: relative"],
.progress[style*="position:relative"] {
  background-color: #374151 !important;
}

/* Progress bar - don't set background color, let JavaScript chart palette control it */
.progress-bar {
  transition: width 0.3s ease;
  /* Override Bootstrap's default - allow inline styles to work */
  background-color: transparent;
}

/* =============================================
   List Groups
   ============================================= */

.list-group {
  border-radius: 0.5rem;
}

.list-group-item {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  color: var(--premium-text-primary);
  padding: 0.875rem 1.25rem;
}

.list-group-item:first-child {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

.list-group-item:last-child {
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.list-group-item + .list-group-item {
  border-top: none;
}

.list-group-item:hover {
  background: var(--premium-bg-tertiary);
}

.list-group-item.active {
  background: var(--premium-brand-primary);
  border-color: var(--premium-brand-primary);
}

.list-group-item-action {
  transition: background 0.15s ease;
}

/* =============================================
   Pagination
   ============================================= */

.pagination {
  gap: 0.25rem;
}

.page-link {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.375rem;
  color: var(--premium-text-primary);
  padding: 0.5rem 0.875rem;
  transition: all 0.15s ease;
}

.page-link:hover {
  background: var(--premium-bg-tertiary);
  border-color: var(--premium-border);
  color: var(--premium-text-primary);
}

.page-item.active .page-link {
  background: var(--premium-brand-primary);
  border-color: var(--premium-brand-primary);
  color: #fff;
}

.page-item.disabled .page-link {
  background: var(--premium-bg-primary);
  border-color: var(--premium-border);
  color: var(--premium-text-muted);
}

/* =============================================
   Breadcrumbs
   ============================================= */

.breadcrumb {
  background: transparent;
  margin-bottom: 1rem;
  padding: 0;
}

.breadcrumb-item {
  color: var(--premium-text-secondary);
}

.breadcrumb-item a {
  color: var(--premium-text-link);
}

.breadcrumb-item.active {
  color: var(--premium-text-muted);
}

.breadcrumb-item + .breadcrumb-item::before {
  color: var(--premium-text-muted);
}

/* =============================================
   Tooltips & Popovers
   ============================================= */

.tooltip-inner {
  background: var(--premium-bg-elevated);
  border-radius: 0.375rem;
  box-shadow: var(--premium-shadow-md);
  color: var(--premium-text-primary);
  font-size: 0.875rem;
  padding: 0.5rem 0.75rem;
}

.bs-tooltip-top .tooltip-arrow::before {
  border-top-color: var(--premium-bg-elevated);
}

.bs-tooltip-bottom .tooltip-arrow::before {
  border-bottom-color: var(--premium-bg-elevated);
}

.popover {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.5rem;
  box-shadow: var(--premium-shadow-lg);
}

.popover-header {
  background: var(--premium-bg-tertiary);
  border-bottom: 1px solid var(--premium-border);
  color: var(--premium-text-primary);
}

.popover-body {
  color: var(--premium-text-secondary);
}

/* =============================================
   Accordion
   ============================================= */

.accordion {
  --bs-accordion-bg: var(--premium-bg-secondary);
  --bs-accordion-border-color: var(--premium-border);
  --bs-accordion-btn-color: var(--premium-text-primary);
  --bs-accordion-btn-bg: var(--premium-bg-secondary);
  --bs-accordion-active-color: var(--premium-brand-primary);
  --bs-accordion-active-bg: var(--premium-bg-tertiary);
}

.accordion-button {
  font-weight: 500;
}

.accordion-button:not(.collapsed) {
  background: var(--premium-bg-tertiary);
  box-shadow: none;
  color: var(--premium-brand-primary);
}

.accordion-button:focus {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.accordion-button::after {
  filter: invert(1);
}

/* =============================================
   Spinners
   ============================================= */

.spinner-border {
  color: var(--premium-brand-primary);
}

.spinner-grow {
  color: var(--premium-brand-primary);
}

/* =============================================
   Offcanvas & Sidebar
   ============================================= */

.offcanvas {
  background: var(--premium-bg-secondary);
  border-color: var(--premium-border);
}

.offcanvas-header {
  border-bottom: 1px solid var(--premium-border);
}

.offcanvas-title {
  color: var(--premium-text-primary);
}

/* =============================================
   Code & Pre
   ============================================= */

code {
  background: var(--premium-bg-tertiary);
  border-radius: 0.25rem;
  color: #f778ba;
  font-size: 0.875em;
  padding: 0.125rem 0.375rem;
}

pre {
  background: var(--premium-bg-tertiary);
  border: 1px solid var(--premium-border);
  border-radius: 0.5rem;
  color: var(--premium-text-primary);
  padding: 1rem;
}

pre code {
  background: transparent;
  padding: 0;
}

/* =============================================
   Scrollbars
   ============================================= */

::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--premium-bg-primary);
}

::-webkit-scrollbar-thumb {
  background: var(--premium-bg-elevated);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--premium-border);
}

/* =============================================
   Selection
   ============================================= */

::selection {
  background: rgba(59, 130, 246, 0.3);
  color: var(--premium-text-primary);
}

/* =============================================
   Utility Classes
   ============================================= */

.border {
  border-color: var(--premium-border) !important;
}

.border-top {
  border-top-color: var(--premium-border) !important;
}

.border-bottom {
  border-bottom-color: var(--premium-border) !important;
}

.border-start {
  border-left-color: var(--premium-border) !important;
}

.border-end {
  border-right-color: var(--premium-border) !important;
}

.shadow {
  box-shadow: var(--premium-shadow-md) !important;
}

.shadow-sm {
  box-shadow: var(--premium-shadow-sm) !important;
}

.shadow-lg {
  box-shadow: var(--premium-shadow-lg) !important;
}

/* Background utilities */
.bg-body {
  background-color: var(--premium-bg-primary) !important;
}

.bg-body-secondary {
  background-color: var(--premium-bg-secondary) !important;
}

.bg-body-tertiary {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Text color utilities */
.text-body {
  color: var(--premium-text-primary) !important;
}

.text-body-secondary {
  color: var(--premium-text-secondary) !important;
}

.text-body-tertiary {
  color: var(--premium-text-muted) !important;
}

/* =============================================
   Finance-specific Styles
   ============================================= */

/* Positive/Negative values */
.text-positive,
.text-gain,
.text-profit {
  color: var(--premium-success) !important;
}

.text-negative,
.text-loss {
  color: var(--premium-danger) !important;
}

/* Stat cards */
.stat-card {
  background: linear-gradient(135deg, var(--premium-bg-secondary) 0%, var(--premium-bg-tertiary) 100%);
  border: 1px solid var(--premium-border);
  border-radius: 0.75rem;
  padding: 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover {
  box-shadow: var(--premium-shadow-md);
  transform: translateY(-2px);
}

.stat-value {
  color: var(--premium-text-primary);
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
}

.stat-label {
  color: var(--premium-text-muted);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* Chart containers */
.chart-container {
  background: var(--premium-bg-secondary);
  border: 1px solid var(--premium-border);
  border-radius: 0.75rem;
  padding: 1.25rem;
}

/* Data highlights */
.highlight-box {
  background: rgba(59, 130, 246, 0.1);
  border-left: 3px solid var(--premium-brand-primary);
  border-radius: 0 0.5rem 0.5rem 0;
  padding: 1rem 1.25rem;
}

/* =============================================
   Responsive Adjustments
   ============================================= */

@media (max-width: 768px) {
  body {
    font-size: 0.9375rem;
  }

  .card-body {
    padding: 1rem;
  }

  .stat-value {
    font-size: 1.5rem;
  }

  h1, .h1 { font-size: 1.875rem; }
  h2, .h2 { font-size: 1.5rem; }
  h3, .h3 { font-size: 1.25rem; }
}

/* =============================================
   Print Styles
   ============================================= */

@media print {
  body {
    background: #fff;
    color: #000;
  }

  .card {
    border: 1px solid #ddd;
  }

  .btn {
    border: 1px solid #000;
  }
}

/* =============================================
   AllInvestView Specific Overrides
   Premium Dark Theme Fixes
   ============================================= */

/* -------------------------------------------
   General Table Overrides
   ------------------------------------------- */

/* Table backgrounds */
.table,
.table-bordered,
.table-striped,
.table-hover,
.dataTable {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

.table td,
.table th,
.dataTable td,
.dataTable th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Table header styling */
.table-light,
.table-light th,
.table-light td,
.table-light thead th,
thead.table-light th {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Table hover states */
.table-hover tbody tr:hover td,
.table-hover tbody tr:hover,
.dataTable tbody tr:hover td {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Table striped rows */
.table-striped > tbody > tr:nth-of-type(odd) > td,
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.02) !important;
}

/* -------------------------------------------
   Dividend Tables & Logs
   ------------------------------------------- */

/* Dividend table class from dashboard */
.tabledividends,
.tabledividends td,
.tabledividends th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Historical dividends table */
.table-dividends,
.table-dividends td,
.table-dividends th,
.table-dividends tr {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.table-dividends tr:hover,
.table-dividends tr:hover td {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Total dividends row */
.total-dividends-row,
.total-dividends-row td {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  font-weight: 600;
}

.total-dividends-row:hover,
.total-dividends-row:hover td {
  background-color: var(--premium-bg-elevated) !important;
}

/* Detailed dividends row */
.detailed-dividends-row,
.detailed-dividends-row tr,
.detailed-dividends-row td {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-secondary) !important;
}

/* Dividend Log specific */
#dividend-log-table,
#dividend-log-table td,
#dividend-log-table th,
.dividend-log td,
.dividend-log th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Trade History Tables
   ------------------------------------------- */

#trade-history-table,
#trade-history-table td,
#trade-history-table th,
.trade-history td,
.trade-history th,
#tradesTable,
#tradesTable td,
#tradesTable th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* -------------------------------------------
   Corporate Actions & Split History
   ------------------------------------------- */

.corporate-actions-table,
.corporate-actions-table td,
.corporate-actions-table th,
#split-history-table,
#split-history-table td,
#split-history-table th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Historical Split Corporate Actions improved styling */
.split-actions-container,
.corporate-action-card {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 0.5rem;
}

/* -------------------------------------------
   Dividend Calendar
   ------------------------------------------- */

.calendar-cell,
.calendar-cell div,
.dividend-calendar,
.dividend-calendar td,
.dividend-calendar th,
#dividend-calendar,
#dividend-calendar td,
#dividend-calendar th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.calendar-cell:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Calendar header */
.calendar-header,
.dividend-calendar-header {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* Calendar day with dividend */
.calendar-cell.has-dividend,
.dividend-day {
  background-color: rgba(59, 130, 246, 0.15) !important;
  border-color: var(--premium-brand-primary) !important;
}

/* -------------------------------------------
   Charts & Yearly Aggregated Dividends
   ------------------------------------------- */

.yearly-dividends-chart,
.chart-wrapper,
.dividend-chart-container {
  background-color: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 0.5rem;
  padding: 1rem;
}

/* Chart.js canvas backgrounds */
canvas {
  background-color: transparent !important;
}

/* Chart legends and labels */
.chart-legend,
.chartjs-legend {
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Select Dropdowns & Filters
   ------------------------------------------- */

select,
select.form-control,
select.form-select,
.filter-select,
#filter-select,
.custom-select {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

select option {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* Filter buttons with inline styles override */
[style*="background-color: #fff"],
[style*="background-color:#fff"],
[style*="background: #fff"],
[style*="background:#fff"],
[style*="background-color: #ffffff"],
[style*="background-color:#ffffff"],
[style*="background: white"],
[style*="background:white"],
[style*="background-color: white"] {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Icon Buttons & Action Buttons
   ------------------------------------------- */

.icon-button,
.action-btn,
.btn-icon,
[class*="icon-btn"] {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.icon-button:hover,
.action-btn:hover,
.btn-icon:hover {
  background-color: var(--premium-bg-elevated) !important;
}

/* -------------------------------------------
   Modals & Popups
   ------------------------------------------- */

.modal-content,
.popup,
.install-popup,
.swal2-popup,
.swal2-modal {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.swal2-title,
.swal2-html-container {
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Dropdown Menus
   ------------------------------------------- */

.dropdown-menu,
.dropdown-item,
[class*="dropdown"] ul,
[class*="dropdown"] li {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--premium-bg-tertiary) !important;
}

/* -------------------------------------------
   Empty States & Containers
   ------------------------------------------- */

.empty-state,
.empty-state-container,
.no-data-container {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-secondary) !important;
}

/* -------------------------------------------
   Cards with Gradients (Rental Income, etc.)
   ------------------------------------------- */

.rental-income-card,
.income-card,
.summary-card {
  background: linear-gradient(135deg, var(--premium-bg-secondary) 0%, var(--premium-bg-tertiary) 100%) !important;
  border: 1px solid var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   DataTables Specific Overrides
   ------------------------------------------- */

/* DataTables wrapper */
.dataTables_wrapper {
  background-color: transparent !important;
  color: var(--premium-text-primary) !important;
}

/* DataTables info, length, filter */
.dataTables_info,
.dataTables_length,
.dataTables_filter,
.dataTables_paginate {
  color: var(--premium-text-secondary) !important;
}

.dataTables_length select,
.dataTables_filter input {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* DataTables pagination */
.dataTables_paginate .paginate_button {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.dataTables_paginate .paginate_button:hover {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.dataTables_paginate .paginate_button.current {
  background-color: var(--premium-brand-primary) !important;
  color: #fff !important;
  border-color: var(--premium-brand-primary) !important;
}

/* DataTables sorting icons */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
  background-color: var(--premium-bg-tertiary) !important;
}

/* -------------------------------------------
   Inline Style Overrides (High Specificity)
   ------------------------------------------- */

/* Override any element with white background inline style */
*[style*="background-color: #fff"],
*[style*="background-color:#fff"],
*[style*="background-color: #ffffff"],
*[style*="background-color:#ffffff"],
*[style*="background: #fff"],
*[style*="background:#fff"],
*[style*="background: #ffffff"],
*[style*="background:#ffffff"],
*[style*="background-color: white"],
*[style*="background: white"] {
  background-color: var(--premium-bg-secondary) !important;
}

/* Override dark text on dark background */
*[style*="color: #333"],
*[style*="color:#333"],
*[style*="color: black"],
*[style*="color:black"] {
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Stock Details Page Specific
   ------------------------------------------- */

/* Upcoming dividends table */
#upcoming-dividends-table,
#upcoming-dividends-table td,
#upcoming-dividends-table th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* Dividends table in stock details */
#dividends-table,
#dividends-table td,
#dividends-table th,
.dividends-container table,
.dividends-container td,
.dividends-container th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Stock info cards */
.stock-info-card,
.stock-detail-card {
  background-color: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   AJAX Loaded Content
   ------------------------------------------- */

/* Ensure AJAX-loaded tables inherit styles */
[data-ajax-loaded] table,
[data-ajax-loaded] td,
[data-ajax-loaded] th,
.ajax-content table,
.ajax-content td,
.ajax-content th {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* -------------------------------------------
   Fix for Semi-transparent Whites
   ------------------------------------------- */

*[style*="rgba(255,255,255"],
*[style*="rgba(255, 255, 255"] {
  background-color: rgba(59, 130, 246, 0.1) !important;
}

/* -------------------------------------------
   Additional Table Fixes
   ------------------------------------------- */

/* Ensure all th elements are styled */
th {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* Ensure all td elements have proper background */
td {
  background-color: inherit;
  color: inherit;
  border-color: var(--premium-border) !important;
}

/* Table responsive wrapper */
.table-responsive {
  background-color: var(--premium-bg-secondary) !important;
}

/* Bootstrap table variants override */
.table-primary,
.table-secondary,
.table-success,
.table-danger,
.table-warning,
.table-info,
.table-light,
.table-dark {
  --bs-table-bg: var(--premium-bg-secondary);
  --bs-table-color: var(--premium-text-primary);
  --bs-table-border-color: var(--premium-border);
  --bs-table-striped-bg: var(--premium-bg-tertiary);
  --bs-table-hover-bg: var(--premium-bg-tertiary);
}

/* Fix for tables with explicit white in class */
.bg-white,
.bg-light {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Trades Widget (Stock Details Page)
   ------------------------------------------- */

.trades-widget {
  --tw-bg: var(--premium-bg-secondary) !important;
  --tw-bg-subtle: var(--premium-bg-tertiary) !important;
  --tw-text: var(--premium-text-primary) !important;
  --tw-muted: var(--premium-text-secondary) !important;
  --tw-border: var(--premium-border) !important;
  --tw-green: var(--premium-success) !important;
  --tw-green-soft: rgba(34, 197, 94, 0.15) !important;
  --tw-red: var(--premium-danger) !important;
  --tw-red-soft: rgba(239, 68, 68, 0.15) !important;
  --tw-blue: var(--premium-brand-primary) !important;
  --tw-blue-soft: rgba(59, 130, 246, 0.15) !important;
  --tw-purple: #a855f7 !important;
  --tw-purple-soft: rgba(168, 85, 247, 0.15) !important;
}

.trades-widget .trades-card {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.trades-widget .trade-item {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.trades-widget .trade-item:hover {
  background: var(--premium-bg-tertiary) !important;
}

.trades-widget .trades-list {
  background: var(--premium-bg-secondary) !important;
}

.trades-widget .trades-header {
  border-color: var(--premium-border) !important;
}

.trades-widget .trades-title {
  color: var(--premium-text-primary) !important;
}

.trades-widget .trades-count {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-secondary) !important;
}

.trades-widget .trades-empty {
  color: var(--premium-text-muted) !important;
}

/* -------------------------------------------
   Dividends Section (Stock Details)
   ------------------------------------------- */

/* Dividend cards and containers */
.dividend-section,
.dividends-widget,
.dividend-container {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

/* Dividend summary cards */
.dividend-summary-card,
.dividend-stat-card {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

/* Yearly aggregated dividends */
.yearly-dividends,
.yearly-dividends-container,
#yearly-dividends-chart {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* Historical dividends */
.historical-dividends,
.historical-dividends-container {
  background: var(--premium-bg-secondary) !important;
}

/* Dividend total row - ensure visible text */
.dividend-total,
.total-row,
tr.total,
.totals-row {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  font-weight: 600 !important;
}

/* Fix for any dark text on dark background in dividend sections */
.dividend-amount,
.dividend-value,
.dividend-yield {
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Historical Split Corporate Actions
   ------------------------------------------- */

.corporate-actions,
.corporate-actions-section,
.split-history,
.split-history-section {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 0.75rem;
  padding: 1rem;
}

.corporate-actions h5,
.corporate-actions h6,
.split-history h5,
.split-history h6 {
  color: var(--premium-text-primary) !important;
}

/* Corporate action items */
.corporate-action-item,
.split-item {
  background: var(--premium-bg-tertiary) !important;
  border: 1px solid var(--premium-border) !important;
  border-radius: 0.5rem;
  padding: 0.75rem;
  margin-bottom: 0.5rem;
}

.corporate-action-item:hover,
.split-item:hover {
  background: var(--premium-bg-elevated) !important;
}

/* -------------------------------------------
   Additional Stock Details Fixes
   ------------------------------------------- */

/* Tab content panes */
.tab-content,
.tab-pane {
  background: transparent !important;
  color: var(--premium-text-primary) !important;
}

/* Info sections */
.stock-info,
.info-section,
.details-section {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* News section */
.news-section,
.news-card,
#news-container {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

.news-title {
  color: var(--premium-text-primary) !important;
}

/* Price display */
.price-display,
.current-price {
  color: var(--premium-text-primary) !important;
}

/* Upgrade message */
#upgrade-message-container .card {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

/* -------------------------------------------
   Dashboard Specific Overrides
   ------------------------------------------- */

/* Portfolio summary cards */
.portfolio-summary,
.summary-widget,
.portfolio-card {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
}

/* Value displays */
.value-large,
.portfolio-value,
.total-value {
  color: var(--premium-text-primary) !important;
}

/* Sector/allocation charts */
.sector-chart,
.allocation-chart,
.pie-chart-container {
  background: var(--premium-bg-secondary) !important;
}

/* Holdings list */
.holdings-list,
.stock-list {
  background: var(--premium-bg-secondary) !important;
}

.holdings-item,
.stock-item {
  border-color: var(--premium-border) !important;
}

.holdings-item:hover,
.stock-item:hover {
  background: var(--premium-bg-tertiary) !important;
}

/* -------------------------------------------
   Input Groups & Search
   ------------------------------------------- */

.input-group-text {
  background-color: var(--premium-bg-elevated) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-secondary) !important;
}

.search-box,
.search-input {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Badges & Labels
   ------------------------------------------- */

.badge-light {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.label,
.tag {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-secondary) !important;
  border: 1px solid var(--premium-border) !important;
}

/* -------------------------------------------
   Charts - Override any light backgrounds
   ------------------------------------------- */

.chart-container,
.chart-wrapper,
.chartjs-render-monitor {
  background: var(--premium-bg-secondary) !important;
}

/* Chart.js tooltip */
.chartjs-tooltip {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-primary) !important;
  border: 1px solid var(--premium-border) !important;
}

/* -------------------------------------------
   Ensure Body Classes Trigger Premium Dark
   ------------------------------------------- */

/* For pages using body.premium-dark-theme class */
body.premium-dark-theme {
  background: linear-gradient(135deg, var(--premium-bg-primary) 0%, #0a0e14 100%) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Navbar Fixes
   ------------------------------------------- */

.navbar,
.navbar-dark,
.bg-dark {
  background-color: var(--premium-bg-secondary) !important;
  border-bottom: 1px solid var(--premium-border) !important;
}

.navbar-brand,
.navbar-nav .nav-link {
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Footer Fixes
   ------------------------------------------- */

.footer,
.main-footer,
#portfolio_footer {
  background-color: var(--premium-bg-secondary) !important;
  border-top: 1px solid var(--premium-border) !important;
  color: var(--premium-text-secondary) !important;
}

/* -------------------------------------------
   Sidebar/Navigation
   ------------------------------------------- */

.sidebar,
.side-nav,
.nav-sidebar {
  background-color: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.sidebar .nav-link,
.side-nav a {
  color: var(--premium-text-secondary) !important;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* -------------------------------------------
   Text Rendering & Anti-aliasing
   ------------------------------------------- */

/* Ensure crisp text rendering */
body,
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Fix for blurry text in brand names */
.webpage-name,
.navbar-brand,
.brand-name {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* Preserve the original brand "View" color - do NOT override #6fa7db */
/* This color is intentional for the AllInvestView branding */

/* -------------------------------------------
   Force dark-theme class to trigger Premium Dark
   ------------------------------------------- */

/* Ensure .dark-theme body gets Premium Dark variables */
body.premium-dark-theme {
  --bs-body-bg: var(--premium-bg-primary);
  --bs-body-color: var(--premium-text-primary);
  --bs-card-bg: var(--premium-bg-secondary);
  --bs-border-color: var(--premium-border);
  background: linear-gradient(135deg, var(--premium-bg-primary) 0%, #0a0e14 100%) !important;
  color: var(--premium-text-primary) !important;
}

/* =============================================
   Portfolio Insights Section (Dashboard)
   ============================================= */

/* Add missing Bootstrap CSS variables used by Portfolio Insights */
:root {
  --bs-secondary-color: var(--premium-text-secondary);
  --hint-fg: var(--premium-text-secondary);
  --hint-bg: var(--premium-bg-tertiary);
}

/* Portfolio Insights section styling */
#pd2-section {
  --bs-secondary-color: var(--premium-text-secondary) !important;
  --bs-secondary-bg: var(--premium-bg-secondary) !important;
  --hint-fg: var(--premium-text-secondary);
  --hint-bg: var(--premium-bg-tertiary);
}

#pd2-section .pd2-wrap {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-title {
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-subtle {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-card {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

#pd2-section .pd2-kpi {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

#pd2-section .pd2-kpi h4 {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-kpi .pd2-val {
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-kpi .pd2-sub {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-stat {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

#pd2-section .pd2-stat .pd2-label {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-stat .pd2-value {
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-sub {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-metric {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

#pd2-section .pd2-metric h5 {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-metric .pd2-big {
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-hint {
  background: var(--premium-bg-elevated) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-toggle {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-toggle:hover {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-primary) !important;
}

#pd2-section .pd2-i {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-muted) !important;
}

#pd2-section .pd2-chip {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-legend {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-skel {
  background: var(--premium-bg-elevated) !important;
}

#pd2-section .pd2-bar {
  background: var(--premium-bg-elevated) !important;
}

#pd2-section .pd2-vol-row {
  color: var(--premium-text-secondary) !important;
}

#pd2-section .pd2-pill {
  color: var(--premium-text-muted) !important;
}

/* Color states for Portfolio Insights */
#pd2-section .pd2-up {
  color: var(--premium-success) !important;
}

#pd2-section .pd2-down {
  color: var(--premium-danger) !important;
}

#pd2-section .pd2-muted {
  color: var(--premium-text-muted) !important;
}

/* Ensure text-success and text-danger work */
#pd2-section .text-success {
  color: var(--premium-success) !important;
}

#pd2-section .text-danger {
  color: var(--premium-danger) !important;
}

#pd2-section .text-secondary {
  color: var(--premium-text-secondary) !important;
}

/* =============================================
   Upcoming Coupons & Capital Section (Dashboard.html)
   ============================================= */

/* Fix text-dark class for bond details */
.text-dark {
  color: var(--premium-text-primary) !important;
}

/* Timeline entries */
#timeline-container {
  background: transparent !important;
}

#timeline-container > div {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

#timeline-container .text-dark,
#timeline-container .fw-medium {
  color: var(--premium-text-primary) !important;
}

/* Filter controls in coupons section */
.bg-light {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* Filter input */
#filter-months {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

/* =============================================
   Profile Page Premium Dark Theme
   ============================================= */

/* Override profile variables for premium dark */
body.premium-dark-theme {
  --profile-card-bg: var(--premium-bg-secondary);
  --profile-card-border: var(--premium-border);
  --profile-text-primary: var(--premium-text-primary);
  --profile-text-secondary: var(--premium-text-secondary);
  --profile-bg-subtle: var(--premium-bg-tertiary);
  --profile-hover-bg: var(--premium-bg-elevated);
  --profile-accent: var(--premium-brand-primary);
  --profile-accent-hover: var(--premium-brand-primary-hover);
  --profile-accent-light: rgba(59, 130, 246, 0.15);
}

.profile-section {
  background: transparent !important;
}

.profile-section .card,
.profile-section .card.profile-card {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

.profile-section .card-body {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

.profile-section .nav-link {
  color: var(--premium-text-secondary) !important;
}

.profile-section .nav-link:hover {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.profile-section .nav-link.active {
  background: var(--premium-brand-primary) !important;
  color: #fff !important;
}

.profile-section .form-control {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

.profile-section .form-control:focus {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-brand-primary) !important;
  color: var(--premium-text-primary) !important;
}

.profile-section label {
  color: var(--premium-text-secondary) !important;
}

.profile-section h5,
.profile-section h6 {
  color: var(--premium-text-primary) !important;
}

.profile-section .text-muted {
  color: var(--premium-text-secondary) !important;
}

.profile-section .tab-content .card {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

/* Theme selector cards in profile */
.theme-option-card {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

.theme-option-card:hover {
  border-color: var(--premium-brand-primary) !important;
}

.theme-option-card.selected {
  border-color: var(--premium-brand-primary) !important;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3) !important;
}

/* =============================================
   ETF Holdings Section (stock_details.html)
   ============================================= */

/* ETF card variables override */
.etf-card {
  --etf-surface: var(--premium-bg-secondary) !important;
  --etf-text: var(--premium-text-primary) !important;
  --etf-muted: var(--premium-text-secondary) !important;
  --etf-border: var(--premium-border) !important;
  --etf-border-strong: var(--premium-border) !important;
  --etf-accent: var(--premium-brand-primary) !important;
  --surface: var(--premium-bg-secondary);
  --text: var(--premium-text-primary);
  --muted: var(--premium-text-secondary);
  --border: var(--premium-border);
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

.etf-card .etf-toolbar {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .etf-title {
  color: var(--premium-text-primary) !important;
}

.etf-card .etf-subtitle {
  color: var(--premium-text-secondary) !important;
}

.etf-card .chip {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-secondary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .input-wrap {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card input,
.etf-card #etf-search {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .btn,
.etf-card .btn-ghost {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .btn:hover,
.etf-card .btn-ghost:hover {
  background: var(--premium-bg-elevated) !important;
}

.etf-card .etf-table-wrap {
  background: var(--premium-bg-secondary) !important;
}

.etf-card .etf-table {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

.etf-card .etf-table thead {
  background: var(--premium-bg-tertiary) !important;
}

.etf-card .etf-table th {
  background: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .etf-table td {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .etf-table tbody tr:hover td {
  background: var(--premium-bg-tertiary) !important;
}

.etf-card .etf-footer {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .muted {
  color: var(--premium-text-secondary) !important;
}

.etf-card .etf-empty {
  background: var(--premium-bg-secondary) !important;
  color: var(--premium-text-secondary) !important;
}

.etf-card .filter-panel {
  background: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

.etf-card .chips .chip {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-secondary) !important;
}

.etf-card .chips .chip.active {
  background: var(--premium-brand-primary) !important;
  color: #fff !important;
}

/* =============================================
   Calendar Date Pickers (Header From/To)
   ============================================= */

/* Dashboard date picker card containers */
#displayStartDateButton,
#displayEndDateButton {
  color: var(--premium-text-primary) !important;
}

/* The "From" and "To" labels - override inline color: #333 */
#displayStartDateButton strong,
#displayEndDateButton strong {
  color: var(--premium-text-primary) !important;
}

/* The date text inside the buttons */
#displayStartDateButton span,
#displayEndDateButton span {
  color: var(--premium-text-primary) !important;
}

/* Calendar icons */
#displayStartDateButton .fa-calendar-alt,
#displayEndDateButton .fa-calendar-alt {
  color: var(--premium-text-secondary) !important;
}

/* The card containers holding the date buttons - override inline bg #f9f9f9 */
#displayStartDateButton:closest(.card),
#displayEndDateButton:closest(.card) {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

/* Target parent cards by their context */
.card:has(#displayStartDateButton),
.card:has(#displayEndDateButton) {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

/* Fallback: target all small date picker cards in the header area */
form .card[style*="background-color: #f9f9f9"],
form .card[style*="background-color:#f9f9f9"] {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
}

/* Date input fields */
input[type="date"],
input[type="datetime-local"],
.date-picker,
#custom_start,
#custom_end,
#customStartDate,
#customEndDate,
[name="custom_start"],
[name="custom_end"],
[name="custom_start_date"],
[name="custom_today_date"] {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

input[type="date"]:focus,
input[type="datetime-local"]:focus {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-brand-primary) !important;
}

/* Date picker labels */
label[for="custom_start"],
label[for="custom_end"],
label[for="customStartDate"],
label[for="customEndDate"],
.date-label,
.filter-label {
  color: var(--premium-text-secondary) !important;
}

/* Date range container */
.date-range-container,
.date-filter-container,
.date-picker-wrapper {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

/* Flatpickr date picker (if used) */
.flatpickr-calendar {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
  box-shadow: var(--premium-shadow-lg) !important;
}

.flatpickr-day {
  color: var(--premium-text-primary) !important;
}

.flatpickr-day:hover {
  background: var(--premium-bg-tertiary) !important;
}

.flatpickr-day.selected {
  background: var(--premium-brand-primary) !important;
  color: #fff !important;
}

.flatpickr-months,
.flatpickr-weekdays {
  background: var(--premium-bg-tertiary) !important;
}

.flatpickr-month,
.flatpickr-current-month,
.flatpickr-weekday {
  color: var(--premium-text-primary) !important;
}

/* Bootstrap datepicker (if used) */
.datepicker {
  background: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.datepicker table {
  background: var(--premium-bg-secondary) !important;
}

.datepicker td,
.datepicker th {
  color: var(--premium-text-primary) !important;
}

.datepicker td:hover {
  background: var(--premium-bg-tertiary) !important;
}

.datepicker td.active {
  background: var(--premium-brand-primary) !important;
  color: #fff !important;
}

/* =============================================
   Additional Global Fixes
   ============================================= */

/* Ensure all text-dark elements are visible */
.text-dark,
.fw-medium.text-dark {
  color: var(--premium-text-primary) !important;
}

/* Fix any remaining bg-white elements */
.bg-white {
  background-color: var(--premium-bg-secondary) !important;
}

/* Fix text-black elements */
.text-black {
  color: var(--premium-text-primary) !important;
}

/* =============================================
   Stock Table - Name Column Fixes
   ============================================= */

/* Stock table name column text color - high specificity */
.stocktablename,
.stocktablename2,
.stocktablename3,
span.stocktablename2,
span.stocktablename3,
td .stocktablename2,
td .stocktablename3 {
  color: var(--premium-text-primary) !important;
}

/* Fix the white fade gradient on stocktablename2 - CRITICAL */
/* This overrides the inline style that uses --bs-body-bg-rgb with white fallback */
.stocktablename2::before,
span.stocktablename2::before,
td .stocktablename2::before {
  background: linear-gradient(
    to right,
    rgba(22, 27, 34, 0) 0%,
    rgba(22, 27, 34, 1) 75%
  ) !important;
}

/* Sticky name column - header */
#stock-table thead th.sticky-name-col,
#stock-table thead th.stocktablename,
#stock-table_wrapper .dtfc-fixed-left thead th.stock-name-col,
#stock-table_wrapper .dataTables_scrollHead th.stock-name-col,
table#stock-table thead th.sticky-name-col {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* Sticky name column - body cells */
#stock-table tbody td.sticky-name-col,
#stock-table tbody td.stocktablename,
#stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col,
#stock-table_wrapper .dataTables_scrollBody td.stock-name-col,
table#stock-table tbody td.sticky-name-col {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* FixedColumns extension - ensure proper background */
#stock-table_wrapper .dtfc-fixed-left,
#stock-table_wrapper .dtfc-fixed-left table {
  background-color: transparent !important;
}

/* Disable animations on sticky columns for smooth scrolling */
#stock-table_wrapper .stock-name-col,
#stock-table_wrapper .dtfc-fixed-left .stock-name-col {
  transition: none !important;
}

/* Override any .dark-theme styles that might conflict */
.dark-theme .stocktablename2::before,
body .stocktablename2::before {
  background: linear-gradient(
    to right,
    rgba(22, 27, 34, 0) 0%,
    rgba(22, 27, 34, 1) 75%
  ) !important;
}

/* CRITICAL: Override .dark-theme rules from Dashboard_stocks.html for Premium Dark */
/* These use html.dark selector (set when Premium Dark is active) to override any conflicting rules */
/* Also cover cases where .dark-theme class might be on body or dataTables wrapper */
html.dark #stock-table_wrapper .dataTables_scrollBody td.stock-name-col,
html.dark #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col,
html.dark .dark-theme #stock-table_wrapper .dataTables_scrollBody td.stock-name-col,
html.dark .dark-theme #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col,
html.dark body.dark-theme #stock-table_wrapper .dataTables_scrollBody td.stock-name-col,
html.dark body.dark-theme #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col,
.dark-theme #stock-table_wrapper .dataTables_scrollBody td.stock-name-col,
.dark-theme #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col,
#stock-table_wrapper.dark-theme .dataTables_scrollBody td.stock-name-col,
#stock-table_wrapper.dark-theme .dtfc-fixed-left tbody td.stock-name-col {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
}

/* Also override the hover states */
html.dark #stock-table_wrapper .dataTables_scrollBody td.stock-name-col:hover,
html.dark #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col:hover,
html.dark .dark-theme #stock-table_wrapper .dataTables_scrollBody td.stock-name-col:hover,
html.dark .dark-theme #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col:hover,
.dark-theme #stock-table_wrapper .dataTables_scrollBody td.stock-name-col:hover,
.dark-theme #stock-table_wrapper .dtfc-fixed-left tbody td.stock-name-col:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Row hover - ensure name column matches row hover color */
html.dark #stock-table tbody tr:hover td.stock-name-col,
html.dark .dark-theme #stock-table tbody tr:hover td.stock-name-col,
html.dark #stock-table_wrapper .dtfc-fixed-left tbody tr:hover td.stock-name-col,
html.dark .dark-theme #stock-table_wrapper .dtfc-fixed-left tbody tr:hover td.stock-name-col,
.dark-theme #stock-table tbody tr:hover td.stock-name-col,
.dark-theme #stock-table_wrapper .dtfc-fixed-left tbody tr:hover td.stock-name-col {
  background-color: var(--premium-bg-tertiary) !important;
}

/* Table header styling */
#stock-table_wrapper .table-light th {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* CRITICAL: Override .dark-theme header rules for Premium Dark */
/* Header name column - override the old dark mode grey (#343a40) */
html.dark #stock-table_wrapper .dataTables_scrollHead th.stock-name-col,
html.dark #stock-table_wrapper .dtfc-fixed-left thead th.stock-name-col,
html.dark .dark-theme #stock-table_wrapper .dataTables_scrollHead th.stock-name-col,
html.dark .dark-theme #stock-table_wrapper .dtfc-fixed-left thead th.stock-name-col,
.dark-theme #stock-table_wrapper .dataTables_scrollHead th.stock-name-col,
.dark-theme #stock-table_wrapper .dtfc-fixed-left thead th.stock-name-col,
#stock-table_wrapper.dark-theme .dataTables_scrollHead th.stock-name-col,
#stock-table_wrapper.dark-theme .dtfc-fixed-left thead th.stock-name-col,
.dark-theme #stock-table_wrapper .table-light th,
.dark-theme #stock-table_wrapper thead th {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* FixedColumns header clone */
#stock-table_wrapper .dtfc-fixed-left thead th {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

/* =============================================
   Dashboard Premium Dark Theme Enhancements
   ============================================= */

/* --- Dashboard Card Text Visibility --- */
/* Make text-muted more visible in dashboard cards */
.card .text-muted,
.card-body .text-muted,
.gutter-b .text-muted {
  color: var(--premium-text-secondary) !important;
}

/* Card text styling for better visibility */
.card .card-text {
  color: var(--premium-text-secondary) !important;
}

/* Font weight bold elements inside cards */
.card strong,
.card .font-weight-bold,
.card-body strong,
.card-body .font-weight-bold {
  color: var(--premium-text-primary) !important;
}

/* Info icons in cards */
.card .fa-info-circle,
.card .fa-question-circle {
  color: var(--premium-text-muted) !important;
}

/* --- Return Colors (Green/Red) with Better Visibility --- */
/* Make text-success brighter for premium dark */
.text-success {
  color: #22c55e !important;
}

/* Make text-danger brighter for premium dark */
.text-danger {
  color: #ef4444 !important;
}

/* Specific styling for return values with inline color styles */
span[style*="color: #4CAF50"],
span[style*="color:#4CAF50"] {
  color: #22c55e !important;
}

span[style*="color: #F44336"],
span[style*="color:#F44336"] {
  color: #ef4444 !important;
}

/* Arrow indicators */
.text-success span,
span.text-success {
  color: #22c55e !important;
}

.text-danger span,
span.text-danger {
  color: #ef4444 !important;
}

/* Icons with green/red colors */
i[style*="color: green"],
i[style*="color:green"],
.fa-arrow-up[style*="color: green"] {
  color: #22c55e !important;
}

i[style*="color: red"],
i[style*="color:red"],
.fa-arrow-down[style*="color: red"] {
  color: #ef4444 !important;
}

/* --- Asset Allocation Progress Bars --- */
/* Dashboard allocation progress bar containers - only change the background track color */
/* Don't override height - let it use the inline style from HTML */
.progress[style*="position: relative"],
.progress[style*="position:relative"],
.clickable .progress,
tr.category .progress,
tr[data-category] .progress {
  background-color: #374151 !important; /* Visible gray background for progress track */
}

/* Don't override progress bar colors - let them use dynamic colors from the chart */
/* Only provide fallback if no inline style is set */

/* Allocation section text colors */
.category td,
.category td div,
tr[data-category] td {
  color: var(--premium-text-primary) !important;
}

/* Allocation percentage and invested text */
tr[data-category] td div[style*="color: #555"],
tr[data-category] td div[style*="color: #777"],
tr[data-category] td span[style*="color: #777"] {
  color: var(--premium-text-secondary) !important;
}

/* Allocation category names */
tr[data-category] td div[style*="font-weight: bold"] {
  color: var(--premium-text-primary) !important;
}

/* --- Watchlist Card Styling --- */
.watchlist-card {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
}

.watchlist-card:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

.watchlist-card .card-title {
  color: var(--premium-text-primary) !important;
}

.watchlist-card .text-muted {
  color: var(--premium-text-secondary) !important;
}

/* Watchlist price and change labels */
.watchlist-card span.text-muted {
  color: var(--premium-text-secondary) !important;
}

/* --- Upcoming Events Dropdown Styling --- */
.dropdown-menu {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  box-shadow: var(--premium-shadow-lg) !important;
}

.dropdown-item {
  color: var(--premium-text-primary) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-link) !important;
}

.dropdown-header {
  color: var(--premium-text-muted) !important;
}

.dropdown-divider {
  border-color: var(--premium-border) !important;
}

/* Custom dropdown toggle */
.custom-dropdown-toggle {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.custom-dropdown-toggle:hover,
.custom-dropdown-toggle:focus {
  background-color: var(--premium-bg-elevated) !important;
  color: var(--premium-text-link) !important;
  border-color: var(--premium-brand-primary) !important;
}

/* --- Stock Performance Table Enhancements --- */
/* ISIN/Ticker column - make it more visible */
.stocktablename2,
.stocktablename3 {
  color: var(--premium-text-link) !important;
}

/* Stock name cell text */
td .stocktablename,
td .stocktablename2,
td .stocktablename3 {
  color: var(--premium-text-link) !important;
}

/* Initial nominal and other muted table cells */
td.text-muted,
.initial_nominal,
td.initial_nominal {
  color: var(--premium-text-secondary) !important;
}

/* Table text styling */
#stock-table td {
  color: var(--premium-text-primary);
}

#stock-table td.text-muted,
#stock-table .text-muted {
  color: var(--premium-text-secondary) !important;
}

/* IRR value styling */
.irr-value.text-success {
  color: #22c55e !important;
}

.irr-value.text-danger {
  color: #ef4444 !important;
}

/* Return cells */
.realized_return.text-success,
.capital_return.text-success,
td.text-success {
  color: #22c55e !important;
}

.realized_return.text-danger,
.capital_return.text-danger,
td.text-danger {
  color: #ef4444 !important;
}

/* Current price in stock table */
.stocktablename3.text-muted.fw-bold {
  color: var(--premium-text-primary) !important;
}

/* Numeric values in stock table should NOT be link color */
/* Current Value, Market Value numbers should be regular text */
.numeric-value.stocktablename3,
.current_value .numeric-value,
.current_value .stocktablename3,
td.current_value .stocktablename3 {
  color: var(--premium-text-primary) !important;
}

/* Currency labels next to numeric values */
.current_value .currency,
td.current_value .currency.stocktablename3 {
  color: var(--premium-text-secondary) !important;
}

/* --- Dashboard Top Cards Additional Styling --- */
/* Growth Rate card text */
#bond-growth-display,
#growth-display,
.card-text.text-muted {
  color: var(--premium-text-secondary) !important;
}

/* Metric labels */
.font-size-md.font-weight-bold,
#metric-label {
  color: var(--premium-text-primary) !important;
}

/* Symbol icons background */
.symbol-light-info,
.symbol-light-primary,
.symbol-light-success,
.symbol-light-warning {
  background-color: transparent !important;
}

/* --- Tooltip styling --- */
.tooltip-content,
.info-tooltip::after {
  background-color: var(--premium-bg-elevated) !important;
  color: var(--premium-text-primary) !important;
  border: 1px solid var(--premium-border) !important;
}

.aiv-tooltip {
  background: var(--premium-bg-elevated) !important;
  color: var(--premium-text-primary) !important;
  border: 1px solid var(--premium-border) !important;
}

/* --- Calendar/Dividend Calendar --- */
.calendar-day-header {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.calendar-cell {
  background-color: var(--premium-bg-secondary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.calendar-cell:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

.calendar-cell div {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
}

.calendar-cell div:hover {
  background-color: var(--premium-bg-elevated) !important;
}

/* --- Custom Tabs Styling --- */
.custom-tabs {
  border-bottom-color: var(--premium-border) !important;
}

.custom-tabs .nav-link {
  color: var(--premium-text-secondary) !important;
}

.custom-tabs .nav-link:hover {
  color: var(--premium-text-primary) !important;
  background-color: var(--premium-bg-tertiary) !important;
}

.custom-tabs .nav-link.active {
  color: var(--premium-text-primary) !important;
  background-color: var(--premium-bg-secondary) !important;
  border-bottom-color: var(--premium-brand-primary) !important;
}

/* --- Table Hover States --- */
.table tr:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

/* --- Elegant Card Styling --- */
.elegant-card {
  background: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
  box-shadow: var(--premium-shadow-sm) !important;
}

.elegant-card:hover {
  box-shadow: var(--premium-shadow-md) !important;
}

.elegant-card .card-header {
  background: var(--premium-bg-tertiary) !important;
  border-bottom: 1px solid var(--premium-border) !important;
}

/* --- Form Inputs in Cards --- */
#manualGrowthRateInput {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

/* --- Welcome Overlay --- */
.welcome-overlay {
  background: linear-gradient(to bottom, rgba(13, 17, 23, 0) 0%, rgba(13, 17, 23, 0.9) 100%) !important;
}

/* --- Target Year Message --- */
.target-year-message-content {
  background-color: var(--premium-bg-tertiary) !important;
  color: var(--premium-text-primary) !important;
  border-color: var(--premium-border) !important;
}

.target-year-message-content span {
  color: var(--premium-brand-primary) !important;
}

/* --- Suggestions Dropdown --- */
.suggestions-dropdown {
  background-color: var(--premium-bg-secondary) !important;
  border-color: var(--premium-border) !important;
}

.suggestion-item {
  color: var(--premium-text-primary) !important;
}

.suggestion-item:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

.suggestions-dropdown-item.selected {
  background-color: var(--premium-brand-primary) !important;
  color: #fff !important;
}

/* --- Card Clickable Hover --- */
.card-clickable:hover {
  background-color: var(--premium-bg-tertiary) !important;
}

/* --- Net Worth Projection --- */
.net-worth-projection-container {
  background-color: var(--premium-bg-secondary) !important;
  border: 1px solid var(--premium-border) !important;
}

.input-field {
  background-color: var(--premium-bg-tertiary) !important;
  border-color: var(--premium-border) !important;
  color: var(--premium-text-primary) !important;
}

.input-field:focus {
  border-color: var(--premium-brand-primary) !important;
}

.input-label {
  color: var(--premium-text-primary) !important;
}