/* AUDIT_B16_THEME: dark theme for iamravi.com.
   The site already defines its colours as variables on :root (style.css), so dark mode is mostly new values for the same
   variables, plus a short list of places where style.css uses a fixed light colour. style.css itself is not edited.
   Dark switches on in two ways:
     1. automatically, when the visitor's device is set to dark (unless they chose light with the toggle);
     2. when the visitor presses the sun/moon button in the header (saved in this browser, <html data-theme="dark|light">). */

/* The toggle button: shown in both themes. */
.theme-toggle {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-left: 8px;
  padding: 0;
  border: 1px solid var(--line, #C7BB9A);
  border-radius: 999px;
  background: #fbfaf5;
  color: var(--ink-soft, #4B5860);
  cursor: pointer;
}
.theme-toggle:hover { color: var(--stamp, #9C3B2E); border-color: var(--stamp, #9C3B2E); }
.theme-toggle:focus-visible { outline: 2px solid var(--stamp, #9C3B2E); outline-offset: 2px; }
.theme-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .ico-sun { display: none; }
.theme-toggle .ico-moon { display: inline; }
@media (max-width: 600px) { .theme-toggle { width: 28px; height: 28px; margin-left: 6px; } }

/* Device is dark and the visitor has not picked light. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --paper: #151B1E;
    --paper-dark: #1F2829;
    --ink: #E9E3D1;
    --ink-soft: #AEB8B3;
    --stamp: #CB5541;
    --gold: #D1A24A;
    --sage: #8DAE84;
    --line: #3A4547;
    --accent-travel: #63A4E8;
    --accent-upsc: #E0A64A;
    --accent-corporate: #5FC08C;
    --accent-history: #E0A64A;
    --accent-law: #A78BFA;
    --accent-about: #B79AE0;
    color-scheme: dark;
  }
  html:not([data-theme="light"]) .projects-tab,
  html:not([data-theme="light"]) .jbtn,
  html:not([data-theme="light"]) .visa-check-row select {
    background: var(--paper-dark); color: var(--ink);
  }
  html:not([data-theme="light"]) .site-header .lang-switch,
  html:not([data-theme="light"]) .rec-card,
  html:not([data-theme="light"]) .theme-toggle {
    background: #1D2527;
  }
  html:not([data-theme="light"]) .visa-chip.ok {
    color: #9FCF95;
  }
  html:not([data-theme="light"]) .visa-chip.warn {
    color: #E3B865;
  }
  html:not([data-theme="light"]) .notes-example-label,
  html:not([data-theme="light"]) .rec-card-why-label {
    color: #9FCF95;
  }
  html:not([data-theme="light"]) .notes-plain-label {
    color: #7FB2EA;
  }
  html:not([data-theme="light"]) .notes-core-label {
    color: #E3B865;
  }
  html:not([data-theme="light"]) .notes-synthesis-label {
    color: #B9A4F0;
  }
  html:not([data-theme="light"]) .notes-trap-label,
  html:not([data-theme="light"]) .no {
    color: #F19A8C;
  }
  html:not([data-theme="light"]) .notes-memory-label,
  html:not([data-theme="light"]) .yes {
    color: #8FD4AC;
  }
  html:not([data-theme="light"]) .notes-history-label {
    color: #B9C2C7;
  }
  html:not([data-theme="light"]) .india-v2-badge.visited {
    background: rgba(34,197,94,0.18); color: #8FE0AE;
  }
  html:not([data-theme="light"]) .india-v2-badge.not-visited {
    background: rgba(96,165,250,0.18); color: #9CC4FB;
  }
  html:not([data-theme="light"]) .destination-fact-card {
    background: rgba(255,255,255,0.05); border-color: var(--line); box-shadow: none;
  }
  html:not([data-theme="light"]) .destination-fact-card span {
    color: var(--ink-soft);
  }
  html:not([data-theme="light"]) .destination-fact-card strong {
    color: var(--ink);
  }
  html:not([data-theme="light"]) .india-v2-markdown table,
  html:not([data-theme="light"]) .destination-page-content table,
  html:not([data-theme="light"]) .india-destination-detail table,
  html:not([data-theme="light"]) main article table {
    background: rgba(255,255,255,0.04); border-color: var(--line); box-shadow: none;
  }
  html:not([data-theme="light"]) .india-v2-markdown td,
  html:not([data-theme="light"]) .destination-page-content td,
  html:not([data-theme="light"]) .india-destination-detail td,
  html:not([data-theme="light"]) main article td {
    border-top-color: var(--line);
  }
  html:not([data-theme="light"]) .india-v2-markdown tbody tr:nth-child(even),
  html:not([data-theme="light"]) .destination-page-content tbody tr:nth-child(even),
  html:not([data-theme="light"]) .india-destination-detail tbody tr:nth-child(even),
  html:not([data-theme="light"]) main article tbody tr:nth-child(even) {
    background: rgba(255,255,255,0.04);
  }
  html:not([data-theme="light"]) .india-v2-markdown tbody tr:hover,
  html:not([data-theme="light"]) .destination-page-content tbody tr:hover,
  html:not([data-theme="light"]) .india-destination-detail tbody tr:hover,
  html:not([data-theme="light"]) main article tbody tr:hover {
    background: rgba(255,255,255,0.08);
  }
  html:not([data-theme="light"]) .photo-tile img {
    background: linear-gradient(100deg, var(--paper-dark) 30%, #2B3638 50%, var(--paper-dark) 70%);
  }
  html:not([data-theme="light"]) .build-photo-hint {
    background: rgba(0,0,0,0.35);
  }
  html:not([data-theme="light"]) .cost-table.city-summary-table tbody tr:nth-child(even) td {
    background: rgba(255,255,255,0.03);
  }
  html:not([data-theme="light"]) .nav-dropdown-menu a:hover {
    background: rgba(255,255,255,0.06);
  }
  html:not([data-theme="light"]) .notes-table thead th {
    background: rgba(255,255,255,0.08);
  }
  html:not([data-theme="light"]) .notes-table tbody tr:nth-child(even) {
    background: rgba(255,255,255,0.04);
  }
  html:not([data-theme="light"]) .rec-card-media {
    background: rgba(255,255,255,0.06);
  }
  html:not([data-theme="light"]) img {
    filter: brightness(0.92);
  }
  html:not([data-theme="light"]) .theme-toggle .ico-moon {
    display: none;
  }
  html:not([data-theme="light"]) .theme-toggle .ico-sun {
    display: inline;
  }
}

/* The visitor pressed the toggle. */
html[data-theme="dark"] {
  --paper: #151B1E;
  --paper-dark: #1F2829;
  --ink: #E9E3D1;
  --ink-soft: #AEB8B3;
  --stamp: #CB5541;
  --gold: #D1A24A;
  --sage: #8DAE84;
  --line: #3A4547;
  --accent-travel: #63A4E8;
  --accent-upsc: #E0A64A;
  --accent-corporate: #5FC08C;
  --accent-history: #E0A64A;
  --accent-law: #A78BFA;
  --accent-about: #B79AE0;
  color-scheme: dark;
}
html[data-theme="dark"] .projects-tab,
html[data-theme="dark"] .jbtn,
html[data-theme="dark"] .visa-check-row select {
  background: var(--paper-dark); color: var(--ink);
}
html[data-theme="dark"] .site-header .lang-switch,
html[data-theme="dark"] .rec-card,
html[data-theme="dark"] .theme-toggle {
  background: #1D2527;
}
html[data-theme="dark"] .visa-chip.ok {
  color: #9FCF95;
}
html[data-theme="dark"] .visa-chip.warn {
  color: #E3B865;
}
html[data-theme="dark"] .notes-example-label,
html[data-theme="dark"] .rec-card-why-label {
  color: #9FCF95;
}
html[data-theme="dark"] .notes-plain-label {
  color: #7FB2EA;
}
html[data-theme="dark"] .notes-core-label {
  color: #E3B865;
}
html[data-theme="dark"] .notes-synthesis-label {
  color: #B9A4F0;
}
html[data-theme="dark"] .notes-trap-label,
html[data-theme="dark"] .no {
  color: #F19A8C;
}
html[data-theme="dark"] .notes-memory-label,
html[data-theme="dark"] .yes {
  color: #8FD4AC;
}
html[data-theme="dark"] .notes-history-label {
  color: #B9C2C7;
}
html[data-theme="dark"] .india-v2-badge.visited {
  background: rgba(34,197,94,0.18); color: #8FE0AE;
}
html[data-theme="dark"] .india-v2-badge.not-visited {
  background: rgba(96,165,250,0.18); color: #9CC4FB;
}
html[data-theme="dark"] .destination-fact-card {
  background: rgba(255,255,255,0.05); border-color: var(--line); box-shadow: none;
}
html[data-theme="dark"] .destination-fact-card span {
  color: var(--ink-soft);
}
html[data-theme="dark"] .destination-fact-card strong {
  color: var(--ink);
}
html[data-theme="dark"] .india-v2-markdown table,
html[data-theme="dark"] .destination-page-content table,
html[data-theme="dark"] .india-destination-detail table,
html[data-theme="dark"] main article table {
  background: rgba(255,255,255,0.04); border-color: var(--line); box-shadow: none;
}
html[data-theme="dark"] .india-v2-markdown td,
html[data-theme="dark"] .destination-page-content td,
html[data-theme="dark"] .india-destination-detail td,
html[data-theme="dark"] main article td {
  border-top-color: var(--line);
}
html[data-theme="dark"] .india-v2-markdown tbody tr:nth-child(even),
html[data-theme="dark"] .destination-page-content tbody tr:nth-child(even),
html[data-theme="dark"] .india-destination-detail tbody tr:nth-child(even),
html[data-theme="dark"] main article tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.04);
}
html[data-theme="dark"] .india-v2-markdown tbody tr:hover,
html[data-theme="dark"] .destination-page-content tbody tr:hover,
html[data-theme="dark"] .india-destination-detail tbody tr:hover,
html[data-theme="dark"] main article tbody tr:hover {
  background: rgba(255,255,255,0.08);
}
html[data-theme="dark"] .photo-tile img {
  background: linear-gradient(100deg, var(--paper-dark) 30%, #2B3638 50%, var(--paper-dark) 70%);
}
html[data-theme="dark"] .build-photo-hint {
  background: rgba(0,0,0,0.35);
}
html[data-theme="dark"] .cost-table.city-summary-table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,0.03);
}
html[data-theme="dark"] .nav-dropdown-menu a:hover {
  background: rgba(255,255,255,0.06);
}
html[data-theme="dark"] .notes-table thead th {
  background: rgba(255,255,255,0.08);
}
html[data-theme="dark"] .notes-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.04);
}
html[data-theme="dark"] .rec-card-media {
  background: rgba(255,255,255,0.06);
}
html[data-theme="dark"] img {
  filter: brightness(0.92);
}
html[data-theme="dark"] .theme-toggle .ico-moon {
  display: none;
}
html[data-theme="dark"] .theme-toggle .ico-sun {
  display: inline;
}
