/* ============================================================
   tm-bootstrap-bridge.css
   ------------------------------------------------------------
   Overrides Bootstrap 5 utility and component classes that use
   hardcoded colours, so they follow the TMaths design system
   and respond to theme changes.

   Load AFTER bootstrap.min.css and tm-variables.css.
   ============================================================ */

/* ─── Buttons: solid ──────────────────────────────────────── */

/* Primary */
.btn-primary {
    --bs-btn-bg: var(--tm-primary);
    --bs-btn-border-color: var(--tm-primary);
    --bs-btn-hover-bg: var(--tm-primary-hover);
    --bs-btn-hover-border-color: var(--tm-primary-hover);
    --bs-btn-active-bg: var(--tm-primary-hover);
    --bs-btn-active-border-color: var(--tm-primary-hover);
    --bs-btn-disabled-bg: var(--tm-primary);
    --bs-btn-disabled-border-color: var(--tm-primary);
}

/* Success */
.btn-success {
    --bs-btn-bg: var(--tm-success);
    --bs-btn-border-color: var(--tm-success);
    --bs-btn-hover-bg: var(--tm-success);
    --bs-btn-hover-border-color: var(--tm-success);
    --bs-btn-active-bg: var(--tm-success);
    --bs-btn-active-border-color: var(--tm-success);
    --bs-btn-disabled-bg: var(--tm-success);
    --bs-btn-disabled-border-color: var(--tm-success);
}

/* Danger */
.btn-danger {
    --bs-btn-bg: var(--tm-danger);
    --bs-btn-border-color: var(--tm-danger);
    --bs-btn-hover-bg: var(--tm-danger);
    --bs-btn-hover-border-color: var(--tm-danger);
    --bs-btn-active-bg: var(--tm-danger);
    --bs-btn-active-border-color: var(--tm-danger);
    --bs-btn-disabled-bg: var(--tm-danger);
    --bs-btn-disabled-border-color: var(--tm-danger);
}

/* Warning */
.btn-warning {
    --bs-btn-bg: var(--tm-warning);
    --bs-btn-border-color: var(--tm-warning);
    --bs-btn-hover-bg: var(--tm-warning);
    --bs-btn-hover-border-color: var(--tm-warning);
    --bs-btn-active-bg: var(--tm-warning);
    --bs-btn-active-border-color: var(--tm-warning);
    --bs-btn-disabled-bg: var(--tm-warning);
    --bs-btn-disabled-border-color: var(--tm-warning);
}

/* Info */
.btn-info {
    --bs-btn-bg: var(--tm-info);
    --bs-btn-border-color: var(--tm-info);
    --bs-btn-hover-bg: var(--tm-info);
    --bs-btn-hover-border-color: var(--tm-info);
    --bs-btn-active-bg: var(--tm-info);
    --bs-btn-active-border-color: var(--tm-info);
    --bs-btn-disabled-bg: var(--tm-info);
    --bs-btn-disabled-border-color: var(--tm-info);
}

/* Secondary – mapped to neutral surface tokens (per project decision) */
.btn-secondary {
    --bs-btn-color: var(--tm-text);
    --bs-btn-bg: var(--tm-surface-alt);
    --bs-btn-border-color: var(--tm-border-strong);
    --bs-btn-hover-color: var(--tm-text);
    --bs-btn-hover-bg: var(--tm-surface);
    --bs-btn-hover-border-color: var(--tm-border-strong);
    --bs-btn-active-color: var(--tm-text);
    --bs-btn-active-bg: var(--tm-surface);
    --bs-btn-active-border-color: var(--tm-border-strong);
    --bs-btn-disabled-color: var(--tm-text-muted);
    --bs-btn-disabled-bg: var(--tm-surface-alt);
    --bs-btn-disabled-border-color: var(--tm-border);
}

/* ─── Buttons: outline ────────────────────────────────────── */

.btn-outline-primary {
    --bs-btn-color: var(--tm-primary);
    --bs-btn-border-color: var(--tm-primary);
    --bs-btn-hover-bg: var(--tm-primary);
    --bs-btn-hover-border-color: var(--tm-primary);
    --bs-btn-active-bg: var(--tm-primary);
    --bs-btn-active-border-color: var(--tm-primary);
    --bs-btn-disabled-color: var(--tm-primary);
    --bs-btn-disabled-border-color: var(--tm-primary);
}

.btn-outline-success {
    --bs-btn-color: var(--tm-success);
    --bs-btn-border-color: var(--tm-success);
    --bs-btn-hover-bg: var(--tm-success);
    --bs-btn-hover-border-color: var(--tm-success);
    --bs-btn-active-bg: var(--tm-success);
    --bs-btn-active-border-color: var(--tm-success);
    --bs-btn-disabled-color: var(--tm-success);
    --bs-btn-disabled-border-color: var(--tm-success);
}

.btn-outline-danger {
    --bs-btn-color: var(--tm-danger);
    --bs-btn-border-color: var(--tm-danger);
    --bs-btn-hover-bg: var(--tm-danger);
    --bs-btn-hover-border-color: var(--tm-danger);
    --bs-btn-active-bg: var(--tm-danger);
    --bs-btn-active-border-color: var(--tm-danger);
    --bs-btn-disabled-color: var(--tm-danger);
    --bs-btn-disabled-border-color: var(--tm-danger);
}

.btn-outline-warning {
    --bs-btn-color: var(--tm-warning);
    --bs-btn-border-color: var(--tm-warning);
    --bs-btn-hover-bg: var(--tm-warning);
    --bs-btn-hover-border-color: var(--tm-warning);
    --bs-btn-active-bg: var(--tm-warning);
    --bs-btn-active-border-color: var(--tm-warning);
    --bs-btn-disabled-color: var(--tm-warning);
    --bs-btn-disabled-border-color: var(--tm-warning);
}

.btn-outline-info {
    --bs-btn-color: var(--tm-info);
    --bs-btn-border-color: var(--tm-info);
    --bs-btn-hover-bg: var(--tm-info);
    --bs-btn-hover-border-color: var(--tm-info);
    --bs-btn-active-bg: var(--tm-info);
    --bs-btn-active-border-color: var(--tm-info);
    --bs-btn-disabled-color: var(--tm-info);
    --bs-btn-disabled-border-color: var(--tm-info);
}

.btn-outline-secondary {
    --bs-btn-color: var(--tm-text-muted);
    --bs-btn-border-color: var(--tm-border-strong);
    --bs-btn-hover-color: var(--tm-text);
    --bs-btn-hover-bg: var(--tm-surface-alt);
    --bs-btn-hover-border-color: var(--tm-border-strong);
    --bs-btn-active-color: var(--tm-text);
    --bs-btn-active-bg: var(--tm-surface-alt);
    --bs-btn-active-border-color: var(--tm-border-strong);
    --bs-btn-disabled-color: var(--tm-text-subtle);
    --bs-btn-disabled-border-color: var(--tm-border);
}

/* ─── Text colours ────────────────────────────────────────── */

.text-primary   { color: var(--tm-primary) !important; }
.text-success   { color: var(--tm-success) !important; }
.text-danger    { color: var(--tm-danger) !important; }
.text-warning   { color: var(--tm-warning) !important; }
.text-info      { color: var(--tm-info) !important; }

/* ─── Background colours ──────────────────────────────────── */

.bg-primary     { background-color: var(--tm-primary) !important; }
.bg-success     { background-color: var(--tm-success) !important; }
.bg-danger      { background-color: var(--tm-danger) !important; }
.bg-warning     { background-color: var(--tm-warning) !important; }
.bg-info        { background-color: var(--tm-info) !important; }

/* ─── Subtle backgrounds ──────────────────────────────────── */
/* Not bridged in tm-variables.css — Bootstrap's pale defaults
   ignore theme tokens. */

.bg-primary-subtle   { background-color: var(--tm-primary-subtle) !important; }
.bg-success-subtle   { background-color: var(--tm-success-subtle) !important; }
.bg-danger-subtle    { background-color: var(--tm-danger-subtle) !important; }
.bg-warning-subtle   { background-color: var(--tm-warning-subtle) !important; }
.bg-info-subtle      { background-color: var(--tm-info-subtle) !important; }
.bg-secondary-subtle { background-color: var(--tm-surface-alt) !important; }

/* ─── Alerts ──────────────────────────────────────────────── */

.alert-primary {
    --bs-alert-color: var(--tm-primary);
    --bs-alert-bg: var(--tm-primary-subtle);
    --bs-alert-border-color: var(--tm-primary);
}

.alert-success {
    --bs-alert-color: var(--tm-success);
    --bs-alert-bg: var(--tm-success-subtle);
    --bs-alert-border-color: var(--tm-success);
}

.alert-danger {
    --bs-alert-color: var(--tm-danger);
    --bs-alert-bg: var(--tm-danger-subtle);
    --bs-alert-border-color: var(--tm-danger);
}

.alert-warning {
    --bs-alert-color: var(--tm-warning);
    --bs-alert-bg: var(--tm-warning-subtle);
    --bs-alert-border-color: var(--tm-warning);
}

.alert-info {
    --bs-alert-color: var(--tm-info);
    --bs-alert-bg: var(--tm-info-subtle);
    --bs-alert-border-color: var(--tm-info);
}