/* ============================================================
   COI Generator — John Marshall Insurance Agency
   Color palette matched to johnmarshallinsurance.com
   Primary: Deep Navy   #1a2e4a
   Accent:  Warm Gold   #c8932a
   Light:   Off-white   #f5f6f8
   ============================================================ */

:root {
    --jm-navy:      #1a2e4a;
    --jm-navy-dark: #111e30;
    --jm-navy-mid:  #243d5e;
    --jm-gold:      #c8932a;
    --jm-gold-lt:   #e8ad44;
    --jm-light:     #f5f6f8;
    --jm-border:    #dce0e6;
}

/* ── Base ─────────────────────────────────────────────────────────────────── */
body {
    background-color: var(--jm-light);
    color: #1e2a38;
    font-family: 'Segoe UI', system-ui, sans-serif;
}

/* ── Navbar ───────────────────────────────────────────────────────────────── */
.navbar.bg-primary,
.navbar-dark.bg-primary {
    background-color: var(--jm-navy) !important;
    border-bottom: 3px solid var(--jm-gold);
}

.navbar-brand {
    letter-spacing: -0.01em;
    font-size: 1.05rem;
    color: #fff !important;
}
.navbar-brand:hover { color: var(--jm-gold-lt) !important; }

.navbar-nav .nav-link.active,
.navbar-nav .nav-link:focus {
    color: var(--jm-gold) !important;
    font-weight: 600;
}
.navbar-nav .nav-link:hover {
    color: var(--jm-gold-lt) !important;
}

/* Dropdown user menu */
.dropdown-menu {
    border-color: var(--jm-border);
    border-radius: 8px;
}
.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--jm-light);
    color: var(--jm-navy);
}

/* ── Bootstrap overrides ──────────────────────────────────────────────────── */
/* Primary color → Navy */
.btn-primary, .badge.bg-primary, .bg-primary {
    background-color: var(--jm-navy) !important;
    border-color: var(--jm-navy) !important;
}
.btn-primary:hover, .btn-primary:focus {
    background-color: var(--jm-navy-dark) !important;
    border-color: var(--jm-navy-dark) !important;
}
.btn-primary:active {
    background-color: var(--jm-navy-mid) !important;
}

/* Outline primary */
.btn-outline-primary {
    color: var(--jm-navy) !important;
    border-color: var(--jm-navy) !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
    background-color: var(--jm-navy) !important;
    color: #fff !important;
}

/* Text primary */
.text-primary { color: var(--jm-navy) !important; }

/* Links — exclude navbar elements and brand */
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.badge):not(.breadcrumb-item a):not(.navbar-brand):not(.page-link) {
    color: var(--jm-navy);
}
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.badge):not(.breadcrumb-item a):not(.navbar-brand):not(.page-link):hover {
    color: var(--jm-gold);
}

/* Navbar brand icon gold accent */
.navbar-brand .bi { color: var(--jm-gold); }

/* Page links (pagination) */
.page-link { color: var(--jm-navy); }
.page-item.active .page-link {
    background-color: var(--jm-navy);
    border-color: var(--jm-navy);
}

/* Form focus */
.form-control:focus, .form-select:focus {
    border-color: var(--jm-navy-mid);
    box-shadow: 0 0 0 0.2rem rgba(26, 46, 74, 0.18);
}
.form-check-input:checked {
    background-color: var(--jm-navy);
    border-color: var(--jm-navy);
}
.form-switch .form-check-input:checked {
    background-color: var(--jm-navy);
    border-color: var(--jm-navy);
}

/* Card borders */
.card { border-color: var(--jm-border); border-radius: 8px; }
.card-header { border-radius: 8px 8px 0 0 !important; }

/* Card primary headers → Navy */
.card-header.bg-primary {
    background-color: var(--jm-navy) !important;
}
/* Card with border-primary → Navy border */
.card.border-primary { border-color: var(--jm-navy) !important; }
.card-header.bg-primary-subtle { background-color: rgba(26,46,74,0.08) !important; }

/* ── Gold accent elements ────────────────────────────────────────────────── */
/* "New COI" / primary action button on forms */
form .btn-primary.btn-lg,
.btn-jm-gold {
    background-color: var(--jm-gold) !important;
    border-color: var(--jm-gold) !important;
    color: #fff !important;
}
form .btn-primary.btn-lg:hover,
.btn-jm-gold:hover {
    background-color: #b07d20 !important;
    border-color: #b07d20 !important;
}

/* Success / send buttons keep green */
.btn-success { /* keep Bootstrap green */ }

/* ── Cards & Panels ─────────────────────────────────────────────────────── */
.card.shadow-sm { box-shadow: 0 1px 6px rgba(26,46,74,0.09) !important; }

/* Stat cards */
.card.border-0.bg-primary { background-color: var(--jm-navy) !important; }

/* Table light header */
.table-light, thead.table-light th, .table > :not(caption) > * > .table-light {
    background-color: rgba(26,46,74,0.05) !important;
    color: var(--jm-navy);
}
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th {
    background-color: rgba(26,46,74,0.04);
}

/* ── Badges ─────────────────────────────────────────────────────────────── */
.bg-success-subtle  { background-color: #d1edda !important; }
.bg-danger-subtle   { background-color: #fad7da !important; }
.bg-primary-subtle  { background-color: rgba(26,46,74,0.12) !important; }
.bg-secondary-subtle{ background-color: #e8eaed !important; }

/* ── Navbar badge (Admin label) ─────────────────────────────────────────── */
.badge.bg-warning.text-dark { background-color: var(--jm-gold) !important; color: #fff !important; }

/* ── Login page ─────────────────────────────────────────────────────────── */
.min-vh-100 { min-height: 100vh; }
/* Login brand icon */
.login-icon { background-color: var(--jm-navy) !important; }

/* ── Collapsible card header ─────────────────────────────────────────────── */
[data-bs-toggle="collapse"] { cursor: pointer; user-select: none; }
.card-header .collapse-icon { transition: transform 0.2s ease; }
.card-header[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }

/* ── Section icons ───────────────────────────────────────────────────────── */
.card-header .bi.text-primary { color: var(--jm-gold) !important; }

/* ── Template editor table ───────────────────────────────────────────────── */
.tmpl-field-table td, .tmpl-field-table th { vertical-align: middle; }
.tmpl-field-table tr.table-light td { opacity: 0.55; }

/* ── Misc ────────────────────────────────────────────────────────────────── */
.font-monospace { font-family: 'Courier New', Courier, monospace; }
.min-width-0    { min-width: 0; }
.fst-italic     { font-style: italic; }
.display-5, .display-6 { font-size: clamp(1.5rem, 4vw, 2.5rem); }
.rounded-circle.flex-shrink-0 { flex-shrink: 0 !important; }
#holders-table .btn-group { white-space: nowrap; }
.dropdown-menu.shadow-sm { box-shadow: 0 .125rem .5rem rgba(0,0,0,.12) !important; }
.breadcrumb { margin-bottom: 0; }
.user-avatar { width: 36px; height: 36px; font-size: 1rem; flex-shrink: 0; }
.btn-xs { font-size: 0.7rem; padding: 2px 7px; }

/* ── Footer ──────────────────────────────────────────────────────────────── */
footer {
    border-top-color: var(--jm-border) !important;
    color: #7a8694;
    background: #fff;
}

/* ── Dashboard stats ─────────────────────────────────────────────────────── */
.card.border-0.shadow-sm .display-5 { color: var(--jm-navy); }

/* ── Expiry alert table ──────────────────────────────────────────────────── */
.card.border-warning { border-color: var(--jm-gold) !important; }
.card-header.bg-warning { background-color: var(--jm-gold) !important; color: #fff !important; }
.badge.bg-warning { background-color: var(--jm-gold) !important; color: #fff !important; }
.badge.bg-warning.text-dark { color: #fff !important; }

/* ── Y/N Toggle Buttons ──────────────────────────────────────────────────── */
.btn-yn {
    min-width: 2rem;
    padding: 0.2rem 0.55rem;
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: 4px !important;
    line-height: 1.4;
}
.btn-check:checked + .btn-outline-success.btn-yn {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #fff !important;
}
.btn-check:checked + .btn-outline-secondary.btn-yn {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #fff !important;
}
/* Dim the unselected option */
.yn-toggle-group .btn-outline-success:not(.active),
.yn-toggle-group .btn-outline-secondary:not(.active) {
    opacity: 0.55;
}