/*
 * Self-hosted Outfit + Public Sans variable woff2 — replaces the
 * `@import` to fonts.googleapis.com that used to live in app.css.
 *
 * Why: kills 2 RTT to a third-party CDN on every page load and removes the
 * RGPD risk of Google logging visitor IPs. Files in static/fonts/google/
 * were pulled from fonts.gstatic.com (latin + latin-ext only — no vietnamese).
 *
 * Variable axis 100..900 in a single file per family/style, so we don't
 * ship one woff2 per weight. Total payload: ~140 KB.
 *
 * The Adminto theme declares the body stack as `"Public Sans", serif` and
 * inline heading rules as `"Outfit", serif` — so until the woff2 loads, the
 * browser falls back to the system serif (Times New Roman), which clashes
 * visually and produces a jarring swap. We override the CSS variable + the
 * heading rules with a sans-serif system stack so the fallback already looks
 * close to the target font.
 */

:root {
  --ct-font-sans-serif: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/*
 * Sidenav: the theme switched from font-icons to inline SVG (lucide). SVG
 * glyphs don't share the text baseline the way font-icons did, so we re-add
 * an explicit cross-axis center on .menu-icon and force the svg to render
 * as a block (kills the inline whitespace that nudges the icon down).
 */
.menu-icon {
  align-items: center;
}
.menu-icon svg {
  display: block;
}

/*
 * Brand primary: the cobalt blue from the "e" in the UNEO logo.
 * The Adminto theme baked the primary hex value directly into Bootstrap
 * component classes (`.btn-primary { --ct-btn-bg:#188ae2 }`) instead of
 * referencing `var(--ct-primary)` — so overriding the token alone leaves
 * buttons/badges/alerts on the original blue. We rewire both the global
 * tokens AND the per-component tokens. To rebrand, change every occurrence
 * of #3651a6 / #2a3f7d / #dde3f3 / #9aa9d3 / 54,81,166 in this block.
 */
:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
  --ct-primary: #3651a6;
  --ct-primary-rgb: 54, 81, 166;
  --ct-primary-bg-subtle: #dde3f3;
  --ct-primary-border-subtle: #9aa9d3;
  --ct-primary-text-emphasis: #2a3f7d;
  --ct-link-color: #3651a6;
  --ct-link-color-rgb: 54, 81, 166;
  --ct-link-hover-color: #2a3f7d;
  --bs-primary: #3651a6;
  --bs-primary-rgb: 54, 81, 166;
  /* Sidenav active/hover: theme hardcoded the legacy blue here too. */
  --ct-menu-item-active-color: #3651a6;
  --ct-menu-item-hover-color: #3651a6;
  --ct-menu-item-hover-bg: rgba(54, 81, 166, 0.1);
}

.btn-primary {
  --ct-btn-bg: #3651a6;
  --ct-btn-border-color: #3651a6;
  --ct-btn-hover-bg: #2a3f7d;
  --ct-btn-hover-border-color: #2a3f7d;
  --ct-btn-active-bg: #2a3f7d;
  --ct-btn-active-border-color: #2a3f7d;
  --ct-btn-disabled-bg: #3651a6;
  --ct-btn-disabled-border-color: #3651a6;
  --ct-btn-focus-shadow-rgb: 54, 81, 166;
}
.btn-outline-primary {
  --ct-btn-color: #3651a6;
  --ct-btn-border-color: #3651a6;
  --ct-btn-hover-bg: #3651a6;
  --ct-btn-hover-border-color: #3651a6;
  --ct-btn-active-bg: #3651a6;
  --ct-btn-active-border-color: #3651a6;
  --ct-btn-focus-shadow-rgb: 54, 81, 166;
}
.text-primary { color: #3651a6 !important; }
.bg-primary { background-color: #3651a6 !important; }
.border-primary { border-color: #3651a6 !important; }
.badge.bg-primary { background-color: #3651a6 !important; }
.alert-primary {
  --ct-alert-color: #2a3f7d;
  --ct-alert-bg: #dde3f3;
  --ct-alert-border-color: #9aa9d3;
}

/*
 * Filter pills (ButtonGroup): rewire the hover/active states of
 * `.btn-outline-secondary` so they preview the primary color instead of
 * the indigo secondary fill. Scoped to `.btn-group` so other places that
 * use `outline-secondary` (one-off muted buttons) keep the original look.
 *
 * State story:
 *   default        → white bg, neutral border, muted text
 *   hover          → primary-bg-subtle fill, primary border, primary text
 *   active(.active)→ primary fill, white text   (selected pill)
 *   active+hover   → darker primary, white text
 */
.btn-group .btn-outline-secondary {
  --ct-btn-color: #6c757d;
  --ct-btn-border-color: #ced4da;
  --ct-btn-hover-color: #2a3f7d;
  --ct-btn-hover-bg: #dde3f3;
  --ct-btn-hover-border-color: #3651a6;
  --ct-btn-active-color: #fff;
  --ct-btn-active-bg: #3651a6;
  --ct-btn-active-border-color: #3651a6;
  --ct-btn-focus-shadow-rgb: 54, 81, 166;
}

/* When two selected pills sit next to each other their borders are the
 * same color as their fill, so the group reads as one solid block. Draw a
 * subtle 1px translucent-white divider between adjacent .btn-primary
 * children. Adjacent unselected/mixed pairs already have a contrasting
 * border so they don't need this. */
.btn-group > .btn-primary + .btn-primary {
  border-left-color: rgba(255, 255, 255, 0.25);
}

/* Outfit — used by h1-h6 */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/outfit-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/outfit-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Public Sans — body font, normal */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/public-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/public-sans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Public Sans — body font, italic */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/public-sans-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/google/public-sans-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
