/* McFarm brand theme -- the token set from the brand guide applied to Bootstrap 5.3.
   Navy is the structure, orange is the action, status colours are their own family.
   Loaded after Bootstrap and after the layout's inline styles so it wins on ties. */

:root {
  --mc-navy-50: #EEF3F8;  --mc-navy-100: #DCE8F2; --mc-navy-300: #8FB5D6; --mc-navy-400: #2A78B8;
  --mc-navy-600: #145E9C; --mc-navy-700: #0B4A80; --mc-navy-800: #073763; --mc-navy-900: #04223D;
  --mc-orange-50: #FDF6EE; --mc-orange-100: #FBEBD8; --mc-orange-200: #F6D6B0; --mc-orange-400: #EDAA63;
  --mc-orange-500: #E69138; --mc-orange-600: #D07F28; --mc-orange-700: #A8611A;
  --mc-ink: #1C2733; --mc-slate: #4A5563; --mc-muted: #6E7A88; --mc-line: #D5DDE6; --mc-surface: #F4F6F8;
  --mc-success: #2F855A; --mc-warning: #B7791F; --mc-danger: #C0392B; --mc-info: #2A78B8;

  /* Bootstrap runtime variables */
  --bs-primary: #073763; --bs-primary-rgb: 7, 55, 99;
  --bs-success: #2F855A; --bs-success-rgb: 47, 133, 90;
  --bs-warning: #B7791F; --bs-warning-rgb: 183, 121, 31;
  --bs-danger:  #C0392B; --bs-danger-rgb: 192, 57, 43;
  --bs-info:    #2A78B8; --bs-info-rgb: 42, 120, 184;
  --bs-body-bg: #F4F6F8; --bs-body-color: #1C2733; --bs-body-color-rgb: 28, 39, 51;
  --bs-secondary-color: #6E7A88; --bs-border-color: #D5DDE6;
  --bs-link-color: #145E9C; --bs-link-color-rgb: 20, 94, 156;
  --bs-link-hover-color: #0B4A80; --bs-link-hover-color-rgb: 11, 74, 128;
  --bs-font-sans-serif: "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;
  --bs-heading-color: #073763;
  --mcfarm-page-bg: #F4F6F8;
}

body { font-family: var(--bs-font-sans-serif); background: var(--mc-surface); color: var(--mc-ink); }

h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5, .navbar-brand, .display-6, .modal-title {
  font-family: "Prompt", "Segoe UI", system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--mc-navy-800);
}
.card-title { font-family: "Prompt", "Segoe UI", system-ui, sans-serif; font-weight: 500; }
.text-muted { color: var(--mc-muted) !important; }
.tabular, .h3, .fs-4, .fs-3 { font-variant-numeric: tabular-nums; }

/* --- Navbar: the navy plate with the white wordmark ------------------------------- */
.navbar.bg-brand { background-color: var(--mc-navy-800); }
.navbar.bg-brand .navbar-brand { display: flex; align-items: center; gap: .6rem; padding-block: .25rem; }
.navbar.bg-brand .navbar-brand img { height: 36px; width: auto; display: block; }
.navbar.bg-brand .navbar-brand .brand-tag {
  font-family: "Source Sans 3", "Segoe UI", sans-serif; font-weight: 600; font-size: .62rem;
  letter-spacing: .12em; text-transform: uppercase; color: #F0B570; padding-top: .35rem;
}
.navbar.bg-brand .nav-link { color: rgba(255, 255, 255, .85); }
.navbar.bg-brand .nav-link:hover, .navbar.bg-brand .nav-link:focus { color: #fff; }
.navbar.bg-brand .nav-link.active { color: #fff; box-shadow: inset 0 -3px 0 var(--mc-orange-500); }
.navbar.bg-brand .dropdown-item.active, .navbar.bg-brand .dropdown-item:active { background-color: var(--mc-navy-800); }
.navbar.bg-brand .dropdown-menu { border-color: var(--mc-line); }
.navbar.bg-brand .btn-link { color: rgba(255, 255, 255, .85); }
.navbar.bg-brand .badge.bg-danger { background-color: var(--mc-orange-500) !important; color: var(--mc-ink); }

/* --- Buttons ------------------------------------------------------------------------ */
.btn-primary {
  --bs-btn-bg: #073763; --bs-btn-border-color: #073763;
  --bs-btn-hover-bg: #0B4A80; --bs-btn-hover-border-color: #0B4A80;
  --bs-btn-active-bg: #04223D; --bs-btn-active-border-color: #04223D;
  --bs-btn-disabled-bg: #073763; --bs-btn-disabled-border-color: #073763;
  --bs-btn-focus-shadow-rgb: 20, 94, 156;
}
.btn-outline-primary {
  --bs-btn-color: #073763; --bs-btn-border-color: #073763;
  --bs-btn-hover-bg: #073763; --bs-btn-hover-border-color: #073763;
  --bs-btn-active-bg: #04223D; --bs-btn-active-border-color: #04223D;
  --bs-btn-focus-shadow-rgb: 20, 94, 156;
}
/* The one call to action per page: brand orange with ink text (white on orange fails contrast). */
.btn-brand {
  --bs-btn-color: #1C2733; --bs-btn-bg: #E69138; --bs-btn-border-color: #E69138;
  --bs-btn-hover-color: #1C2733; --bs-btn-hover-bg: #EDAA63; --bs-btn-hover-border-color: #EDAA63;
  --bs-btn-active-color: #1C2733; --bs-btn-active-bg: #D07F28; --bs-btn-active-border-color: #D07F28;
  --bs-btn-disabled-color: #1C2733; --bs-btn-disabled-bg: #F6D6B0; --bs-btn-disabled-border-color: #F6D6B0;
  --bs-btn-focus-shadow-rgb: 230, 145, 56;
  font-weight: 600;
}
.btn-outline-brand {
  --bs-btn-color: #A8611A; --bs-btn-border-color: #E69138;
  --bs-btn-hover-color: #1C2733; --bs-btn-hover-bg: #E69138; --bs-btn-hover-border-color: #E69138;
  --bs-btn-active-color: #1C2733; --bs-btn-active-bg: #D07F28; --bs-btn-active-border-color: #D07F28;
  --bs-btn-focus-shadow-rgb: 230, 145, 56;
}
.btn-success {
  --bs-btn-bg: #2F855A; --bs-btn-border-color: #2F855A;
  --bs-btn-hover-bg: #276E4B; --bs-btn-hover-border-color: #276E4B;
  --bs-btn-active-bg: #1F5A3D; --bs-btn-active-border-color: #1F5A3D;
  --bs-btn-disabled-bg: #2F855A; --bs-btn-disabled-border-color: #2F855A;
  --bs-btn-focus-shadow-rgb: 47, 133, 90;
}
.btn-outline-success {
  --bs-btn-color: #2F855A; --bs-btn-border-color: #2F855A;
  --bs-btn-hover-bg: #2F855A; --bs-btn-hover-border-color: #2F855A;
  --bs-btn-active-bg: #276E4B; --bs-btn-active-border-color: #276E4B;
}
.btn-warning { --bs-btn-bg: #B7791F; --bs-btn-border-color: #B7791F; --bs-btn-color: #fff; --bs-btn-hover-bg: #9A661A; --bs-btn-hover-border-color: #9A661A; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #7F5415; --bs-btn-active-border-color: #7F5415; --bs-btn-active-color: #fff; }
.btn-outline-warning { --bs-btn-color: #9A661A; --bs-btn-border-color: #B7791F; --bs-btn-hover-bg: #B7791F; --bs-btn-hover-border-color: #B7791F; --bs-btn-hover-color: #fff; }
.btn-danger { --bs-btn-bg: #C0392B; --bs-btn-border-color: #C0392B; --bs-btn-hover-bg: #A93226; --bs-btn-hover-border-color: #A93226; --bs-btn-active-bg: #922B21; --bs-btn-active-border-color: #922B21; }
.btn-outline-danger { --bs-btn-color: #C0392B; --bs-btn-border-color: #C0392B; --bs-btn-hover-bg: #C0392B; --bs-btn-hover-border-color: #C0392B; }
.btn-info { --bs-btn-bg: #2A78B8; --bs-btn-border-color: #2A78B8; --bs-btn-color: #fff; --bs-btn-hover-bg: #145E9C; --bs-btn-hover-border-color: #145E9C; --bs-btn-hover-color: #fff; }
.btn-outline-info { --bs-btn-color: #145E9C; --bs-btn-border-color: #2A78B8; --bs-btn-hover-bg: #2A78B8; --bs-btn-hover-border-color: #2A78B8; --bs-btn-hover-color: #fff; }
.btn-outline-secondary { --bs-btn-color: #4A5563; --bs-btn-border-color: #B9C3CF; --bs-btn-hover-bg: #4A5563; --bs-btn-hover-border-color: #4A5563; }
.btn-outline-dark { --bs-btn-color: #1C2733; --bs-btn-border-color: #1C2733; --bs-btn-hover-bg: #1C2733; --bs-btn-hover-border-color: #1C2733; }

/* --- Badges, alerts, backgrounds, borders ------------------------------------------ */
.text-bg-primary, .bg-primary { background-color: #073763 !important; color: #fff !important; }
.text-bg-success, .bg-success { background-color: #2F855A !important; color: #fff !important; }
.text-bg-warning, .bg-warning { background-color: #B7791F !important; color: #fff !important; }
.text-bg-danger, .bg-danger { background-color: #C0392B !important; color: #fff !important; }
.text-bg-info, .bg-info { background-color: #2A78B8 !important; color: #fff !important; }
.text-bg-secondary { background-color: #6E7A88 !important; color: #fff !important; }
.text-bg-light { background-color: #EEF3F8 !important; color: #073763 !important; }
.text-primary { color: #073763 !important; }
.text-success { color: #2F855A !important; }
.text-warning { color: #9A661A !important; }
.text-danger { color: #C0392B !important; }
.text-info { color: #145E9C !important; }
.border-primary { border-color: #073763 !important; }
.border-success { border-color: #2F855A !important; }
.border-warning { border-color: #E69138 !important; }   /* "needs a look" stripe is brand orange */
.border-danger { border-color: #C0392B !important; }
.border-info { border-color: #2A78B8 !important; }
.alert-primary { --bs-alert-bg: #DCE8F2; --bs-alert-color: #04223D; --bs-alert-border-color: #8FB5D6; }
.alert-info { --bs-alert-bg: #DCE8F2; --bs-alert-color: #04223D; --bs-alert-border-color: #8FB5D6; }
.alert-success { --bs-alert-bg: #E3F1E8; --bs-alert-color: #1F5A3D; --bs-alert-border-color: #9CCDB0; }
.alert-warning { --bs-alert-bg: #FBEBD8; --bs-alert-color: #6E4410; --bs-alert-border-color: #EDAA63; }
.alert-danger { --bs-alert-bg: #F8E1DE; --bs-alert-color: #7A231B; --bs-alert-border-color: #E39B93; }
.progress-bar { background-color: #073763; }
.progress-bar.bg-success { background-color: #2F855A !important; }

/* --- Forms, tables, pagination, cards ---------------------------------------------- */
.form-control:focus, .form-select:focus {
  border-color: #8FB5D6; box-shadow: 0 0 0 .25rem rgba(20, 94, 156, .2);
}
.form-check-input:checked { background-color: #073763; border-color: #073763; }
.form-check-input:focus { border-color: #8FB5D6; box-shadow: 0 0 0 .25rem rgba(20, 94, 156, .2); }
.form-switch .form-check-input:checked { background-color: #2F855A; border-color: #2F855A; }
.table thead th { color: #4A5563; background: #EEF3F8; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: #F4F6F8; }
.page-link { color: #073763; }
.page-item.active .page-link { background-color: #073763; border-color: #073763; }
.nav-pills .nav-link.active { background-color: #073763; }
.nav-tabs .nav-link.active { color: #073763; border-bottom-color: #fff; }
.card { border: 1px solid var(--mc-line); box-shadow: 0 .25rem .75rem rgba(7, 55, 99, .06); }
.card-header { background-color: #fff; border-bottom: 1px solid var(--mc-line); }
.list-group-item.active { background-color: #073763; border-color: #073763; }
.dropdown-item.active, .dropdown-item:active { background-color: #073763; }
.btn-group .btn-outline-secondary.active { background-color: #073763; border-color: #073763; color: #fff; }
.btn-outline-primary.active, .btn-check:checked + .btn-outline-primary { background-color: #073763; border-color: #073763; color: #fff; }

/* Greens that the layout's inline styles used as an accent become navy structure. */
.metric-card { border-left-color: rgba(7, 55, 99, .55) !important; }
.timeline-item { border-left-color: rgba(7, 55, 99, .25) !important; }
.timeline-item::before { background: #073763 !important; }
.species-bar-fill { background: #2A78B8 !important; }
.clickable-row:hover { background: #EEF3F8 !important; }
.health-score.bg-success { background-color: #2F855A !important; }

/* Standalone pages (login, sign-up) */
.auth-page { background: var(--mc-surface); }
.auth-page .auth-logo { display: block; width: min(260px, 70%); height: auto; margin: 0 auto 1.25rem; }

/* --- Mobile menu: a navy drawer sliding in from the left ------------------------- */
@media (max-width: 991.98px) {
  .navbar.bg-brand .offcanvas {
    background-color: var(--mc-navy-900); color: #fff;
    width: min(85vw, 320px);
    border-right: 1px solid rgba(255, 255, 255, .12);
  }
  .navbar.bg-brand .offcanvas-header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, .15); padding: .85rem 1rem; }
  .navbar.bg-brand .offcanvas-header .navbar-brand { margin-right: auto; }
  .navbar.bg-brand .offcanvas-body { padding: .5rem 1rem 1.5rem; }
  .navbar.bg-brand .offcanvas .navbar-nav { gap: 0; }
  .navbar.bg-brand .offcanvas .nav-link {
    padding: .7rem .5rem; font-size: 1.05rem; font-weight: 600;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
  }
  .navbar.bg-brand .offcanvas .nav-link.active { box-shadow: inset 4px 0 0 var(--mc-orange-500); padding-left: .9rem; }
  .navbar.bg-brand .offcanvas .dropdown-menu { background: transparent; border: 0; padding: 0 0 .25rem .9rem; margin: 0; }
  .navbar.bg-brand .offcanvas .dropdown-item { color: rgba(255, 255, 255, .8); padding: .5rem .5rem; border-radius: 4px; }
  .navbar.bg-brand .offcanvas .dropdown-item:hover, .navbar.bg-brand .offcanvas .dropdown-item:focus { color: #fff; background: rgba(255, 255, 255, .08); }
  .navbar.bg-brand .offcanvas .dropdown-item.active { color: #fff; background: rgba(230, 145, 56, .18); box-shadow: inset 3px 0 0 var(--mc-orange-500); }
  .navbar.bg-brand .offcanvas .navbar-text { color: rgba(255, 255, 255, .75) !important; }
  .navbar.bg-brand .offcanvas .navbar-nav.ms-auto { margin-top: 1rem; padding-top: .5rem; border-top: 1px solid rgba(255, 255, 255, .15); }
  .navbar.bg-brand .offcanvas .form-select { background-color: rgba(255, 255, 255, .95); }
}
.navbar.bg-brand .offcanvas-backdrop { background-color: #04223D; }
@media (min-width: 992px) { .navbar.bg-brand .offcanvas-header { display: none; } }

/* Drawer header bell (phones only: the header itself is hidden at lg and up) */
.navbar.bg-brand .offcanvas-header .drawer-bell { color: #fff; text-decoration: none; font-size: 1.25rem; line-height: 1; padding: .15rem .35rem; }
.navbar.bg-brand .offcanvas-header .drawer-bell .badge { font-size: .65rem; }