/* SURMAD.EE v2.1.11. Load after each module's existing stylesheet. */
:root { color-scheme:light; }
header { flex-wrap:wrap; }
header.hero > div:not(.theme-picker) { flex:1; min-width:0; }
.theme-picker { display:inline-flex; flex:0 0 auto; align-items:center; gap:3px; margin:0 0 18px auto; padding:3px; border:1px solid var(--line,#d6dfdc); border-radius:999px; background:var(--soft,#edf3f1); }
.theme-picker button { display:inline-flex; align-items:center; justify-content:center; gap:4px; width:auto; min-width:44px; min-height:44px; height:auto; margin:0; padding:8px 10px; border:0; border-radius:999px; background:transparent; color:var(--ink,#202325); font:600 12px/1.2 system-ui,sans-serif; cursor:pointer; white-space:nowrap; text-decoration:none; }
.theme-picker button span { color:inherit; font-size:17px; }
.theme-picker button[aria-pressed="true"] { background:#243b34; color:#fff; }
.theme-picker button:focus-visible { outline:2px solid var(--accent,#243b34); outline-offset:3px; }
.theme-picker button:hover { filter:none; text-decoration:none; }
/* Shared branding for public pages, monitor and documents. */
.site-header { display:flex; gap:18px; align-items:flex-start; }
.site-header .header-logo { flex:0 0 auto; display:block; line-height:0; }
.site-header .site-logo { display:block; width:58px; height:58px; border-radius:13px; }
.site-header .header-heading { flex:1; min-width:0; }
.site-header .header-heading .brand { display:block; font:700 clamp(30px,6vw,50px)/1.1 Georgia,serif; letter-spacing:normal; margin:0 0 8px; overflow-wrap:anywhere; }
.site-header .header-subtitle { display:block; color:var(--muted); }
.site-header > .theme-picker { margin:0 0 0 auto; }
@media(max-width:650px) {
  .theme-picker { gap:2px; margin:0 0 5px auto; padding:1px; background:transparent; }
  .theme-picker button { width:24px; min-width:24px; min-height:24px; padding:2px; gap:0; font-size:0; }
  .theme-picker button span { font-size:12px; }
  header.hero { display:grid; grid-template-columns:54px minmax(0,1fr); grid-template-rows:46px auto; column-gap:10px; row-gap:8px; margin-bottom:24px; }
  header.hero > .site-logo, header.hero > a { grid-column:1; grid-row:1; justify-self:center; }
  header.hero > div:not(.theme-picker) { grid-column:2; grid-row:1 / 3; min-width:0; }
  header.hero > .theme-picker { grid-column:1; grid-row:2; justify-self:center; align-self:start; margin:0; }
  header.hero h1 { overflow-wrap:anywhere; }
  header.hero .lead { margin-bottom:0; }
  header.hero .search-lead, header.hero .statistics-lead { font-size:14px; line-height:1.4; }
  header.hero .search-lead-last, header.hero .statistics-lead-last { display:block; }
  .site-header { display:grid; grid-template-columns:54px minmax(0,1fr); grid-template-rows:46px auto; column-gap:10px; row-gap:8px; padding:14px 4px; }
  .site-header > .header-logo { grid-column:1; grid-row:1; justify-self:center; }
  .site-header .site-logo { width:46px; height:46px; }
  .site-header > .header-heading { grid-column:2; grid-row:1 / 3; }
  .site-header .header-heading .brand { font-size:30px; line-height:1.1; margin-bottom:8px; }
  .site-header .header-subtitle { font-size:14px; line-height:1.4; }
  .site-header > .theme-picker { grid-column:1; grid-row:2; justify-self:center; align-self:start; margin:0; }
  .monitor-header + .hero { padding:20px 0 8px; }
  .monitor-header + .hero h1 { font-size:26px; line-height:1.15; }

}
html[data-theme="dark"] {
 color-scheme:dark;
 --ink:#e7eee9; --muted:#a4b5aa; --line:#34483e; --paper:#19221f;
 --white:#19221f; --bg:#101715; --accent:#98c7ae; --soft:#202e27; --danger:#ffb5ae;
 background:#101715;
}
html[data-theme="dark"] body { background:var(--bg); color:var(--ink); }
html[data-theme="dark"] .card, html[data-theme="dark"] .shell article { background:var(--paper); border-color:var(--line); box-shadow:0 12px 36px #00000026; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] .brand { color:var(--ink); }
html[data-theme="dark"] .lead, html[data-theme="dark"] .check { color:var(--muted); }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background:#111a16; color:var(--ink); border-color:#4d6658; accent-color:var(--accent); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color:#99aca0; opacity:1; }
html[data-theme="dark"] input:focus, html[data-theme="dark"] select:focus, html[data-theme="dark"] textarea:focus { outline:2px solid var(--accent); outline-offset:2px; border-color:var(--accent); }
html[data-theme="dark"] button, html[data-theme="dark"] .button { background:var(--accent); color:#101b14; }
html[data-theme="dark"] a:not(.brand):not(.button), html[data-theme="dark"] a:not(.brand):not(.button):visited { color:var(--accent); text-decoration-color:#729c85; }
html[data-theme="dark"] a:not(.brand):not(.button):hover { color:#c6e6d4; text-decoration-color:currentColor; }
html[data-theme="dark"] .check a:hover { background:var(--soft); }
html[data-theme="dark"] .site-nav a[aria-current="page"],
html[data-theme="dark"] .site-nav a[aria-current="page"]:visited,
html[data-theme="dark"] .site-nav a[aria-current="page"]:hover,
html[data-theme="dark"] .site-nav a[aria-current="page"]:focus-visible { background:var(--accent); color:#101b14; border-color:var(--accent); }
html[data-theme="dark"] .pagination button, html[data-theme="dark"] .secondary { background:var(--soft); color:var(--ink); }
html[data-theme="dark"] .pagination button.active { background:var(--accent); color:#101b14; }
html[data-theme="dark"] .error, html[data-theme="dark"] .alert { background:#3a2425; color:#ffb5ae; border-color:#795253; }
html[data-theme="dark"] .bar-track i { background:#98c7ae; }
html[data-theme="dark"] a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
html[data-theme="dark"] .theme-picker button { background:transparent; color:var(--ink); }
html[data-theme="dark"] .theme-picker button[aria-pressed="true"] { background:var(--accent); color:#101b14; }


/* Keep the homepage name on one line on narrow screens. */
@media(max-width:650px) {
  header.home-header h1 { font-size:clamp(18px,6.8vw,26px); white-space:nowrap; overflow-wrap:normal; }
}
