/* aunorsos.com · night theme. Loaded after landing.css.

   theme-mode.js (shared with AUNOR Web, same saved choice) puts
   data-theme="dark" on <html> from 18:00 to 08:00, or always, or never.

   landing.css keeps its day colours as fallbacks: pale literals are written
   var(--tint-RRGGBB, #RRGGBB), deep text var(--ink-RRGGBB, #RRGGBB), and the
   backgrounds that used a page token go through var(--dk-*, var(--token)).
   Nothing defines those by day. By night this file does, and flips the text
   tokens (--ink, --ink-soft, --line); --white, --paper, --mint and --blue
   keep their values because they are also used as text and dark bands.

   The phone, watch and widget mock-ups, the screenshots and the sections
   that were already dark are pictures of the product: inside them every
   night value is reset, so they look exactly as they do by day. */

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #efe9df;
  --ink-soft: #a9b4b6;
  --line: rgba(239, 233, 223, 0.13);
  --shadow: 0 26px 70px rgba(0, 0, 0, 0.45);
  --dk-page: #0e191e;
  --dk-page-light: #122127;
  --dk-card: #16282f;
  --dk-ink-fill: #0a1317;
  --dk-mint-fill: #1f3a33;
  --dk-red-soft: #3d1c19;

  --tint-c5cde3: #343a4c;
  --tint-cad2ea: #202534;
  --tint-cbd3e9: #212634;
  --tint-d3d8e0: #3a3e46;
  --tint-dce9e3: #384840;
  --tint-dcefe9: #1e2c27;
  --tint-e2f2e8: #1e2822;
  --tint-e3e7ec: #212427;
  --tint-e4f2ec: #1e2723;
  --tint-e4f2ed: #1e2724;
  --tint-e5f2ed: #1e2623;
  --tint-e6f3ef: #1e2623;
  --tint-e9faf2: #1b2520;
  --tint-edf5f1: #1d2220;
  --tint-eef3fb: #1b1d22;
  --tint-f1f0fb: #1b1b21;
  --tint-f1f3f6: #1d1e20;
  --tint-f1f8f6: #1c201f;
  --tint-f2cbc7: #371e1b;
  --tint-f3dcc6: #38291a;
  --tint-f4c7a7: #442c1b;
  --tint-f4f5f9: #1c1c1f;
  --tint-faf7f2: #201e1b;
  --tint-fbf1e7: #26201a;
  --tint-fbfaf7: #1d1d1b;
  --tint-fbfcfd: #1a1b1b;
  --tint-fde8e6: #261a19;
  --tint-fdf0ef: #211a1a;
  --tint-fdf1dc: #2c2517;
  --tint-ffbcb5: #411713;
  --tint-fff4f2: #201a19;
  --tint-fff9f3: #1f1c19;
  --tint-ffffff: #1a1a1a;
  --ink-047857: #7bf4d2;
  --ink-0f766e: #86e9e2;
  --ink-286654: #9cd4c3;
  --ink-2f7f68: #9ad5c4;
  --ink-3f7ad8: #8daee2;
  --ink-6b4fd8: #9f8fe1;
  --ink-7a4526: #d9af96;
  --ink-cf2419: #ea8b85;
  --tint-b9ddd1-a48: rgba(52, 76, 68, 0.48);
  --tint-b9ddd1-a55: rgba(52, 76, 68, 0.55);
  --tint-f7f3eb-a88: rgba(35, 33, 28, 0.88);
  --tint-ffd9d1-a45: rgba(51, 26, 20, 0.45);
  --tint-fffefb-a78: rgba(27, 27, 25, 0.78);
  --tint-fffefb-a85: rgba(27, 27, 25, 0.85);
  --tint-fffefb-a90: rgba(27, 27, 25, 0.9);
  --tint-fffefb-a98: rgba(27, 27, 25, 0.98);
  --tint-ffffff-a35: rgba(26, 26, 26, 0.35);
  --tint-ffffff-a45: rgba(26, 26, 26, 0.45);
  --tint-ffffff-a50: rgba(26, 26, 26, 0.5);
  --tint-ffffff-a52: rgba(26, 26, 26, 0.52);
  --tint-ffffff-a70: rgba(26, 26, 26, 0.7);
  --tint-ffffff-a75: rgba(26, 26, 26, 0.75);
  --edge-152831-a8: rgba(239, 233, 223, 0.088);
  --edge-152831-a10: rgba(239, 233, 223, 0.11);
  --edge-152831-a12: rgba(239, 233, 223, 0.132);
  --edge-152831-a22: rgba(239, 233, 223, 0.242);
  --edge-152831-a24: rgba(239, 233, 223, 0.264);
}

html[data-theme="dark"] :is(
  .phone, .watch-visual, .mini-widget, .shot-frame, .dark-card, .steps-section,
  .site-footer, .edge-section, .privacy-section, .ios-card, .watch-card,
  .watch-feature-card, .burger-value-banner, .compare-premium, .cfg-premium
) {
  --ink: #152831;
  --ink-soft: #56656b;
  --line: rgba(21, 40, 49, 0.14);
  --dk-page: initial;
  --dk-page-light: initial;
  --dk-card: initial;
  --dk-ink-fill: initial;
  --dk-mint-fill: initial;
  --dk-red-soft: initial;
  --tint-c5cde3: initial;
  --tint-cad2ea: initial;
  --tint-cbd3e9: initial;
  --tint-d3d8e0: initial;
  --tint-dce9e3: initial;
  --tint-dcefe9: initial;
  --tint-e2f2e8: initial;
  --tint-e3e7ec: initial;
  --tint-e4f2ec: initial;
  --tint-e4f2ed: initial;
  --tint-e5f2ed: initial;
  --tint-e6f3ef: initial;
  --tint-e9faf2: initial;
  --tint-edf5f1: initial;
  --tint-eef3fb: initial;
  --tint-f1f0fb: initial;
  --tint-f1f3f6: initial;
  --tint-f1f8f6: initial;
  --tint-f2cbc7: initial;
  --tint-f3dcc6: initial;
  --tint-f4c7a7: initial;
  --tint-f4f5f9: initial;
  --tint-faf7f2: initial;
  --tint-fbf1e7: initial;
  --tint-fbfaf7: initial;
  --tint-fbfcfd: initial;
  --tint-fde8e6: initial;
  --tint-fdf0ef: initial;
  --tint-fdf1dc: initial;
  --tint-ffbcb5: initial;
  --tint-fff4f2: initial;
  --tint-fff9f3: initial;
  --tint-ffffff: initial;
  --ink-047857: initial;
  --ink-0f766e: initial;
  --ink-286654: initial;
  --ink-2f7f68: initial;
  --ink-3f7ad8: initial;
  --ink-6b4fd8: initial;
  --ink-7a4526: initial;
  --ink-cf2419: initial;
  --tint-b9ddd1-a48: initial;
  --tint-b9ddd1-a55: initial;
  --tint-f7f3eb-a88: initial;
  --tint-ffd9d1-a45: initial;
  --tint-fffefb-a78: initial;
  --tint-fffefb-a85: initial;
  --tint-fffefb-a90: initial;
  --tint-fffefb-a98: initial;
  --tint-ffffff-a35: initial;
  --tint-ffffff-a45: initial;
  --tint-ffffff-a50: initial;
  --tint-ffffff-a52: initial;
  --tint-ffffff-a70: initial;
  --tint-ffffff-a75: initial;
  --edge-152831-a8: initial;
  --edge-152831-a10: initial;
  --edge-152831-a12: initial;
  --edge-152831-a22: initial;
  --edge-152831-a24: initial;
}

/* Half-transparent whites under 35% were left literal; on the night page
   they would read as grey bands. */
html[data-theme="dark"] .proof-strip { background: rgba(255, 255, 255, 0.03); }
/* The menu button's bars are ink, not a surface. */
html[data-theme="dark"] .menu-button span { background: var(--ink); }

/* ---------------------------------------------------- light / dark control ---- */
/* Dressed like .lang-switch beside it, and hidden with it on narrow screens
   (the menu carries a copy). */
.theme-switch {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--tint-ffffff-a50, rgba(255, 255, 255, 0.5));
}
.site-header.scrolled .theme-switch { background: var(--tint-ffffff-a70, rgba(255, 255, 255, 0.7)); }
.theme-switch button {
  width: 30px;
  height: 28px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: var(--ink-soft);
  background: transparent;
  cursor: pointer;
}
.theme-switch button:hover { color: var(--ink); }
.theme-switch button[aria-pressed="true"] { color: #fffefb; background: #152831; }
html[data-theme="dark"] .theme-switch button[aria-pressed="true"] { color: #152831; background: #b9ddd1; }
.theme-switch svg { width: 16px; height: 16px; }
.theme-switch-mobile { justify-content: center; align-self: center; margin: 6px 4px 4px; }
@media (max-width: 1360px) {
  .theme-switch.desktop-only { display: none; }
}