/* ==========================================================================
   Revara — brand tokens and product layer
   Revara Brand Book, Edition 01 · July 2026 (parts 3 and 4, developer handoff).

   This file is the single source of truth for the look of AtomClaims.
   Reference the tokens, never a raw hex. It loads last so it wins over
   Bootstrap and the older HMD-era stylesheets.

   The five moves (page 16):
     01  a 2px ink rule opens every section
     02  a 2px #D6D3D1 rule separates items within it
     03  panels are flat white on the ground — no shadow, no radius
     04  everything aligns to a baseline; nothing centres except a lone mark
     05  one accent field per page, and one only
   ========================================================================== */

:root {
  /* Colour ------------------------------------------------------------- */
  --rv-ground:       #F3F2F2;
  --rv-surface:      #FFFFFF;
  --rv-ink:          #201E1D;
  --rv-ink-soft:     #6A6663;   /* secondary text                        */
  --rv-ink-mute:     #9A9491;   /* disabled, captions                    */
  --rv-rule:         #D6D3D1;   /* rules, dividers                       */
  --rv-accent:       #EC3013;   /* Ottawa Red — fields, marks, one button */
  --rv-accent-text:  #B4260F;   /* red type and links under 24px          */
  --rv-accent-tint:  #FBD5CF;   /* knockout                              */
  --rv-tagline-ink:  #8A8582;   /* tagline when it sits on the ink field  */

  /* Type ---------------------------------------------------------------- */
  --rv-font-display: 'Jost', system-ui, sans-serif;
  --rv-font-text:    'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --rv-track-mark:    0.13em;
  --rv-track-tagline: 0.30em;
  --rv-track-label:   0.14em;
  --rv-text-body:  16px;  --rv-leading-body:  1.5;
  --rv-text-label: 14px;  --rv-leading-label: 1.3;

  /* Space --------------------------------------------------------------- */
  --rv-space-1:  4px;
  --rv-space-2:  8px;
  --rv-space-3: 12px;
  --rv-space-4: 16px;
  --rv-space-5: 24px;
  --rv-space-6: 32px;
  --rv-space-7: 48px;
  --rv-space-8: 72px;

  /* Structure and motion ------------------------------------------------ */
  --rv-rule-weight: 2px;
  --rv-radius: 0;
  --rv-shadow: none;
  --rv-motion: 140ms ease-out;
  --rv-focus: 2px solid var(--rv-accent);

  /* --- Bootstrap remap. Everything downstream inherits from here. ------ */
  --bs-body-bg:          var(--rv-ground);
  --bs-body-color:       var(--rv-ink);
  --bs-body-font-family: var(--rv-font-text);
  --bs-body-font-size:   var(--rv-text-body);
  --bs-body-line-height: var(--rv-leading-body);
  --bs-font-sans-serif:  var(--rv-font-text);
  --bs-emphasis-color:   var(--rv-ink);
  --bs-secondary-color:  var(--rv-ink-soft);
  --bs-tertiary-color:   var(--rv-ink-mute);
  --bs-border-color:     var(--rv-rule);
  --bs-link-color:       var(--rv-accent-text);
  --bs-link-hover-color: var(--rv-accent);
  --bs-primary:          #EC3013;
  --bs-primary-rgb:      236, 48, 19;
  --bs-danger:           #EC3013;
  --bs-danger-rgb:       236, 48, 19;
  --bs-border-radius:    0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0;
  --bs-border-radius-2xl: 0;
  --bs-border-radius-pill: 0;
  --bs-box-shadow:    none;
  --bs-box-shadow-sm: none;
  --bs-box-shadow-lg: none;

  /* --- Legacy variables from common.css, pointed at Revara ------------- */
  --bg:        var(--rv-surface);
  --ink:       var(--rv-ink);
  --muted:     var(--rv-ink-soft);
  --border:    var(--rv-rule);
  --radius:    0;
  --shadow-sm: none;
  --header-bg:   var(--rv-ink);
  --header-text: var(--rv-surface);
  --accent-2:  var(--rv-ink-soft);
  --danger:    var(--rv-accent);
}

/* --------------------------------------------------------------------------
   1 · Ground rules
   -------------------------------------------------------------------------- */

html,
body {
  background: var(--rv-ground) !important;
  color: var(--rv-ink);
}

body {
  font-family: var(--rv-font-text) !important;
  font-size: var(--rv-text-body);
  line-height: var(--rv-leading-body);
  letter-spacing: 0;
}

/* Radius 0 and shadow none are deliberate. Depth in this system comes from
   flat panels on a warm ground, not from elevation. Overridden at the token
   layer rather than component by component. */
.card, .dropdown-menu, .modal-content, .toast, .alert, .btn, .badge,
.form-control, .form-select, .input-group-text, .nav-link, .list-group-item,
.page-link, .accordion-item, .accordion-button, .offcanvas, .popover,
.tooltip-inner, .progress, .table, .img-thumbnail, .figure-img,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.select2-dropdown, .swal2-popup, .swal2-actions button, .dataTables_wrapper .dt-button,
.tempus-dominus-widget, .rv-panel {
  border-radius: 0 !important;
  box-shadow: none !important;
}

::selection { background: var(--rv-accent); color: var(--rv-surface); }

/* --------------------------------------------------------------------------
   2 · Type — Jost speaks, Archivo explains
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
  font-family: var(--rv-font-display);
  font-weight: 500;
  color: var(--rv-ink);
  letter-spacing: 0.01em;
  text-wrap: pretty;
}

h1, .h1 { font-size: 34px; line-height: 39px; font-weight: 500; }
h2, .h2 { font-size: 24px; line-height: 29px; font-weight: 500; }
h3, .h3 { font-size: 18px; line-height: 23px; font-weight: 600; }
h4, .h4 { font-size: 16px; line-height: 22px; font-weight: 600; }
h5, .h5,
h6, .h6 { font-size: var(--rv-text-label); line-height: var(--rv-leading-label); font-weight: 600; }

.lead { font-size: 18px; line-height: 25px; font-weight: 600; font-family: var(--rv-font-text); }
small, .small { font-size: var(--rv-text-label); line-height: var(--rv-leading-label); }

/* Labels — Archivo 700, tracked, uppercase. Never Jost. */
.rv-label,
.form-label,
.table thead th,
.dataTables_wrapper thead th {
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-label);
  font-weight: 700;
  letter-spacing: var(--rv-track-label);
  text-transform: uppercase;
  color: var(--rv-ink);
}

.text-muted,
.text-secondary { color: var(--rv-ink-soft) !important; }
.rv-caption      { color: var(--rv-ink-mute); font-size: var(--rv-text-label); }

/* Tabular figures for money and dates. */
.rv-num, td.rv-num, .table td.text-end, .table th.text-end {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
}

a {
  color: var(--rv-accent-text);
  text-decoration: none;
  border-bottom: 1px solid var(--rv-accent);
  transition: color var(--rv-motion);
}
a:hover { color: var(--rv-accent); }
a.btn, a.nav-link, a.dropdown-item, a.navbar-brand, a.page-link,
a.list-group-item, a.rv-plain { border-bottom: 0; }

/* --------------------------------------------------------------------------
   3 · Rules, panels, sections
   -------------------------------------------------------------------------- */

.rv-section {
  border-top: var(--rv-rule-weight) solid var(--rv-ink);
  padding-top: var(--rv-space-4);
  margin-bottom: var(--rv-space-6);
}

.rv-section-title {
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-label);
  font-weight: 700;
  letter-spacing: var(--rv-track-label);
  text-transform: uppercase;
  color: var(--rv-accent-text);
  margin-bottom: var(--rv-space-2);
}

.rv-panel,
.card {
  background: var(--rv-surface);
  border: 0;
  border-top: var(--rv-rule-weight) solid var(--rv-ink);
  padding: var(--rv-space-5);
  margin-bottom: var(--rv-space-5);
}

.card-header {
  background: var(--rv-surface);
  border-bottom: var(--rv-rule-weight) solid var(--rv-rule);
  padding: 0 0 var(--rv-space-3);
  margin-bottom: var(--rv-space-4);
  font-family: var(--rv-font-display);
  font-weight: 500;
  font-size: 18px;
  color: var(--rv-ink);
}
.card-body   { padding: 0; }
.card-footer { background: var(--rv-surface); border-top: 2px solid var(--rv-rule); padding: var(--rv-space-3) 0 0; }

hr, .dropdown-divider {
  border: 0;
  border-top: var(--rv-rule-weight) solid var(--rv-rule);
  opacity: 1;
  margin: var(--rv-space-4) 0;
}

/* One accent field per page. Use sparingly — it is a signal, not decoration. */
.rv-field-accent {
  background: var(--rv-accent);
  color: var(--rv-surface);
  padding: var(--rv-space-5);
}
.rv-field-accent a,
.rv-field-accent h1, .rv-field-accent h2, .rv-field-accent h3 { color: var(--rv-surface); }

.rv-field-ink {
  background: var(--rv-ink);
  color: var(--rv-ground);
  padding: var(--rv-space-5);
}
.rv-field-ink h1, .rv-field-ink h2, .rv-field-ink h3 { color: var(--rv-surface); }

/* --------------------------------------------------------------------------
   4 · Controls — 44px hit targets, square, one primary per view
   -------------------------------------------------------------------------- */

.btn {
  --bs-btn-border-radius: 0;
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-label);
  font-weight: 600;
  letter-spacing: 0.01em;
  min-height: 44px;
  padding: var(--rv-space-3) var(--rv-space-5);
  border-width: 2px;
  border-radius: 0;
  transition: background var(--rv-motion), color var(--rv-motion), border-color var(--rv-motion);
}
.btn-sm { min-height: 36px; padding: var(--rv-space-2) var(--rv-space-3); font-size: 13px; }
.btn-lg { min-height: 52px; font-size: var(--rv-text-body); }

/* The one primary button: accent filled. */
.btn-primary,
.btn-danger,
.rv-btn {
  background: var(--rv-accent);
  border-color: var(--rv-accent);
  color: var(--rv-surface);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-danger:hover,  .btn-danger:focus,  .btn-danger:active,
.rv-btn:hover,      .rv-btn:focus,      .rv-btn:active {
  background: var(--rv-accent-text);
  border-color: var(--rv-accent-text);
  color: var(--rv-surface);
}

/* Everything else is quiet: ink outline, or ink fill for a strong secondary. */
.btn-secondary, .btn-outline-secondary, .btn-outline-primary,
.btn-outline-danger, .btn-light, .btn-outline-light, .btn-info,
.btn-outline-info, .btn-warning, .btn-outline-warning, .rv-btn-quiet {
  background: transparent;
  border-color: var(--rv-ink);
  color: var(--rv-ink);
}
.btn-secondary:hover, .btn-outline-secondary:hover, .btn-outline-primary:hover,
.btn-outline-danger:hover, .btn-light:hover, .btn-outline-light:hover,
.btn-info:hover, .btn-outline-info:hover, .btn-warning:hover,
.btn-outline-warning:hover, .rv-btn-quiet:hover {
  background: var(--rv-ink);
  border-color: var(--rv-ink);
  color: var(--rv-surface);
}

.btn-success, .btn-outline-success, .btn-dark {
  background: var(--rv-ink);
  border-color: var(--rv-ink);
  color: var(--rv-surface);
}
.btn-success:hover, .btn-outline-success:hover, .btn-dark:hover {
  background: var(--rv-ink-soft);
  border-color: var(--rv-ink-soft);
  color: var(--rv-surface);
}

.btn-link { color: var(--rv-accent-text); border: 0; text-decoration: none; border-bottom: 1px solid var(--rv-accent); min-height: 0; padding: 0; }

.btn:disabled, .btn.disabled {
  background: transparent;
  border-color: var(--rv-rule);
  color: var(--rv-ink-mute);
  opacity: 1;
}

/* Focus is never removed. 2px accent, 2px offset. */
:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible {
  outline: var(--rv-focus);
  outline-offset: 2px;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   5 · Forms
   -------------------------------------------------------------------------- */

.form-control,
.form-select,
.input-group-text,
input[type='text'], input[type='password'], input[type='email'],
input[type='number'], input[type='date'], input[type='search'],
textarea, select {
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-body);
  color: var(--rv-ink);
  /* background-color, NOT the background shorthand: .form-select draws its
     caret with background-image, and the shorthand silently erased it —
     every Bootstrap select then read as plain underlined text. */
  background-color: var(--rv-surface);
  border: 0;
  border-bottom: 2px solid var(--rv-rule);
  border-radius: 0;
  min-height: 44px;
  padding: var(--rv-space-2) var(--rv-space-3);
  transition: border-color var(--rv-motion);
}

/* Bootstrap sets appearance:none on .form-select, so the caret is ours to
   draw. A plain ink chevron — the affordance is what tells a user the control
   opens. Bare <select> keeps the native caret and needs nothing. */
.form-select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23201E1D' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right var(--rv-space-3) center;
  background-size: 12px 12px;
  padding-right: var(--rv-space-6);
}
.form-select:disabled {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%239A9491' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}
.form-select-sm { background-size: 10px 10px; padding-right: var(--rv-space-5); min-height: 36px; }
textarea, textarea.form-control { min-height: 88px; }

.form-control:focus,
.form-select:focus,
input:focus, textarea:focus, select:focus {
  border-bottom-color: var(--rv-ink);
  background: var(--rv-surface);
  color: var(--rv-ink);
}

.form-control::placeholder,
input::placeholder, textarea::placeholder { color: var(--rv-ink-mute); }

.form-control:disabled, .form-control[readonly], input:disabled, select:disabled {
  background: var(--rv-ground);
  color: var(--rv-ink-mute);
}

.form-label {
  margin-bottom: var(--rv-space-1);
}

.form-check-input        { border-radius: 0; border: 2px solid var(--rv-ink); }
.form-check-input:checked { background-color: var(--rv-accent); border-color: var(--rv-accent); }
.form-check-input:focus   { box-shadow: none; outline: var(--rv-focus); outline-offset: 2px; }
.form-check-input[type='radio'] { border-radius: 50%; }

.invalid-feedback, .text-danger { color: var(--rv-accent-text) !important; }
.is-invalid, .form-control.is-invalid { border-bottom-color: var(--rv-accent) !important; }

/* --------------------------------------------------------------------------
   6 · Tables — ink rule under the header, #D6D3D1 between rows,
        nothing around the outside
   -------------------------------------------------------------------------- */

.table,
table.dataTable {
  --bs-table-bg: var(--rv-surface);
  --bs-table-color: var(--rv-ink);
  --bs-table-border-color: var(--rv-rule);
  --bs-table-striped-bg: var(--rv-ground);
  --bs-table-hover-bg: var(--rv-accent-tint);
  --bs-table-accent-bg: transparent;
  width: 100%;
  background: var(--rv-surface);
  border: 0;
  font-size: var(--rv-text-label);
  border-collapse: collapse;
}

.table > :not(caption) > * > *,
table.dataTable > tbody > tr > td,
table.dataTable > tbody > tr > th {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--rv-rule);
  padding: var(--rv-space-3) var(--rv-space-3);
  vertical-align: middle;
  color: var(--rv-ink);
  box-shadow: none;
}

.table thead th,
table.dataTable thead th,
table.dataTable thead td {
  background: var(--rv-surface) !important;
  color: var(--rv-ink) !important;
  border: 0 !important;
  border-bottom: var(--rv-rule-weight) solid var(--rv-ink) !important;
  padding: var(--rv-space-2) var(--rv-space-3);
  white-space: nowrap;
}

.table > tbody > tr:hover > * { background: var(--rv-ground) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background: transparent; }
.table-bordered > :not(caption) > * > * { border: 0; border-bottom: 1px solid var(--rv-rule); }

/* Status reads as a word, never as colour alone. */
.badge, .pill {
  display: inline-block;
  font-family: var(--rv-font-text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: var(--rv-track-label);
  text-transform: uppercase;
  border-radius: 0 !important;
  padding: 3px var(--rv-space-2);
  background: var(--rv-ground);
  color: var(--rv-ink-soft);
  border-left: var(--rv-rule-weight) solid var(--rv-ink-mute);
}
.badge.bg-success, .pill.accepted, .badge.bg-primary, .pill.parsed {
  background: var(--rv-ground); color: var(--rv-ink); border-left-color: var(--rv-ink);
}
.badge.bg-danger, .pill.rejected, .pill.failed {
  background: var(--rv-accent-tint); color: var(--rv-accent-text); border-left-color: var(--rv-accent);
}
.badge.bg-warning, .pill.rules_running, .pill.received {
  background: var(--rv-ground); color: var(--rv-ink-soft); border-left-color: var(--rv-ink-mute);
}

/* --------------------------------------------------------------------------
   7 · Navigation — 2px ink rule under it, active item a 2px accent underline
   -------------------------------------------------------------------------- */

.rv-nav {
  background: var(--rv-surface);
  border-bottom: var(--rv-rule-weight) solid var(--rv-ink);
}

.rv-nav .nav-link,
.rv-nav a.rv-nav-item {
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-label);
  font-weight: 600;
  color: var(--rv-ink-soft);
  padding: var(--rv-space-3) var(--rv-space-3);
  border: 0;
  border-bottom: var(--rv-rule-weight) solid transparent;
  border-radius: 0;
  background: transparent;
  transition: color var(--rv-motion), border-color var(--rv-motion);
}
.rv-nav .nav-link:hover,
.rv-nav a.rv-nav-item:hover { color: var(--rv-ink); background: transparent; }

/* Never a filled pill. */
.rv-nav .nav-link.active,
.rv-nav a.rv-nav-item.active,
.rv-nav .nav-link.show {
  color: var(--rv-ink);
  background: transparent;
  border-bottom-color: var(--rv-accent);
}

.dropdown-menu {
  background: var(--rv-surface);
  border: 0;
  border-top: var(--rv-rule-weight) solid var(--rv-ink);
  padding: var(--rv-space-2);
  margin-top: 0;
}
.dropdown-item {
  font-size: var(--rv-text-label);
  color: var(--rv-ink-soft);
  padding: var(--rv-space-2) var(--rv-space-3);
  border-radius: 0;
}
.dropdown-item:hover, .dropdown-item:focus {
  background: var(--rv-ground);
  color: var(--rv-ink);
}
.dropdown-item.active, .dropdown-item:active {
  background: var(--rv-ground);
  color: var(--rv-accent-text);
}

.breadcrumb { font-size: var(--rv-text-label); }
.breadcrumb-item + .breadcrumb-item::before { content: '·'; color: var(--rv-ink-mute); }

.pagination .page-link {
  border: 0;
  border-bottom: var(--rv-rule-weight) solid transparent;
  color: var(--rv-ink-soft);
  background: transparent;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pagination .page-item.active .page-link {
  background: transparent;
  color: var(--rv-ink);
  border-bottom-color: var(--rv-accent);
}

/* --------------------------------------------------------------------------
   8 · Feedback — alerts, toasts, modals
   -------------------------------------------------------------------------- */

.alert {
  background: var(--rv-surface);
  border: 0;
  border-left: 4px solid var(--rv-ink);
  color: var(--rv-ink);
  padding: var(--rv-space-4);
  font-size: var(--rv-text-label);
}
.alert-danger, .alert.error   { border-left-color: var(--rv-accent); background: var(--rv-accent-tint); color: var(--rv-accent-text); }
.alert-success, .alert.ok     { border-left-color: var(--rv-ink); background: var(--rv-ground); color: var(--rv-ink); }
.alert-warning, .alert-info   { border-left-color: var(--rv-ink-mute); background: var(--rv-ground); color: var(--rv-ink-soft); }

.modal-content { background: var(--rv-surface); border: 0; }
.modal-header  { border-bottom: var(--rv-rule-weight) solid var(--rv-ink); padding: var(--rv-space-4) var(--rv-space-5); }
.modal-title   { font-family: var(--rv-font-display); font-weight: 500; font-size: 24px; }
.modal-body    { padding: var(--rv-space-5); }
.modal-footer  { border-top: var(--rv-rule-weight) solid var(--rv-rule); padding: var(--rv-space-4) var(--rv-space-5); }
.modal-backdrop.show { background: var(--rv-ink); opacity: .72; }

.toast {
  background: var(--rv-ink);
  color: var(--rv-surface);
  border: 0;
  border-left: 4px solid var(--rv-accent);
}
.toast.bg-success { background: var(--rv-ink) !important; border-left-color: var(--rv-surface); }
.toast.bg-danger  { background: var(--rv-ink) !important; border-left-color: var(--rv-accent); }
.toast .toast-body { font-size: var(--rv-text-label); }

/* --------------------------------------------------------------------------
   9 · Third-party libraries dragged into line
   -------------------------------------------------------------------------- */

/* DataTables */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  border: 0;
  border-bottom: 2px solid var(--rv-rule);
  border-radius: 0;
  min-height: 40px;
  padding: 0 var(--rv-space-2);
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter { font-size: var(--rv-text-label); color: var(--rv-ink-soft); }
.dataTables_wrapper .dataTables_paginate .paginate_button {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--rv-ink-soft) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: transparent !important;
  color: var(--rv-ink) !important;
  border-bottom: var(--rv-rule-weight) solid var(--rv-accent) !important;
}
.dataTables_wrapper .dt-button,
div.dt-buttons .btn {
  background: transparent !important;
  border: 2px solid var(--rv-ink) !important;
  color: var(--rv-ink) !important;
  font-size: 13px;
  font-weight: 600;
  border-radius: 0 !important;
}
.dataTables_wrapper .dt-button:hover,
div.dt-buttons .btn:hover { background: var(--rv-ink) !important; color: var(--rv-surface) !important; }
table.dataTable tbody tr.selected > * { box-shadow: none !important; background: var(--rv-accent-tint) !important; color: var(--rv-ink) !important; }

/* Select2 */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  border: 0;
  border-bottom: 2px solid var(--rv-rule);
  border-radius: 0;
  min-height: 44px;
  background: var(--rv-surface);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 42px;
  color: var(--rv-ink);
  padding-left: var(--rv-space-3);
}
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
.select2-dropdown { border: 0; border-top: var(--rv-rule-weight) solid var(--rv-ink); border-radius: 0; }
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--rv-ground); color: var(--rv-ink);
}
.select2-container--default .select2-results__option[aria-selected='true'] {
  background: var(--rv-accent-tint); color: var(--rv-accent-text);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--rv-ground); border: 0; border-left: 2px solid var(--rv-accent);
  border-radius: 0; color: var(--rv-ink); padding: 2px var(--rv-space-2);
}

/* SweetAlert2 */
.swal2-popup { border-radius: 0 !important; font-family: var(--rv-font-text); background: var(--rv-surface); }
.swal2-title { font-family: var(--rv-font-display); font-weight: 500; color: var(--rv-ink); }
.swal2-html-container { color: var(--rv-ink-soft); font-size: var(--rv-text-body); }
.swal2-confirm.swal2-styled {
  background: var(--rv-accent) !important; border-radius: 0 !important;
  min-height: 44px; font-weight: 600; box-shadow: none !important;
}
.swal2-cancel.swal2-styled {
  background: transparent !important; border: 2px solid var(--rv-ink) !important;
  color: var(--rv-ink) !important; border-radius: 0 !important; min-height: 44px; font-weight: 600;
}
.swal2-icon { border-radius: 0 !important; }

/* Tempus Dominus */
.tempus-dominus-widget { border-radius: 0 !important; border: 0; border-top: 2px solid var(--rv-ink); background: var(--rv-surface); }
.tempus-dominus-widget .date-container-days .day.active,
.tempus-dominus-widget .toolbar div:hover { background: var(--rv-accent) !important; color: var(--rv-surface) !important; border-radius: 0 !important; }

/* --------------------------------------------------------------------------
   10 · Signature — mark + wordmark, drawn from tokens
        The mark is the supplied geometry: outer arc 270 deg from 12 o'clock
        clockwise r38, inner arc 90 deg r22 inside the gap, stroke 11, butt caps.
   -------------------------------------------------------------------------- */

.rv-signature {
  display: inline-flex;
  align-items: center;
  gap: 0.34em;              /* stroke x 2.7, relative to the mark */
  text-decoration: none;
  border-bottom: 0;
  line-height: 1;
}
.rv-signature:hover { text-decoration: none; }

.rv-signature .rv-mark {
  display: block;
  flex: 0 0 auto;
  width: 2.5em;             /* mark reads 2.5x the wordmark cap height */
  height: 2.5em;
}
.rv-signature .rv-mark .rv-mark-outer { stroke: var(--rv-ink); }
.rv-signature .rv-mark .rv-mark-inner { stroke: var(--rv-accent); }

.rv-signature .rv-words { display: flex; flex-direction: column; gap: 0.34em; }

.rv-signature .rv-wordmark {
  font-family: var(--rv-font-display);
  font-weight: 500;
  font-size: 1em;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: var(--rv-track-mark);
  color: var(--rv-ink);
  white-space: nowrap;
}

/* Three words, fixed. Part of the signature, not a piece of copy. */
.rv-signature .rv-tagline {
  font-family: var(--rv-font-display);
  font-weight: 500;
  font-size: 0.21em;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: var(--rv-track-tagline);
  color: var(--rv-ink-soft);
  white-space: nowrap;
}

/* Below 120px the tagline is dropped, never scaled down. */
.rv-signature.rv-compact .rv-tagline { display: none; }

/* Reversed, for ink and accent fields. */
.rv-signature.rv-on-ink .rv-mark .rv-mark-outer,
.rv-signature.rv-on-ink .rv-wordmark { stroke: var(--rv-surface); color: var(--rv-surface); }
.rv-signature.rv-on-ink .rv-tagline  { color: var(--rv-tagline-ink); }

.rv-signature.rv-on-accent .rv-mark .rv-mark-outer { stroke: var(--rv-surface); }
.rv-signature.rv-on-accent .rv-mark .rv-mark-inner { stroke: var(--rv-surface); }
.rv-signature.rv-on-accent .rv-wordmark { color: var(--rv-surface); }
.rv-signature.rv-on-accent .rv-tagline  { color: var(--rv-accent-tint); }

/* --------------------------------------------------------------------------
   10b · Assistant widget
        Loaded after chatbot.css, so these win without !important.
   -------------------------------------------------------------------------- */

.px-chat-toggle {
  border-radius: 0;
  background: var(--rv-accent);
  color: var(--rv-surface);
  border: 0;
  box-shadow: none;
  width: 48px;
  height: 48px;
  transition: background var(--rv-motion);
}
.px-chat-toggle:hover { transform: none; box-shadow: none; background: var(--rv-accent-text); }
.px-chat-toggle:focus-visible { outline: var(--rv-focus); outline-offset: 2px; }

.px-chat-panel {
  background: var(--rv-surface);
  border-radius: 0;
  border-top: var(--rv-rule-weight) solid var(--rv-ink);
  box-shadow: none;
  transform: translateY(8px);
  transition: transform var(--rv-motion), opacity var(--rv-motion);
}
.px-chat-panel.open { transform: translateY(0); }

.px-chat-header {
  background: var(--rv-ink);
  color: var(--rv-surface);
  border-bottom: 0;
}
.px-chat-header-title { font-family: var(--rv-font-display); font-weight: 500; }
.px-chat-header-title i { color: var(--rv-accent); }
.px-chat-header-sub {
  font-size: 12px; font-weight: 700; letter-spacing: var(--rv-track-label);
  text-transform: uppercase; color: var(--rv-ink-mute);
}
.px-chat-header-close { color: var(--rv-ground); border-radius: 0; }
.px-chat-header-close:hover { color: var(--rv-accent); }

.px-msg-avatar { border-radius: 0; }
.px-msg.assistant .px-msg-avatar { background: var(--rv-ink); color: var(--rv-surface); }
.px-msg.user .px-msg-avatar      { background: var(--rv-ink-soft); color: var(--rv-surface); }

.px-msg-bubble { border-radius: 0; font-size: var(--rv-text-label); }
.px-msg.assistant .px-msg-bubble { background: var(--rv-ground); color: var(--rv-ink); }
.px-msg.user .px-msg-bubble      { background: var(--rv-ink); color: var(--rv-surface); }

.px-typing-dots span { border-radius: 0; background: var(--rv-ink-mute); }
.px-thinking-msg     { color: var(--rv-ink-mute); }

.px-suggestion-chip {
  background: var(--rv-surface);
  border: 0;
  border-left: var(--rv-rule-weight) solid var(--rv-rule);
  border-radius: 0;
  color: var(--rv-ink-soft);
  font-size: 13px;
  font-weight: 600;
}
.px-suggestion-chip:hover { background: var(--rv-ground); border-left-color: var(--rv-accent); color: var(--rv-ink); }

.px-chat-input-area { border-top: var(--rv-rule-weight) solid var(--rv-rule); background: var(--rv-surface); }
.px-chat-input {
  border: 0;
  border-bottom: 2px solid var(--rv-rule);
  border-radius: 0;
  font-family: var(--rv-font-text);
  font-size: var(--rv-text-label);
  color: var(--rv-ink);
}
.px-chat-input:focus { border-bottom-color: var(--rv-ink); }

.px-chat-send {
  border-radius: 0;
  background: var(--rv-accent);
  color: var(--rv-surface);
  border: 0;
}
.px-chat-send:hover    { background: var(--rv-accent-text); }
.px-chat-send:disabled { background: var(--rv-ink-mute); }
.px-chat-messages::-webkit-scrollbar-thumb { background: var(--rv-rule); border-radius: 0; }

/* --------------------------------------------------------------------------
   11 · Metric — flat white on the ground, no shadow (page 23)
   -------------------------------------------------------------------------- */

.rv-metrics { display: flex; flex-wrap: wrap; gap: var(--rv-space-4); margin-bottom: var(--rv-space-6); }

.rv-metric {
  flex: 1 1 160px;
  background: var(--rv-ground);
  border-top: var(--rv-rule-weight) solid var(--rv-ink);
  padding: var(--rv-space-3) var(--rv-space-4) var(--rv-space-4);
}
.rv-metric-label {
  font-family: var(--rv-font-text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: var(--rv-track-label);
  text-transform: uppercase;
  color: var(--rv-ink-soft);
  margin-bottom: var(--rv-space-2);
}
.rv-metric-value {
  font-family: var(--rv-font-display);
  font-weight: 500;
  font-size: 34px;
  line-height: 1;
  color: var(--rv-ink);
  font-variant-numeric: tabular-nums;
}
.rv-metric.rv-metric-accent .rv-metric-value { color: var(--rv-accent-text); }

/* --------------------------------------------------------------------------
   12 · Retiring the previous system
        Gradients, glass, coloured glows and pill radii all came from the
        HMD-era sheets. Neutralised here so old markup lands on the grid.
   -------------------------------------------------------------------------- */

.hmd-header, .atomquark-header, .atomquark-footer, .hmd-footer {
  background: var(--rv-surface) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}
.atomquark-header::before, .hmd-header::before { display: none !important; }

.rounded, .rounded-1, .rounded-2, .rounded-3, .rounded-circle, .rounded-pill,
.shadow, .shadow-sm, .shadow-lg { border-radius: 0 !important; box-shadow: none !important; }

.bg-primary, .bg-info, .bg-success { background-color: var(--rv-ink) !important; color: var(--rv-surface); }
.bg-danger, .bg-warning { background-color: var(--rv-accent) !important; color: var(--rv-surface); }
.bg-light { background-color: var(--rv-ground) !important; }
.bg-dark  { background-color: var(--rv-ink) !important; }
.text-primary, .text-success, .text-info { color: var(--rv-ink) !important; }
.text-danger, .text-warning { color: var(--rv-accent-text) !important; }
.text-white { color: var(--rv-surface) !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}
