/* ==========================================================================
   FinMinion design system — shared by every page.
   Source of truth: the role-dashboards template (navy · champagne gold ·
   pale canvas · Manrope / DM Sans). Loaded after brand.css and fm-nav.css, and
   only adds tokens + component polish; it does not touch layout or logic.
   ========================================================================== */

:root {
    --fm-font-head: 'Manrope', 'Nunito Sans', system-ui, sans-serif;
    --fm-font-body: 'DM Sans', 'Nunito Sans', system-ui, sans-serif;

    --fm-canvas: #f3f5f9;
    --fm-surface: #ffffff;
    --fm-line-solid: #e1e7f0;
    --fm-ink: #16283b;
    --fm-muted: #5c7186;
    --fm-soft: #8697a8;

    --fm-navy-950: #0b1426;
    --fm-navy-800: #1b2a6b;
    --fm-gold-1: #f3dc9a;
    --fm-gold-2: #d3a942;
    --fm-champagne: #e3cd94;
    --fm-gold-deep: #b8973f;
    --fm-gold-ink: #8a5a00;

    --fm-green: #3e8914;
    --fm-green-tint: #e5f3db;
    --fm-red: #d6455f;
    --fm-red-tint: #fbe4e9;
    --fm-amber-tint: #fbf0d9;
    --fm-blue-tint: #e8f0fa;

    --fm-radius: 14px;
    --fm-radius-lg: 22px;
    --fm-shadow: 0 6px 20px rgba(16, 32, 50, .08);
    --fm-shadow-lg: 0 26px 50px rgba(11, 20, 50, .14);
}

[data-bs-theme="dark"] {
    --fm-canvas: #0b1420;
    --fm-surface: #121d2c;
    --fm-line-solid: #26364c;
    --fm-ink: #e8eef6;
    --fm-muted: #93a6ba;
    --fm-soft: #6d8299;
    --fm-green-tint: rgba(62, 137, 20, .2);
    --fm-red-tint: rgba(214, 69, 95, .2);
    --fm-amber-tint: rgba(230, 154, 0, .18);
    --fm-blue-tint: rgba(28, 99, 171, .22);
    --fm-shadow: 0 6px 20px rgba(0, 0, 0, .35);
}

/* ---------- Typography + canvas ---------- */
body {
    font-family: var(--fm-font-body);
    background-color: var(--fm-canvas);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6,
.page-header .page-header-text,
.fm-title {
    font-family: var(--fm-font-head);
    letter-spacing: -.02em;
}

/* ---------- Cards ---------- */
.card,
.rz-card {
    border-radius: var(--fm-radius);
    border-color: var(--fm-line-solid);
    box-shadow: var(--fm-shadow);
}
.card > .card-header { background: transparent; border-bottom-color: var(--fm-line-solid); font-family: var(--fm-font-head); }

/* ---------- Buttons ---------- */
.btn-primary,
.rz-button.rz-primary {
    border-radius: 12px;
    font-weight: 600;
    background: linear-gradient(135deg, #1c2d52, var(--fm-navy-950));
    border-color: var(--fm-navy-950);
    color: #fff;
}
.btn-primary:hover,
.rz-button.rz-primary:hover:not(.rz-state-disabled) {
    background: linear-gradient(135deg, #24396a, #11204a);
    border-color: #11204a;
}
.btn-warning,
.rz-button.rz-warning,
.rz-button.rz-secondary {
    border-radius: 12px;
    font-weight: 600;
    background: linear-gradient(135deg, var(--fm-gold-1), var(--fm-gold-2));
    border-color: transparent;
    color: #241a00;
}
.btn,
.rz-button { border-radius: 12px; }

/* ---------- Inputs ---------- */
.form-control,
.form-select,
.rz-textbox,
.rz-inputtext,
.rz-dropdown {
    border-radius: 12px;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--fm-gold-2);
    box-shadow: 0 0 0 4px rgba(211, 169, 66, .2);
}
.form-check-input:checked { background-color: var(--fm-gold-deep); border-color: var(--fm-gold-deep); }

/* ---------- Badges (status colours used across the app) ---------- */
.badge { border-radius: 999px; font-weight: 700; letter-spacing: .01em; }
.fm-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .22rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.fm-badge--success { background: var(--fm-green-tint); color: #2b6a0d; }
.fm-badge--danger  { background: var(--fm-red-tint);   color: #a92e46; }
.fm-badge--warning { background: var(--fm-amber-tint); color: var(--fm-gold-ink); }
.fm-badge--info    { background: var(--fm-blue-tint);  color: #0d4d8c; }
.fm-badge--muted   { background: rgba(134, 151, 168, .16); color: var(--fm-muted); }

/* ---------- Tabs + modals ---------- */
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active { color: var(--fm-gold-ink); border-color: var(--fm-gold-2); }
.nav-pills .nav-link.active { background: var(--fm-amber-tint); }
.modal-content,
.rz-dialog { border-radius: var(--fm-radius-lg); border: 1px solid var(--fm-line-solid); box-shadow: var(--fm-shadow-lg); }