/* Page frame and colour themes for every attenda page.
   - The footer always sits at the bottom: the page is a column at least as tall as the window.
   - Dark (default) and light themes, chosen with the toggle and remembered per browser; until someone
     chooses, the device setting decides. The projector screen always stays dark.
   - Flat on purpose: no background glows and no soft focus halos. */

:root { --accent:#59d8b2; --text:#fff; --text-soft:#c8ccd2; --text-faint:#a8afb8; --surface:#0d1626; --line:#1e2836; --hover:#111b2b; }
html[data-theme="light"] { --paper:#f2f4f6; --accent:#0b7a59; --text:#17212b; --text-soft:#4a5560; --text-faint:#66727d; --surface:#fff; --line:#dde2e7; --hover:#e6eaee; }

/* ---------- Frame: footer at the bottom ---------- */
body { display:flex; flex-direction:column; min-height:100vh; min-height:100dvh; background-image:none; }
body > main { flex:1 0 auto; width:min(1200px,calc(100% - 48px)); margin:0 auto; }
body > main.screen { width:auto; margin:0; }
.site-foot { flex:none; margin-top:48px; border-top:1px solid var(--line); }
.site-foot-inner { display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; width:min(1200px,calc(100% - 48px)); margin:0 auto; padding:22px 0 26px; color:var(--text-faint); font-size:12px; }
.site-foot-inner nav { display:flex; gap:18px; margin-left:auto; }
.site-foot-inner a { color:var(--accent); font-weight:600; text-decoration:none; }
.site-foot-inner a:hover { text-decoration:underline; }
.legal-footer { display:none; }

/* ---------- Theme toggle ---------- */
.theme-toggle { display:inline-grid; place-items:center; width:36px; height:36px; flex:none; padding:0; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--text); cursor:pointer; }
.theme-toggle:hover { background:var(--hover); }
.theme-toggle svg { width:18px; height:18px; }
.theme-toggle .icon-sun { display:none; }
html[data-theme="light"] .theme-toggle .icon-sun { display:block; }
html[data-theme="light"] .theme-toggle .icon-moon { display:none; }
.nav-end { display:flex; align-items:center; gap:14px; }
.theme-toggle.is-floating { position:fixed; right:16px; bottom:16px; z-index:20; background:var(--surface); }

/* ---------- Plain focus everywhere (replaces the soft glow ring) ---------- */
input:focus, textarea:focus, select:focus { outline:2px solid var(--blue); outline-offset:0; border-color:var(--blue); box-shadow:none; }
a:focus-visible, button:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }

/* ---------- Light theme: everything that sits on the page background ---------- */
html[data-theme="light"] body { background-color:var(--paper); color:var(--text); }
html[data-theme="light"] .brand, html[data-theme="light"] .site-topbar .brand { color:var(--text); }
html[data-theme="light"] .back, html[data-theme="light"] .eyebrow, html[data-theme="light"] .legal-footer a, html[data-theme="light"] .site-footer a,
html[data-theme="light"] .site-footer .footer-links, html[data-theme="light"] .live-privacy .text-action { color:var(--accent); }
html[data-theme="light"] .lead, html[data-theme="light"] .stream-waiting, html[data-theme="light"] .live-tab { color:var(--text-soft); }
html[data-theme="light"] .empty { border-color:#b9c1c9; color:var(--text-soft); }
html[data-theme="light"] .panel, html[data-theme="light"] .legal-copy { border:1px solid var(--line); }
html[data-theme="light"] .live-tabs { background:#e3e7eb; }
html[data-theme="light"] .lang-toggle { border-color:#b9c1c9; background:#fff; color:var(--text); }
html[data-theme="light"] .capacity b { color:#7ff0cb; }

/* Admin: themed in assets/admin.css. */

/* Profiles */
html[data-theme="light"] .pf-side-card, html[data-theme="light"] .pf-savebar { border-color:var(--line); background:#fff; color:var(--text-soft); }
html[data-theme="light"] .pf-side-card h3, html[data-theme="light"] .pf-side-card a, html[data-theme="light"] #save-state.is-dirty { color:var(--text); }
html[data-theme="light"] .pf-side-card a { border-top-color:var(--line); }
html[data-theme="light"] .pf-side-card small { color:var(--accent); }
html[data-theme="light"] .pf-hero .pf-avatar { border-color:var(--line); background:#fff; color:var(--text); }
html[data-theme="light"] .pf-headline { color:#283641; }
html[data-theme="light"] .pf-location { color:var(--text-faint); }
html[data-theme="light"] .pf-links a { border-color:#c9d0d6; background:#fff; color:var(--text); }
html[data-theme="light"] .pf-links a:hover { border-color:var(--text); }
html[data-theme="light"] .pf-card, html[data-theme="light"] .pf-work, html[data-theme="light"] .pf-person, html[data-theme="light"] .pf-preview { border-color:var(--line); }

/* The projector screen stays dark in both themes. */
html[data-theme="light"] body:has(> main.screen) { background-color:#050b18; color:#fff; }