/* ==========================================================================
   ApexMint - ag_grid_theme.css
   Override AG Grid Alpine dark/light themes to use our CSS variables.
   All colour references use var(--*) so they update automatically on
   theme toggle without any JS intervention.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Dark mode - .ag-theme-alpine-dark
   -------------------------------------------------------------------------- */
.ag-theme-alpine-dark {
  --ag-background-color:           var(--bg-card);
  --ag-foreground-color:           var(--text-primary);
  --ag-secondary-foreground-color: var(--text-secondary);
  --ag-header-background-color:    var(--bg-elevated);
  --ag-header-foreground-color:    var(--text-secondary);
  --ag-odd-row-background-color:   var(--bg-card);
  --ag-row-hover-color:            var(--bg-elevated);
  --ag-selected-row-background-color: rgba(88, 166, 255, 0.12);
  --ag-border-color:               var(--border);
  --ag-row-border-color:           var(--border);
  --ag-cell-horizontal-border:     none;
  --ag-range-selection-border-color: var(--accent);
  --ag-input-focus-border-color:   var(--accent);
  --ag-checkbox-checked-color:     var(--accent);
  --ag-checkbox-unchecked-color:   var(--border);
  --ag-checkbox-indeterminate-color: var(--accent);
  --ag-chip-background-color:      var(--bg-elevated);
  --ag-modal-overlay-background-color: rgba(0, 0, 0, 0.6);
  --ag-icon-color:                 var(--text-secondary);
  --ag-disabled-foreground-color:  var(--text-secondary);
  --ag-font-family:                'Inter', -apple-system, sans-serif;
  --ag-font-size:                  13px;
  --ag-grid-size:                  4px;
  --ag-header-height:              40px;
  --ag-row-height:                 38px;
  --ag-cell-horizontal-padding:    12px;
  --ag-borders:                    solid 1px;
  --ag-border-radius:              0;
  --ag-wrapper-border-radius:      8px;
}

/* Remove default Alpine-dark outline on focused cells */
.ag-theme-alpine-dark .ag-cell:focus-within {
  border-color: var(--accent) !important;
  outline: none;
}

.ag-theme-alpine-dark .ag-header-cell {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ag-theme-alpine-dark .ag-header-cell-text {
  color: var(--text-secondary);
}

.ag-theme-alpine-dark .ag-paging-panel {
  background-color: var(--bg-elevated);
  border-top: 1px solid var(--border);
  color: var(--text-secondary);
  font-size: 0.75rem;
}

.ag-theme-alpine-dark .ag-paging-button {
  color: var(--accent);
}

.ag-theme-alpine-dark .ag-paging-button.ag-disabled {
  color: var(--text-secondary);
}

/* Loading overlay */
.ag-theme-alpine-dark .ag-overlay-loading-wrapper {
  background-color: rgba(13, 17, 23, 0.8);
}

.ag-theme-alpine-dark .ag-overlay-loading-center {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  color: var(--text-primary);
  padding: 16px 24px;
}

/* No rows overlay */
.ag-theme-alpine-dark .ag-overlay-no-rows-center {
  color: var(--text-secondary);
  font-size: 0.875rem;
}

/* Row selection highlight */
.ag-theme-alpine-dark .ag-row-selected {
  background-color: rgba(88, 166, 255, 0.1) !important;
}

/* Column resize handle */
.ag-theme-alpine-dark .ag-header-cell-resize::after {
  background-color: var(--border);
}

/* Sort icons */
.ag-theme-alpine-dark .ag-sort-ascending-icon,
.ag-theme-alpine-dark .ag-sort-descending-icon {
  color: var(--accent);
}

/* --------------------------------------------------------------------------
   Light mode - .ag-theme-alpine
   -------------------------------------------------------------------------- */
.ag-theme-alpine {
  --ag-background-color:           var(--bg-card);
  --ag-foreground-color:           var(--text-primary);
  --ag-secondary-foreground-color: var(--text-secondary);
  --ag-header-background-color:    var(--bg-elevated);
  --ag-header-foreground-color:    var(--text-secondary);
  --ag-odd-row-background-color:   var(--bg-card);
  --ag-row-hover-color:            var(--bg-elevated);
  --ag-selected-row-background-color: rgba(9, 105, 218, 0.08);
  --ag-border-color:               var(--border);
  --ag-row-border-color:           var(--border);
  --ag-cell-horizontal-border:     none;
  --ag-range-selection-border-color: var(--accent);
  --ag-input-focus-border-color:   var(--accent);
  --ag-checkbox-checked-color:     var(--accent);
  --ag-checkbox-unchecked-color:   var(--border);
  --ag-chip-background-color:      var(--bg-elevated);
  --ag-icon-color:                 var(--text-secondary);
  --ag-disabled-foreground-color:  var(--text-secondary);
  --ag-font-family:                'Inter', -apple-system, sans-serif;
  --ag-font-size:                  13px;
  --ag-grid-size:                  4px;
  --ag-header-height:              40px;
  --ag-row-height:                 38px;
  --ag-cell-horizontal-padding:    12px;
  --ag-borders:                    solid 1px;
  --ag-border-radius:              0;
  --ag-wrapper-border-radius:      8px;
}

.ag-theme-alpine .ag-header-cell {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ag-theme-alpine .ag-header-cell-text {
  color: var(--text-secondary);
}

.ag-theme-alpine .ag-paging-panel {
  background-color: var(--bg-elevated);
  border-top: 1px solid var(--border);
  color: var(--text-secondary);
  font-size: 0.75rem;
}

.ag-theme-alpine .ag-row-selected {
  background-color: rgba(9, 105, 218, 0.06) !important;
}

.ag-theme-alpine .ag-sort-ascending-icon,
.ag-theme-alpine .ag-sort-descending-icon {
  color: var(--accent);
}

/* --------------------------------------------------------------------------
   Shared: theme-agnostic tweaks applied to both themes
   -------------------------------------------------------------------------- */

/* Suppress the outer box-shadow Dash injects on ag-grid wrapper */
.ag-theme-alpine-dark .ag-root-wrapper,
.ag-theme-alpine .ag-root-wrapper {
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}

/* Cell renderers - recommendation badges inside grid cells */
.ag-theme-alpine-dark .ag-cell .af-badge,
.ag-theme-alpine .ag-cell .af-badge {
  margin: auto 0;
}

/* Ticker column */
.ag-theme-alpine-dark .ag-cell .ticker-text,
.ag-theme-alpine .ag-cell .ticker-text {
  font-size: 0.8rem;
}

/* Confidence bar inside cells */
.ag-theme-alpine-dark .conf-bar-wrap,
.ag-theme-alpine .conf-bar-wrap {
  padding: 0;
}