/*
 * MOCARA dashboard theme.
 * Retints Bootstrap 5 with the MOCARA palette + typography.
 * Source of truth: 06-Marketing/brand/tokens.json (approved 2026-07-20).
 * Loaded after bootstrap + app.css so these overrides win.
 */
:root {
  /* Brand core */
  --mocara-navy: #1c3a5f;
  --mocara-navy-hover: #16304f;
  --mocara-gold: #c9973b;
  --mocara-off-white: #f7f5f0;
  --mocara-near-black: #111820;
  --mocara-white: #ffffff;
  --mocara-navy-10: #eef1f5;
  --mocara-navy-25: #d1d9e4;
  --mocara-navy-50: #8e9daf;
  --mocara-navy-75: #556b8a;
  --mocara-gold-10: #fbf4e8;
  --mocara-surface-nav: #1a1a2e;
  --mocara-border-default: #e8eef8;

  --mocara-font-sans: 'Hanken Grotesk', 'Inter', -apple-system, BlinkMacSystemFont,
    'Segoe UI', sans-serif;
  --mocara-font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', Consolas,
    'Courier New', monospace;

  /* Map Bootstrap theme variables onto the brand palette. */
  --bs-body-bg: var(--mocara-off-white);
  --bs-body-color: var(--mocara-near-black);
  --bs-body-font-family: var(--mocara-font-sans);
  --bs-secondary-color: var(--mocara-navy-75);
  --bs-border-color: var(--mocara-border-default);
  --bs-emphasis-color: var(--mocara-navy);

  --bs-primary: #1c3a5f;
  --bs-primary-rgb: 28, 58, 95;
  --bs-secondary: #556b8a;
  --bs-secondary-rgb: 85, 107, 138;
  --bs-success: #1a6b40;
  --bs-success-rgb: 26, 107, 64;
  --bs-danger: #8b1a1a;
  --bs-danger-rgb: 139, 26, 26;
  --bs-warning: #c9973b;
  --bs-warning-rgb: 201, 151, 59;
  --bs-info: #5a7ab5;
  --bs-info-rgb: 90, 122, 181;

  --bs-link-color: #1c3a5f;
  --bs-link-color-rgb: 28, 58, 95;
  --bs-link-hover-color: #16304f;
  --bs-link-hover-color-rgb: 22, 48, 79;
}

body {
  font-family: var(--mocara-font-sans);
  background-color: var(--mocara-off-white);
  color: var(--mocara-near-black);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--mocara-navy);
  font-weight: 700;
  letter-spacing: -0.01em;
}

code,
kbd,
samp,
pre,
.font-monospace {
  font-family: var(--mocara-font-mono);
}

a,
.btn-link {
  color: var(--mocara-navy);
}

a:hover,
.btn-link:hover {
  color: var(--mocara-navy-hover);
}

/* Primary buttons -> Navy */
.btn-primary {
  --bs-btn-bg: var(--mocara-navy);
  --bs-btn-border-color: var(--mocara-navy);
  --bs-btn-hover-bg: var(--mocara-navy-hover);
  --bs-btn-hover-border-color: var(--mocara-navy-hover);
  --bs-btn-active-bg: var(--mocara-navy-hover);
  --bs-btn-active-border-color: var(--mocara-navy-hover);
  --bs-btn-disabled-bg: var(--mocara-navy-50);
  --bs-btn-disabled-border-color: var(--mocara-navy-50);
  color: #fff;
}

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

/* Success actions -> brand green */
.btn-success {
  --bs-btn-bg: var(--mocara-success, #1a6b40);
  --bs-btn-border-color: #1a6b40;
  --bs-btn-hover-bg: #155534;
  --bs-btn-hover-border-color: #155534;
  --bs-btn-active-bg: #155534;
  --bs-btn-active-border-color: #155534;
  color: #fff;
}

/* Gold accent button (opt-in via .btn-accent) */
.btn-accent {
  --bs-btn-color: var(--mocara-navy);
  --bs-btn-bg: var(--mocara-gold);
  --bs-btn-border-color: var(--mocara-gold);
  --bs-btn-hover-color: var(--mocara-navy);
  --bs-btn-hover-bg: #b8862f;
  --bs-btn-hover-border-color: #b8862f;
}

/* Warning badges keep gold but need dark text for contrast (gold fails AA on white). */
.badge.bg-warning {
  color: var(--mocara-near-black) !important;
}

/* Cards -> brand radius, border, subtle elevation */
.card {
  --bs-card-border-color: var(--mocara-border-default);
  --bs-card-border-radius: 12px;
  --bs-card-cap-bg: var(--mocara-navy-10);
  box-shadow: 0 2px 14px rgb(17 24 32 / 6%);
}

.text-bg-light {
  background-color: var(--mocara-white) !important;
  color: var(--mocara-near-black) !important;
}

/* Tables */
.table {
  --bs-table-hover-bg: var(--mocara-navy-10);
}

.table > thead th {
  color: var(--mocara-navy-75);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.75rem;
}

/* Focus ring -> brand navy */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: var(--mocara-navy);
  box-shadow: 0 0 0 0.2rem rgb(28 58 95 / 25%);
}

/* Alerts -> brand semantic families */
.alert-success {
  --bs-alert-color: #155534;
  --bs-alert-bg: #edf7f0;
  --bs-alert-border-color: #6bbf8a;
}

.alert-danger {
  --bs-alert-color: #8b1a1a;
  --bs-alert-bg: #fef0ef;
  --bs-alert-border-color: #e07070;
}

.alert-warning {
  --bs-alert-color: #7a5a18;
  --bs-alert-bg: #fbf4e8;
  --bs-alert-border-color: #c9973b;
}

.alert-info {
  --bs-alert-color: #1c3a5f;
  --bs-alert-bg: #edf0f5;
  --bs-alert-border-color: #5a7ab5;
}
