/* AUNOR Web · night theme. Loaded last, after premium-pickers.css.

   theme-mode.js puts data-theme="dark" on <html> from 18:00 to 08:00
   (or always, or never, if the person chose so). Everything here only
   answers to that attribute.

   The portal's own tokens get night values first. Then the colours that were
   written as literals: every pale background became
   var(--tint-RRGGBB, #RRGGBB) and every deep text colour
   var(--ink-RRGGBB, #RRGGBB). By day nothing defines them and the literal
   applies, so pages that do not load this file (public.html) are unchanged;
   by night they are defined below as a dark shade (or, for ink, a light one)
   of the same hue. The rail, the login backdrop and the other surfaces that were
   already dark keep their literals and look the same in both themes. */

html[data-theme="dark"] {
  color-scheme: dark;

  /* premium-theme.css */
  --ink: #e4ecee;
  --muted: #a3b4b9;
  --quiet: #82979d;
  --mist: #0b1418;
  --paper: #13212a;
  --hairline: #243841;
  --hairline-strong: #334a53;
  --alarm-soft: #3a1714;
  --ok-soft: #10291f;
  --focus: rgba(111, 186, 212, 0.5);
  --navy-900: #1b313b;
  --blue-050: #182b33;
  --ground-deep: #091115;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 24px 60px rgba(0, 0, 0, 0.55);

  /* premium.css */
  --line: rgba(196, 222, 230, 0.13);
  --line-strong: rgba(196, 222, 230, 0.24);
  --success-soft: #10291f;
  --amber: #e0ad57;
  --amber-soft: #33270f;

  /* premium-groups.css */
  --warn: #e6a15a;
  --warn-soft: #33250f;
  --calm: #6cbad6;
  --calm-soft: #10283a;
  --violet: #a88ff0;
  --violet-soft: #231c3a;
  --pets: #ddb28e;
  --pets-soft: #34271f;
  --tint-eaf1fb: #1a1e24;
  --tint-ecf8ef: #1c231e;
  --tint-f1eaff: #1c1824;
  --tint-f2f4f7: #1d1e20;
  --tint-f4ebe3: #28221d;
  --tint-ffeef1: #22191a;
  --tint-fff1e6: #261e18;

--tint-9fe0c7: #27453a;
  --tint-a9d9c8: #2a4139;
  --tint-acd9bb: #2a4031;
  --tint-b7dec2: #273b2d;
  --tint-b8e1d3: #253b34;
  --tint-b9d0e2: #25313b;
  --tint-b9d5f6: #192a3e;
  --tint-bad7eb: #20303b;
  --tint-bad9ee: #1e303c;
  --tint-bcdcc6: #354b3c;
  --tint-c5d3de: #364149;
  --tint-c9d0d2: #3d4243;
  --tint-c9deee: #1e2b35;
  --tint-c9e7dc: #22342d;
  --tint-cad6ce: #3b443e;
  --tint-cbdbe7: #222c33;
  --tint-cde1ef: #1d2a34;
  --tint-cfd6d8: #3c4243;
  --tint-cfdde9: #212a32;
  --tint-d4e0e8: #35424a;
  --tint-d6cdc1: #474139;
  --tint-d6e4f0: #1d272f;
  --tint-d6e5f1: #1c272f;
  --tint-d7e2eb: #34414b;
  --tint-dccda5: #433c29;
  --tint-dce5ec: #364149;
  --tint-dcede7: #364a43;
  --tint-e2e9ef: #1f2428;
  --tint-e3e9eb: #222627;
  --tint-e4ebf1: #1e2327;
  --tint-e7c896: #493b24;
  --tint-e7ca99: #483b24;
  --tint-e7dccb: #332c22;
  --tint-e7f2f6: #1c2326;
  --tint-e8eef3: #1e2225;
  --tint-eadcb9: #3c3420;
  --tint-eaf4f1: #1e2422;
  --tint-ece6dc: #494236;
  --tint-ece9e2: #282621;
  --tint-edf4f8: #1c2022;
  --tint-edf7ff: #191e23;
  --tint-edf8f0: #1c221e;
  --tint-edf8ff: #191f23;
  --tint-eef0f0: #202121;
  --tint-eef7fc: #1a1f22;
  --tint-eff9f2: #1c211d;
  --tint-effbf7: #1b211f;
  --tint-f0c2bc: #3b201d;
  --tint-f0ebe3: #27241f;
  --tint-f0f8fd: #1a1e21;
  --tint-f1f4f5: #1e1f20;
  --tint-f1f5f8: #1c1f20;
  --tint-f1f8f3: #1c201d;
  --tint-f1faf7: #1b201f;
  --tint-f2c2bc: #3c1f1b;
  --tint-f2c5c7: #381b1c;
  --tint-f2faf4: #1b201c;
  --tint-f3f7fa: #1b1e1f;
  --tint-f3f7ff: #191b1f;
  --tint-f4f0e8: #25221d;
  --tint-f4f4f2: #1f1f1e;
  --tint-f4f7f9: #1c1e1f;
  --tint-f4faf5: #1b1f1c;
  --tint-f5f2eb: #23211d;
  --tint-f5f7f3: #1e1f1d;
  --tint-f5fafb: #1b1e1e;
  --tint-f6f8f9: #1c1d1e;
  --tint-f7f1fc: #1e1a20;
  --tint-f8e8b9: #3e3418;
  --tint-f8f6f1: #201f1c;
  --tint-f8fafc: #1b1c1d;
  --tint-f8fbfd: #1a1c1d;
  --tint-f9fbfc: #1b1c1c;
  --tint-fafbfd: #1a1b1c;
  --tint-fbfaf6: #1e1d1b;
  --tint-fbfdfe: #1a1b1b;
  --tint-fbfefd: #1a1b1b;
  --tint-fff6dc: #2c2716;
  --tint-fff9ea: #242118;
  --tint-fff9ec: #232018;
  --tint-fffaf0: #211e19;
  --tint-fffdf8: #1d1c19;
  --ink-087253: #80efcf;
  --ink-0b6731: #84ebaf;
  --ink-0d6832: #86eaae;
  --ink-0e684f: #87e9cd;
  --ink-0f5a42: #8ae6c8;
  --ink-13242c: #9ec1d1;
  --ink-168743: #89e6ae;
  --ink-1d6b50: #93dcc3;
  --ink-1f6f8b: #8fcbe0;
  --ink-236b55: #97d8c4;
  --ink-236b9a: #8fc0e0;
  --ink-2563eb: #82a4ed;
  --ink-31536f: #9fbad1;
  --ink-315e81: #9bbbd4;
  --ink-315f50: #a3ccbf;
  --ink-39714c: #a2cdb1;
  --ink-39715f: #a2cdbf;
  --ink-596b71: #c1cacd;
  --ink-5c3b00: #f4c97b;
  --ink-6d4bc3: #aa97d8;
  --ink-72439b: #b99ed1;
  --ink-745a21: #dbc594;
  --ink-79500e: #ebc385;
  --ink-7c5712: #e8c688;
  --ink-7e6a3e: #cdc0a2;
  --ink-84520b: #eec181;
  --ink-87621c: #e2c58d;
  --ink-886019: #e4c48b;
  --ink-8a6726: #dcc393;
  --ink-8b6722: #dfc491;
  --ink-b25e09: #f2b87e;
}

/* ------------------------------------------------- dark on both sides ---- */
/* --ink doubled as a fill (a selected chip, your own chat bubble); by night
   it is the text colour, so those fills take the rail's petrol instead. */
html[data-theme="dark"] .alert-chip.is-new,
html[data-theme="dark"] .segmented input:checked + span {
  border-color: var(--night-3);
  background: var(--night-3);
}
/* --navy-900 stays a dark fill by night; where it was text on white, the
   text follows --ink. */
html[data-theme="dark"] .event-detail-hero time,
html[data-theme="dark"] .team-unassigned > strong,
html[data-theme="dark"] .transport-tab.active {
  color: var(--ink);
}

/* The night petrol was also the colour of every primary action; on a night
   page it disappears into the cards. By night actions take a lighter petrol
   that still carries white text (5.5:1). */
html[data-theme="dark"] {
  --action: #2f6f84;
  --action-strong: #3a8199;
  --blue-600: var(--action);
  --blue-700: var(--action-strong);
}
html[data-theme="dark"] .button-primary,
html[data-theme="dark"] .auth-card > .button-primary,
html[data-theme="dark"] .code-block > .button-primary,
html[data-theme="dark"] .transport-tab.active::after,
html[data-theme="dark"] .history-day.is-active,
html[data-theme="dark"] .pk-panel .pk-primary,
html[data-theme="dark"] .pk-panel .pk-day.is-selected,
html[data-theme="dark"] .pk-panel .pk-cell.is-selected,
html[data-theme="dark"] .pk-panel .pk-col button.is-selected {
  border-color: var(--action);
  background: var(--action);
}
html[data-theme="dark"] .button-primary:hover:not(:disabled),
html[data-theme="dark"] .pk-panel .pk-primary:hover { background: var(--action-strong); }
html[data-theme="dark"] .group-card.selected,
html[data-theme="dark"] .alert-row.is-selected:not(.is-live),
html[data-theme="dark"] .notice-button[data-state="off"],
html[data-theme="dark"] .chip-button:hover { border-color: var(--action-strong); }
html[data-theme="dark"] ::selection { color: #fff; background: var(--action); }

/* Half-transparent white panels. */
html[data-theme="dark"] .portal-header { background: color-mix(in srgb, var(--mist) 92%, transparent); }
html[data-theme="dark"] .tournament-toolbar { background: color-mix(in srgb, var(--paper) 72%, transparent); }
html[data-theme="dark"] .locale-picker select { background-color: var(--paper); }
html[data-theme="dark"] .delivery-channel-icon { background: color-mix(in srgb, var(--paper) 65%, transparent); }
html[data-theme="dark"] .empty-state { background: color-mix(in srgb, var(--paper) 68%, transparent); }
html[data-theme="dark"] .transport-loading { background: color-mix(in srgb, var(--mist) 50%, transparent); }
html[data-theme="dark"] .public-download-panel { background: color-mix(in srgb, var(--paper) 96%, transparent); }

/* Text written in the night petrol on pale surfaces; by night those surfaces
   are dark, so the text takes the page's ink (links and eyebrows a light
   petrol). */
html[data-theme="dark"] .auth-step,
html[data-theme="dark"] .auth-steps li > span,
html[data-theme="dark"] .workflow-guide-heading > span,
html[data-theme="dark"] .metric strong,
html[data-theme="dark"] .type-pill,
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .member-avatar,
html[data-theme="dark"] .bracket-stage summary::after,
html[data-theme="dark"] .event-honoree,
html[data-theme="dark"] .event-detail-hero time,
html[data-theme="dark"] .team-unassigned > strong,
html[data-theme="dark"] .empty-state::before,
html[data-theme="dark"] .check-list label:has(input:checked),
html[data-theme="dark"] .export-file-mark.image-mark,
html[data-theme="dark"] .route-stop-index,
html[data-theme="dark"] .use-location-button,
html[data-theme="dark"] .transport-tab.active,
html[data-theme="dark"] .route-progress-number,
html[data-theme="dark"] .route-status-pill.completed,
html[data-theme="dark"] .operations-icon,
html[data-theme="dark"] .download-mark,
html[data-theme="dark"] .public-progress-summary strong,
html[data-theme="dark"] .public-competition-section > header small,
html[data-theme="dark"] .bracket-scroll-cue,
html[data-theme="dark"] .public-bracket-round h3,
html[data-theme="dark"] .timing-rank,
html[data-theme="dark"] .public-date,
html[data-theme="dark"] .command-index,
html[data-theme="dark"] .checkin-button:hover,
html[data-theme="dark"] .checkin-button span,
html[data-theme="dark"] .safety-attachment,
html[data-theme="dark"] .chat-row-icon,
html[data-theme="dark"] .pair-code,
html[data-theme="dark"] .selected-mark,
html[data-theme="dark"] .notice-prompt-enable,
html[data-theme="dark"] .account-photo,
html[data-theme="dark"] .pk-option.is-selected { color: var(--ink); }
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .account-links a,
html[data-theme="dark"] .pk-panel .pk-link { color: var(--calm); }

/* Chat names carry a per-person tone inline, picked for white bubbles. */
html[data-theme="dark"] .chat-sender { filter: brightness(1.75) saturate(0.9); }

/* ------------------------------------------------------------ fields ---- */
html[data-theme="dark"] select.pk-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a3b4b9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #6f858c; }

/* ------------------------------------------------------------- maps ---- */
/* The street tiles are drawn for daylight; dimmed, they stop glowing in a
   dark room and stay readable. Markers and lines are not touched. */
html[data-theme="dark"] .leaflet-tile-pane { filter: brightness(0.72) contrast(1.08) saturate(0.85); }
html[data-theme="dark"] .leaflet-container { background: #1b2a31; }
html[data-theme="dark"] .leaflet-tooltip,
html[data-theme="dark"] .leaflet-popup-content-wrapper,
html[data-theme="dark"] .leaflet-popup-tip {
  color: var(--ink);
  border-color: var(--hairline);
  background: var(--paper);
}
html[data-theme="dark"] .leaflet-bar a {
  color: var(--ink);
  border-color: var(--hairline);
  background: var(--paper);
}

/* ---------------------------------------------------- light / dark control ---- */
.theme-switch {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--hairline);
  border-radius: 999px;
  background: var(--paper);
}
.theme-switch button {
  width: 32px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}
.theme-switch button:hover { color: var(--ink); }
.theme-switch button[aria-pressed="true"] { color: #fff; background: var(--night); }
html[data-theme="dark"] .theme-switch button[aria-pressed="true"] { color: var(--night); background: #9fe0c7; }
.theme-switch svg { width: 17px; height: 17px; }
.auth-theme { display: flex; justify-content: flex-end; margin-bottom: 10px; }