/* ==========================================================================
   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);
}

/* Every select draws the same ink chevron.
   Applied to all of them, not just .form-select: various places use
   <select class="form-control">, and something in the stack suppresses the
   native caret there too, which left those controls with no affordance at all.
   Owning the caret for every select makes the class of bug impossible and
   gives one consistent mark. Multi-selects and list boxes are excluded —
   they do not open. */
select:not([multiple]):not([size]) {
  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);
}
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, select.form-control-sm {
  background-size: 10px 10px;
  padding-right: var(--rv-space-5);
  min-height: 36px;
}
/* select2 replaces the control with its own markup and draws its own arrow. */
select.select2-hidden-accessible { background-image: none; }
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; }
}
