/* ─────────────────────────────────────────────────────────────
   Angular Material — theme overrides using global CSS variables
   ───────────────────────────────────────────────────────────── */

/* ── Card ─────────────────────────────────────────────────── */
.mat-mdc-card {
  --mdc-elevated-card-container-color: var(--card) !important;
  --mdc-outlined-card-container-color: var(--card) !important;
  color: var(--text) !important;
}

/* ── List / Nav List ───────────────────────────────────────── */
.mat-mdc-list-base,
.mat-mdc-nav-list {
  --mdc-list-list-item-container-color: transparent !important;
  --mdc-list-list-item-label-text-color: var(--text) !important;
  --mdc-list-list-item-supporting-text-color: var(--muted) !important;
  --mdc-list-list-item-hover-state-layer-color: var(--glass) !important;
  --mdc-list-list-item-focus-state-layer-color: var(--glass) !important;
  background: transparent !important;
}

.mat-mdc-list-item,
.mat-mdc-nav-list .mat-mdc-list-item {
  color: var(--text) !important;
}

/* ── Button ────────────────────────────────────────────────── */
.mat-mdc-button,
.mat-mdc-icon-button,
.mat-mdc-outlined-button {
  --mdc-text-button-label-text-color: var(--text) !important;
  --mdc-icon-button-icon-color: var(--text) !important;
  color: var(--text) !important;
}

.mat-mdc-raised-button:not([color]),
.mat-mdc-unelevated-button:not([color]) {
  --mdc-filled-button-container-color: var(--card) !important;
  --mdc-filled-button-label-text-color: var(--text) !important;
}

/* ── Select ────────────────────────────────────────────────── */
.mat-mdc-select {
  --mat-select-trigger-text-color: var(--text) !important;
  --mat-select-panel-background-color: var(--panel) !important;
  color: var(--text) !important;
}

.mat-mdc-select-panel {
  background: var(--panel) !important;
}

.mat-mdc-option {
  --mat-option-label-text-color: var(--text) !important;
  --mat-option-hover-state-layer-color: var(--glass) !important;
  --mat-option-focus-state-layer-color: var(--glass) !important;
  color: var(--text) !important;
}

.mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) {
  --mat-option-selected-state-label-text-color: var(--primary) !important;
  color: var(--primary) !important;
}

/* ── Form Field ────────────────────────────────────────────── */
.mat-mdc-form-field {
  --mdc-filled-text-field-container-color: var(--card) !important;
  --mdc-filled-text-field-label-text-color: var(--muted) !important;
  --mdc-filled-text-field-input-text-color: var(--text) !important;
  --mdc-outlined-text-field-label-text-color: var(--muted) !important;
  --mdc-outlined-text-field-input-text-color: var(--text) !important;
  --mdc-outlined-text-field-outline-color: var(--muted) !important;
  --mdc-outlined-text-field-hover-outline-color: var(--text) !important;
  --mdc-outlined-text-field-focus-outline-color: var(--primary) !important;
  color: var(--text) !important;
}

/* ── Tooltip ───────────────────────────────────────────────── */
.mat-mdc-tooltip {
  --mdc-plain-tooltip-container-color: var(--card) !important;
  --mdc-plain-tooltip-supporting-text-color: var(--text) !important;
}

/* ── Snackbar ──────────────────────────────────────────────── */
.mat-mdc-snack-bar-container {
  --mdc-snackbar-container-color: var(--card) !important;
  --mdc-snackbar-supporting-text-color: var(--text) !important;
}

/* Typed snackbar classes */
// Snackbar notification styles — must be global (CDK overlay renders outside component)
.snack-success { /* Para el texto */ .mdc-snackbar__label {  color: var(--success) !important;  }}
.snack-info    { /* Para el texto */ .mdc-snackbar__label {  color: var(--info) !important;  }}
.snack-warning { /* Para el texto */ .mdc-snackbar__label {  color: var(--warning) !important;  }}
.snack-danger  { /* Para el texto */ .mdc-snackbar__label {  color: var(--danger) !important;  }}

/* ── Dialog ────────────────────────────────────────────────── */
.mat-mdc-dialog-container {
  --mdc-dialog-container-color: var(--panel) !important;
  --mdc-dialog-subhead-color: var(--text) !important;
  --mdc-dialog-supporting-text-color: var(--muted) !important;
}

/* ── Menu ──────────────────────────────────────────────────── */
.mat-mdc-menu-panel {
  --mat-menu-container-color: var(--panel) !important;
  --mat-menu-item-label-text-color: var(--text) !important;
  --mat-menu-item-icon-color: var(--text) !important;
  --mat-menu-item-hover-state-layer-color: var(--glass) !important;
  background: var(--panel) !important;
}

/* ── Divider ───────────────────────────────────────────────── */
.mat-divider {
  --mat-divider-color: var(--border) !important;
  border-top-color: var(--border) !important;
}

/* ── Slide Toggle ──────────────────────────────────────────── */
.mat-mdc-slide-toggle {
  --mdc-switch-unselected-track-color: var(--muted) !important;
  --mdc-switch-unselected-icon-color: var(--text) !important;
}

/* ── Progress Bar / Spinner ────────────────────────────────── */
.mat-mdc-progress-bar {
  --mdc-linear-progress-active-indicator-color: var(--primary) !important;
  --mdc-linear-progress-track-color: var(--glass) !important;
}

.mat-mdc-progress-spinner circle {
  stroke: var(--primary) !important;
}