/**
 * The palette: contrast first, then saturation.
 *
 * ---------------------------------------------------------------------------
 * ROUND ONE (e51627e) — THE STOCK PALETTE FAILED AA.
 * ---------------------------------------------------------------------------
 * The screen was reported as looking "faint, is there an opacity layer". There
 * is no opacity layer. Six of the theme's seven colours fail WCAG AA against a
 * white card:
 *
 *   role              stock      ratio
 *   muted / labels    #8a969c    3.03
 *   success (money)   #0acf97    2.02
 *   info              #39afd1    2.55
 *   warning           #ffbc00    1.69
 *   danger            #fa5c7c    3.05
 *   primary (links)   #727cf5    3.55
 *
 * Round one kept each hue and took lightness down until it passed.
 *
 * ---------------------------------------------------------------------------
 * ROUND TWO — PASSING WAS NOT ENOUGH. IT STILL READ FAINT.
 * ---------------------------------------------------------------------------
 * Taking lightness down without adding chroma produced muddy mid-tones —
 * #0a7d5c teal, #2a7a93 slate-blue, #8a6500 olive. They passed AA and still
 * looked grey, because they WERE mostly grey. The report came back unchanged:
 * "the colours look faint, I want it to pop".
 *
 * So round two keeps the contrast floor and replaces the hues with clean,
 * saturated ones. Primary is a deep ledger blue rather than a bright one:
 * this is a lender's back office, and the brand it sits beside is navy
 * #0c2a4d and green #39a455.
 *
 *   role       text (>= 4.5:1 on white)   fill (>= 3:1, bars)
 *   primary    #1f4e8c   8.31             #1f4e8c   8.31
 *   success    #15803d   5.02             #2f8f48   4.08  (the logo's green, deepened)
 *   info       #0e7490   5.36             #0e7490   5.36
 *   warning    #b45309   5.02             #d97706   3.19
 *   danger     #dc2626   4.83             #dc2626   4.83
 *   muted      #5b6b80   5.44  (5.07 on the page background)
 *
 * TWO COLOURS PER ROLE WHERE IT MATTERS. Text needs 4.5:1; a bar needs 3:1
 * (WCAG 1.4.11). The fills live in `brand.css` as `--vv-fill-*`.
 *
 * Every ratio above was measured, not chosen by eye.
 *
 * ---------------------------------------------------------------------------
 * DARK MODE HAS ITS OWN VALUES.
 * ---------------------------------------------------------------------------
 * The theme declares its palette on `:root` only, so round one's darkened
 * colours also applied to dark mode — #4a56c7 text on a #37404a card is
 * 2.1:1. The block at the foot restores light-on-dark variants, measured
 * against the dark card.
 *
 * `--ct-*` and not `--bs-*`: this theme is compiled with `$prefix: ct`.
 */

:root {
  --ct-primary: #1f4e8c;
  --ct-primary-rgb: 31, 78, 140;
  --ct-link-color: #1f4e8c;
  --ct-link-color-rgb: 31, 78, 140;
  --ct-link-hover-color: #173d6f;
  --ct-link-hover-color-rgb: 23, 61, 111;

  --ct-success: #15803d;
  --ct-success-rgb: 21, 128, 61;

  --ct-info: #0e7490;
  --ct-info-rgb: 14, 116, 144;

  /* Yellow cannot carry text on white without turning brown; amber-700 is
     the most saturated warning that passes. */
  --ct-warning: #b45309;
  --ct-warning-rgb: 180, 83, 9;

  --ct-danger: #dc2626;
  --ct-danger-rgb: 220, 38, 38;

  --ct-secondary: #5b6b80;
  --ct-secondary-rgb: 91, 107, 128;

  --ct-text-muted: #5b6b80;
  --ct-component-active-bg: #1f4e8c;
}

html[data-theme="dark"] {
  /* Measured against the dark card, #37404a. */
  --ct-primary: #8ab4ff; /* 5.04 */
  --ct-primary-rgb: 138, 180, 255;
  --ct-link-color: #8ab4ff;
  --ct-link-color-rgb: 138, 180, 255;
  --ct-link-hover-color: #b3cdff;
  --ct-link-hover-color-rgb: 179, 205, 255;
  --ct-success: #4ade80; /* 6.04 */
  --ct-success-rgb: 74, 222, 128;
  --ct-info: #67e8f9; /* 7.26 */
  --ct-info-rgb: 103, 232, 249;
  --ct-warning: #fbbf24; /* 6.31 */
  --ct-warning-rgb: 251, 191, 36;
  --ct-danger: #fda4af; /* 5.57 */
  --ct-danger-rgb: 253, 164, 175;
  --ct-secondary: #aab8c5; /* 5.20 */
  --ct-secondary-rgb: 170, 184, 197;
  --ct-text-muted: #aab8c5;
  --ct-component-active-bg: #3b6ff0;
}

/* `.text-muted` is the most common class on these screens — captions, table
   headers, tile descriptions. Bootstrap compiles its colour in, so it has to
   be pointed back at the variable. */
.text-muted {
  color: var(--ct-text-muted) !important;
}

/* Bootstrap's contextual text helpers are used directly on figures — the
   money totals are `.text-success` — so they have to follow the variables
   rather than keep the stock hex Bootstrap compiled in. */
.text-primary { color: var(--ct-primary) !important; }
.text-success { color: var(--ct-success) !important; }
.text-info { color: var(--ct-info) !important; }
.text-warning { color: var(--ct-warning) !important; }
.text-danger { color: var(--ct-danger) !important; }

/* `.btn-link` compiles its colour in rather than reading `--ct-link-color`.
   These are the "Open →" links on every dashboard tile. */
.btn-link {
  color: var(--ct-primary);
}

.btn-link:hover,
.btn-link:focus {
  color: var(--ct-link-hover-color);
}

/* Solid buttons compile the stock hex into their own variables, so the
   palette above never reached them: the topbar's Search button was still
   #727cf5 lavender under white text (3.55:1). White on each of these is the
   text ratio in the table above.

   Flat: the theme gives solid buttons a coloured glow (`box-shadow: 0 2px 6px
   rgba(primary, .5)`), which is the one soft edge left on the screen. */
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
  box-shadow: none;
}

.btn-primary {
  --ct-btn-bg: #1f4e8c;
  --ct-btn-border-color: #1f4e8c;
  --ct-btn-hover-bg: #173d6f;
  --ct-btn-hover-border-color: #173d6f;
  --ct-btn-active-bg: #132f55;
  --ct-btn-active-border-color: #132f55;
  --ct-btn-disabled-bg: #1f4e8c;
  --ct-btn-disabled-border-color: #1f4e8c;
  --ct-btn-focus-shadow-rgb: 31, 78, 140;
}

.btn-success {
  --ct-btn-bg: #15803d;
  --ct-btn-border-color: #15803d;
  --ct-btn-hover-bg: #166534;
  --ct-btn-hover-border-color: #166534;
  --ct-btn-active-bg: #14532d;
  --ct-btn-active-border-color: #14532d;
  --ct-btn-disabled-bg: #15803d;
  --ct-btn-disabled-border-color: #15803d;
  --ct-btn-focus-shadow-rgb: 21, 128, 61;
}

.btn-info {
  --ct-btn-color: #fff;
  --ct-btn-hover-color: #fff;
  --ct-btn-active-color: #fff;
  --ct-btn-bg: #0e7490;
  --ct-btn-border-color: #0e7490;
  --ct-btn-hover-bg: #155e75;
  --ct-btn-hover-border-color: #155e75;
  --ct-btn-active-bg: #164e63;
  --ct-btn-active-border-color: #164e63;
  --ct-btn-disabled-bg: #0e7490;
  --ct-btn-disabled-border-color: #0e7490;
  --ct-btn-focus-shadow-rgb: 14, 116, 144;
}

.btn-warning {
  --ct-btn-color: #fff;
  --ct-btn-hover-color: #fff;
  --ct-btn-active-color: #fff;
  --ct-btn-bg: #b45309;
  --ct-btn-border-color: #b45309;
  --ct-btn-hover-bg: #92400e;
  --ct-btn-hover-border-color: #92400e;
  --ct-btn-active-bg: #78350f;
  --ct-btn-active-border-color: #78350f;
  --ct-btn-disabled-bg: #b45309;
  --ct-btn-disabled-border-color: #b45309;
  --ct-btn-focus-shadow-rgb: 180, 83, 9;
}

.btn-danger {
  --ct-btn-bg: #dc2626;
  --ct-btn-border-color: #dc2626;
  --ct-btn-hover-bg: #b91c1c;
  --ct-btn-hover-border-color: #b91c1c;
  --ct-btn-active-bg: #991b1b;
  --ct-btn-active-border-color: #991b1b;
  --ct-btn-disabled-bg: #dc2626;
  --ct-btn-disabled-border-color: #dc2626;
  --ct-btn-focus-shadow-rgb: 220, 38, 38;
}

/* ---------------------------------------------------------------------------
 * PALE BADGES.
 * ---------------------------------------------------------------------------
 * The theme's `badge-*-lighten` sets its text to its own hard-coded light
 * colour (`#ffc35a` warning, `#0acf97` success) on an 18% tint of the same
 * colour, so a status badge read at 1.5 to 2.5 to 1: "Partially settled",
 * "Issued", "Draft" and "Settled" looked faded (25 September 2026). The
 * palette above never reached them because the theme writes the colour, not
 * a variable. Here each badge takes a deeper shade of the palette's hue on a
 * 14% tint.
 *
 * Measured worst case over white, the page and a striped table row:
 *   light  primary 6.03  success 6.86  info 5.43  warning 5.78
 *          danger 6.05   secondary 6.70  dark 10.14
 *   dark   primary 5.32  success 5.59  info 5.72  warning 5.62
 *          danger 5.44   secondary 5.56
 *
 * `.badge.badge-*` outranks the theme's single-class rule, which is also
 * `!important` on the colour variable.
 */
.badge.badge-primary-lighten { --ct-badge-color: #1f4e8c !important; background-color: rgba(31, 78, 140, 0.14) !important; }
.badge.badge-success-lighten { --ct-badge-color: #14532d !important; background-color: rgba(21, 128, 61, 0.14) !important; }
.badge.badge-info-lighten { --ct-badge-color: #155e75 !important; background-color: rgba(14, 116, 144, 0.14) !important; }
.badge.badge-warning-lighten { --ct-badge-color: #8a3c04 !important; background-color: rgba(180, 83, 9, 0.14) !important; }
.badge.badge-danger-lighten { --ct-badge-color: #991b1b !important; background-color: rgba(220, 38, 38, 0.14) !important; }
.badge.badge-secondary-lighten { --ct-badge-color: #3f4b5b !important; background-color: rgba(91, 107, 128, 0.14) !important; }
.badge.badge-dark-lighten { --ct-badge-color: #1e293b !important; background-color: rgba(30, 41, 59, 0.14) !important; }

html[data-theme="dark"] .badge.badge-primary-lighten { --ct-badge-color: #c7dbff !important; background-color: rgba(138, 180, 255, 0.16) !important; }
html[data-theme="dark"] .badge.badge-success-lighten { --ct-badge-color: #a7f3c0 !important; background-color: rgba(74, 222, 128, 0.16) !important; }
html[data-theme="dark"] .badge.badge-info-lighten { --ct-badge-color: #b3f5fc !important; background-color: rgba(103, 232, 249, 0.16) !important; }
html[data-theme="dark"] .badge.badge-warning-lighten { --ct-badge-color: #fde28a !important; background-color: rgba(251, 191, 36, 0.16) !important; }
html[data-theme="dark"] .badge.badge-danger-lighten { --ct-badge-color: #fed2d8 !important; background-color: rgba(253, 164, 175, 0.16) !important; }
html[data-theme="dark"] .badge.badge-secondary-lighten { --ct-badge-color: #d9e1e8 !important; background-color: rgba(170, 184, 197, 0.16) !important; }
html[data-theme="dark"] .badge.badge-dark-lighten { --ct-badge-color: #e2e8f0 !important; background-color: rgba(226, 232, 240, 0.12) !important; }

/* The same pairing written as utilities: `bg-*-lighten` with `text-*`, as on
 * the disbursement queue's "Contract not accepted" and the timeline icons.
 * The palette's text colour alone reads at about 4.1 to 1 on that tint, so
 * the pair takes the badge's deeper shade. */
.bg-primary-lighten.text-primary { color: #1f4e8c !important; }
.bg-success-lighten.text-success { color: #14532d !important; }
.bg-info-lighten.text-info { color: #155e75 !important; }
.bg-warning-lighten.text-warning { color: #8a3c04 !important; }
.bg-danger-lighten.text-danger { color: #991b1b !important; }
html[data-theme="dark"] .bg-primary-lighten.text-primary { color: #c7dbff !important; }
html[data-theme="dark"] .bg-success-lighten.text-success { color: #a7f3c0 !important; }
html[data-theme="dark"] .bg-info-lighten.text-info { color: #b3f5fc !important; }
html[data-theme="dark"] .bg-warning-lighten.text-warning { color: #fde28a !important; }
html[data-theme="dark"] .bg-danger-lighten.text-danger { color: #fed2d8 !important; }

/* A badge in a table cell was 0.75em of an already small row, about 10px,
 * too small to read at a glance. Status in a table is read at a glance. */
.table .badge {
  font-size: 0.8rem;
  padding: 0.3em 0.55em;
}