/*
 * Fountain brand CSS — shared across all staff tools.
 * Load AFTER Bootstrap 5 to override defaults. No HTML edits to the main website.
 */

:root {
  --color-bg:          #f4f0ea;
  --color-surface:     #fbf8f3;
  --color-surface-alt: #efe8df;
  --color-text:        #26231f;
  --color-muted:       #6f675d;
  --color-dark:        #1f1c18;
  --color-accent:      #9d7a52;
  --color-accent-deep: #7d5f3d;
  --color-border:      rgba(38, 35, 31, 0.10);

  /* Bootstrap 5 overrides */
  --bs-body-bg:              #f4f0ea;
  --bs-body-color:           #26231f;
  --bs-body-font-family:     "Inter", "Helvetica Neue", Arial, sans-serif;
  --bs-secondary-color:      #6f675d;
  --bs-border-color:         rgba(38, 35, 31, 0.12);
  --bs-card-bg:              #fbf8f3;
  --bs-card-border-color:    rgba(38, 35, 31, 0.10);
  --bs-secondary-bg:         #efe8df;
  --bs-tertiary-bg:          #efe8df;
  --bs-primary:              #9d7a52;
  --bs-primary-rgb:          157, 122, 82;
  --bs-link-color:           #7d5f3d;
  --bs-link-color-rgb:       125, 95, 61;
  --bs-link-hover-color:     #9d7a52;
  --bs-light:                #f4f0ea;
  --bs-light-rgb:            244, 240, 234;
}

/* ── Body & background ─────────────────────────────────────────────────────── */
body, body.bg-light {
  background-color: var(--color-bg) !important;
  color: var(--color-text);
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}

/* ── Headings ──────────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: -0.02em;
}

/* ── Navbar ────────────────────────────────────────────────────────────────── */
.navbar.bg-dark,
.navbar.navbar-dark.bg-dark {
  background-color: var(--color-dark) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.navbar-dark .navbar-brand {
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
  font-weight: 700;
}
.navbar-dark .nav-link { font-size: 0.92rem; }

/* ── Cards ─────────────────────────────────────────────────────────────────── */
.card {
  background-color: var(--color-surface);
  border-color: var(--color-border);
}
.card-header {
  background-color: var(--color-surface-alt);
  border-bottom-color: var(--color-border);
}
.card.border-primary   { border-color: var(--color-accent) !important; }
.card-header.bg-primary { background-color: var(--color-accent) !important; }

/* ── Buttons ───────────────────────────────────────────────────────────────── */
.btn-primary {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active { background-color: var(--color-accent-deep); border-color: var(--color-accent-deep); color: #fff; }

.btn-outline-primary  { color: var(--color-accent); border-color: var(--color-accent); }
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active { background-color: var(--color-accent); border-color: var(--color-accent); color: #fff; }

/* ── Tables ────────────────────────────────────────────────────────────────── */
.table {
  --bs-table-striped-bg: rgba(157, 122, 82, 0.05);
  --bs-table-hover-bg:   rgba(157, 122, 82, 0.07);
  border-color: rgba(38, 35, 31, 0.10);
}
.table-dark {
  --bs-table-bg:           #1f1c18;
  --bs-table-color:        #e8e4de;
  --bs-table-border-color: rgba(255,255,255,0.07);
}
.table-secondary { --bs-table-bg: rgba(157, 122, 82, 0.06); }
.table th { background-color: var(--color-surface-alt); }

/* ── Form controls ─────────────────────────────────────────────────────────── */
.form-control:focus,
.form-select:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 0.2rem rgba(157, 122, 82, 0.18);
}
.form-check-input:checked {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
}
.form-check-input:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 0.2rem rgba(157, 122, 82, 0.18);
}

/* ── Badges ────────────────────────────────────────────────────────────────── */
.badge.bg-primary,
.badge.text-bg-primary { background-color: var(--color-accent) !important; }

/* ── Alerts ────────────────────────────────────────────────────────────────── */
.alert-warning {
  --bs-alert-bg:           rgba(157, 122, 82, 0.10);
  --bs-alert-border-color: rgba(157, 122, 82, 0.30);
  --bs-alert-color:        var(--color-text);
}
.alert-info {
  --bs-alert-bg:           rgba(157, 122, 82, 0.06);
  --bs-alert-border-color: rgba(157, 122, 82, 0.20);
  --bs-alert-color:        var(--color-text);
}

/* ── Dropdowns ─────────────────────────────────────────────────────────────── */
.dropdown-menu {
  background-color: var(--color-surface);
  border-color: var(--color-border);
}
.dropdown-item:hover,
.dropdown-item:focus  { background-color: var(--color-surface-alt); color: var(--color-text); }
.dropdown-item.active,
.dropdown-item:active { background-color: var(--color-accent); color: #fff; }
.dropdown-divider     { border-top-color: var(--color-border); }

/* ── Pagination ────────────────────────────────────────────────────────────── */
.page-link { color: var(--color-accent); background-color: var(--color-surface); border-color: var(--color-border); }
.page-link:hover { color: var(--color-accent-deep); background-color: var(--color-surface-alt); border-color: var(--color-border); }
.page-item.active .page-link { background-color: var(--color-accent); border-color: var(--color-accent); color: #fff; }

/* ── Utilities ─────────────────────────────────────────────────────────────── */
.small-muted { font-size: .875rem; color: var(--color-muted); }