/* Semantic dark palette. Original light colours remain the fallbacks in component CSS. */
:root { color-scheme: light; }
@media screen {
  :root[data-theme=dark] {
    color-scheme: dark;
    --cream: #101b24;
    --paper: #182630;
    --ink: #e4ecf0;
    --muted: #a5b9c3;
    --line: #354954;
    --teal-100: #203f3e;
    --amber-100: #3e3223;
    --danger-bg: #3d272e;
    --success-bg: #1c3931;
    --info-bg: #213542;
    --success: #87d9ae;
    --danger: #ffaaa5;
    --orange-soft: #3e3223;
    --mint-soft: #1e3837;
    --editorial-cream: #101b24;
    --shadow: 0 14px 40px #0004;
    --theme-text: #e4ecf0;
    --theme-muted: #a5b9c3;
    --theme-accent: #79d7c7;
    --theme-warm: #efc18a;
    --theme-danger: #ffaaa5;
    --theme-surface: #182630;
    --theme-soft: #1e303a;
    --theme-tint: #1e3837;
    --theme-warm-bg: #3e3223;
    --theme-danger-bg: #3d272e;
    --theme-border: #354954;
  }
  :root[data-theme=dark] .site-header { background: #101b24f5; border-color: var(--line); }
  :root[data-theme=dark] .brand-tagline { color: var(--ink); }
  :root[data-theme=dark] .nav-toggle span:not(.sr-only) { background: var(--ink); }
  :root[data-theme=dark] :is(.button-danger,.emergency-icon) { background: #a73535; color: #fff; }
  :root[data-theme=dark] .site-footer .brand-footer { background: transparent; }
  :root[data-theme=dark] :is(.empty-state,.area-finder-card,.profile-dialog-bar,.do-tabs,.do-mobile-nav) { background: var(--paper); }
  :root[data-theme=dark] .do-map-canvas a b { background: var(--paper); color: var(--ink); }
  :root[data-theme=dark] .am-page { --am-navy: var(--ink); --am-line: var(--line); }
  :root[data-theme=dark] .am-search > div button { color: var(--theme-accent); }
  :root[data-theme=dark] :is(input, textarea, select) { color-scheme: dark; }
  :root[data-theme=dark] :is(input, textarea)::placeholder { color: #93aab5; opacity: 1; }
  :root[data-theme=dark] .jf-reaction-bar button { --reaction-color: #79d7c7; color: #a5b9c3; }
  :root[data-theme=dark] .jf-reaction-bar [data-reaction=love] { --reaction-color: #fa8eb5; }
  :root[data-theme=dark] .jf-reaction-bar :is([data-reaction=celebrate],[data-reaction=smile],[data-reaction=helpful]) { --reaction-color: #efc18a; }
  :root[data-theme=dark] .jf-reaction-bar [data-reaction=wow] { --reaction-color: #c9a4f4; }
  :root[data-theme=dark] .jf-reaction-bar [data-reaction=sad] { --reaction-color: #a6c8ef; }
  :root[data-theme=dark] .jf-reaction-bar [data-reaction=dislike] { --reaction-color: #ffaaa5; }
  :root[data-theme=dark] .jf-reaction-bar button:is(:hover,[aria-pressed=true]) { color: var(--reaction-color); }
  :root[data-theme=dark] .jf-reaction-bar button[aria-pressed=true] .jf-icon-detail { stroke: #101b24; }
}

/* Quiet, touch-friendly controls; no ornamental shadows or bouncing buttons. */
.button { border-radius: 8px; font-weight: 650; transition: background .15s, border-color .15s; }
.button:hover { transform: none; box-shadow: none; }
/* All sign-in roles use the same quiet treatment, including Janpratinidhi. */
.site-header .header-auth { border-color: transparent; background: transparent; }
.site-header .header-auth:hover { background: var(--mint-soft); }
.site-header .header-auth { border-radius: 8px; }
.theme-control { position: relative; flex: 0 0 44px; color: var(--ink); }
.theme-control > summary { display: grid; place-items: center; width: 44px; height: 44px; padding: 10px; list-style: none; cursor: pointer; border: 0; border-radius: 8px; background: transparent; }
.theme-control > summary::-webkit-details-marker { display: none; }
.theme-control > summary:hover, .theme-control[open] > summary { background: var(--mint-soft); color: var(--theme-accent, var(--teal-700)); }
.theme-control svg { display: block; width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.theme-control > summary svg { display: none; }
:root[data-theme-preference=system] .theme-control > summary [data-theme-icon=system],
:root:not([data-theme-preference]) .theme-control > summary [data-theme-icon=system],
:root[data-theme-preference=light] .theme-control > summary [data-theme-icon=light],
:root[data-theme-preference=dark] .theme-control > summary [data-theme-icon=dark] { display: block; }
.theme-popover { position: absolute; z-index: 80; top: calc(100% + 9px); right: 0; width: 224px; max-width: calc(100vw - 28px); padding: 14px 8px 8px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
.theme-popover p { margin: 0; padding: 0 10px 8px; font-size: .75rem; color: var(--muted); }
.theme-popover [data-theme-title] { font-size: .85rem; font-weight: 700; color: var(--ink); }
.theme-popover button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 10px; border: 0; border-radius: 7px; background: transparent; color: var(--ink); text-align: left; font: inherit; font-size: .85rem; cursor: pointer; }
.theme-popover button:hover, .theme-popover button[aria-pressed=true] { background: var(--mint-soft); color: var(--theme-accent, var(--teal-700)); }
.theme-popover button[aria-pressed=true]::after { content: '✓'; margin-left: auto; }
.theme-control :is(summary,button):focus-visible { outline: 2px solid var(--theme-accent, var(--teal-700)); outline-offset: 2px; }
@media (max-width: 760px) {
  .site-header .nav-wrap { width: calc(100% - 28px); grid-template-columns: minmax(0, 1fr) 100px 44px; gap: 8px 10px; padding-block: 10px; }
  .site-header .brand-lockup { width: 100%; max-width: 208px; gap: 5px; }
  .site-header .brand-tagline { font-size: 10px; }
  .site-header .header-actions { display: contents; }
  .site-header .language-control { grid-column: 2; grid-row: 1; }
  .site-header .language-control select { width: 100px !important; min-width: 100px !important; max-width: 100px !important; }
  .site-header .theme-control { grid-column: 3; grid-row: 2; }
  .site-header .sign-in-actions { grid-column: 1 / 3; grid-row: 2; border: 0; padding: 0; gap: 4px; }
  .site-header .header-auth { flex: 1 1 0; width: auto; min-width: 0; height: 52px; flex-direction: column; gap: 3px; padding: 4px 2px; }
  .site-header .auth-label { display: inline; font-size: .65rem; line-height: 1.3; }
  .theme-control > summary { height: 52px; }
}
@media (prefers-reduced-motion: reduce) { .button { transition: none; } }
@media print {
  :root { color-scheme: light; }
  .theme-control { display: none; }
  .brand-logo { content: url('/assets/brand/jansetu-logo.svg'); }
}