/* TheHangar brand theme — see docs/reference_brand-css.md. Tokens are the source of truth. */
/* Fonts: self-hosted, with system fallbacks */
@font-face { font-family: "Poppins"; font-weight: 600; src: url("../fonts/Poppins-600.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Poppins"; font-weight: 700; src: url("../fonts/Poppins-700.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 400; src: url("../fonts/Inter-400.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 500; src: url("../fonts/Inter-500.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 600; src: url("../fonts/Inter-600.woff2") format("woff2"); font-display: swap; }

:root {
  /* Brand tokens (source of truth) */
  --brand-red:        #eb6565;
  --brand-red-deep:   #d15454;
  --brand-ink:        #1f292e;
  --brand-slate:      #374b53;
  --brand-neutral:    #9fafb5;
  --brand-mist:       #becbcf;
  --brand-bg:         #f8f9fa;
  --brand-bg-2:       #eeeff0;
  --brand-success:    #3f8f5f;
  --brand-warning:    #d9a441;
  --brand-info:       #4d7f95;

  /* Bootstrap 5.3 global mapping */
  --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-font-size: 0.9375rem;              /* 15px */
  --bs-body-color: var(--brand-ink);
  --bs-body-color-rgb: 31, 41, 46;
  --bs-body-bg: var(--brand-bg);
  --bs-body-bg-rgb: 248, 249, 250;
  --bs-secondary-color: var(--brand-slate);    /* muted text */
  --bs-secondary-bg: var(--brand-bg-2);        /* secondary surfaces */
  --bs-tertiary-bg: #ffffff;
  --bs-border-color: var(--brand-mist);
  --bs-heading-color: var(--brand-ink);
  --bs-link-color: var(--brand-red-deep);
  --bs-link-color-rgb: 209, 84, 84;
  --bs-link-hover-color: var(--brand-red);
  --bs-link-hover-color-rgb: 235, 101, 101;
  --bs-focus-ring-color: rgba(235, 101, 101, .25);

  /* Theme colours: primary is the dark ink, red is danger/accent */
  --bs-primary: var(--brand-ink);        --bs-primary-rgb: 31, 41, 46;
  --bs-secondary: var(--brand-slate);    --bs-secondary-rgb: 55, 75, 83;
  --bs-danger: var(--brand-red-deep);    --bs-danger-rgb: 209, 84, 84;
  --bs-success: var(--brand-success);    --bs-success-rgb: 63, 143, 95;
  --bs-warning: var(--brand-warning);    --bs-warning-rgb: 217, 164, 65;
  --bs-info: var(--brand-info);          --bs-info-rgb: 77, 127, 149;
  --bs-light: var(--brand-bg-2);         --bs-light-rgb: 238, 239, 240;
  --bs-dark: var(--brand-ink);           --bs-dark-rgb: 31, 41, 46;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .navbar-brand {
  font-family: "Poppins", var(--bs-body-font-family);
  font-weight: 600;
  letter-spacing: -0.01em;
}
h1, .h1 { font-weight: 700; }

/* Buttons: Bootstrap 5.3 components read their own --bs-btn-* variables */
.btn-primary {
  --bs-btn-bg: var(--brand-ink);           --bs-btn-border-color: var(--brand-ink);
  --bs-btn-hover-bg: var(--brand-slate);   --bs-btn-hover-border-color: var(--brand-slate);
  --bs-btn-active-bg: var(--brand-slate);  --bs-btn-active-border-color: var(--brand-slate);
  --bs-btn-color: #fff;                    --bs-btn-hover-color: #fff;
  --bs-btn-focus-shadow-rgb: 235, 101, 101;
}
.btn-danger {
  --bs-btn-bg: var(--brand-red-deep);      --bs-btn-border-color: var(--brand-red-deep);
  --bs-btn-hover-bg: #c04a4a;              --bs-btn-hover-border-color: #c04a4a;
  --bs-btn-color: #fff;                    --bs-btn-hover-color: #fff;
  font-weight: 600;                        /* keeps white-on-red at large-text contrast */
}
.btn-outline-primary {
  --bs-btn-color: var(--brand-ink);        --bs-btn-border-color: var(--brand-mist);
  --bs-btn-hover-bg: var(--brand-bg-2);    --bs-btn-hover-color: var(--brand-ink);
  --bs-btn-hover-border-color: var(--brand-neutral);
}

/* Accent usage: one red thing per view */
.badge.text-bg-danger { background-color: var(--brand-red) !important; color: var(--brand-ink) !important; }
.nav-link.active, .nav-pills .nav-link.active { color: var(--brand-red-deep); background: transparent; box-shadow: inset 0 -2px 0 var(--brand-red); border-radius: 0; }
.required::after { content: " *"; color: var(--brand-red-deep); }

/* Tables: dense, tabular numbers, quiet borders */
.table { --bs-table-color: var(--brand-ink); --bs-table-border-color: var(--brand-mist); --bs-table-striped-bg: var(--brand-bg-2); font-variant-numeric: tabular-nums; }
.table > thead { font-family: "Inter"; font-weight: 600; font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--brand-slate); }

/* Forms */
.form-control, .form-select { border-color: var(--brand-mist); }
.form-control:focus, .form-select:focus { border-color: var(--brand-red); box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }
.form-text, .text-muted { color: var(--brand-slate) !important; }

/* Cards / panels */
.card { --bs-card-border-color: var(--brand-mist); --bs-card-bg: #fff; }
.navbar { background: #fff; border-bottom: 1px solid var(--brand-mist); }
