/* Dark mode for the blog: the app's palette (public/dark.css). Loaded after blog.css with a media query that follows the device, or
   forced on/off by the choice saved with the top bar's switch (layout.js sets the link's media before the first paint). The Listeo theme
   hard-codes whites and greys all over, hence the !importants. */
:root { color-scheme: dark; --bg: #0f1114; --fg: #eceef1; --muted: #99a1ad; --line: #262a31; --card: #181b20; }
html, body, #wrapper, .container { background: var(--bg) !important; color: var(--fg); }
main :is(h1, h2, h3, h4, h5, h6, p, li, label, td, th, span, strong, b, dt, dd, div) { color: var(--fg); }
main :is(.muted, small, .meta, .crumbs, .crumbs a, .cbody + *, .cmeta span, .feed small, .feed .ftext) { color: var(--muted) !important; }
a { color: #5aa9ff; }
hr { border-color: var(--line); background: var(--line); }

/* Top bar and side menu */
.topbar { background: rgba(15,17,20,0.97); border-bottom-color: var(--line); }
.topbar .brand, .topbar .burger, .topbar .auth a, #themeToggle { color: var(--fg); }
.topbar .burger.active { color: var(--accent); }
#sideMenu, .menupage { background: var(--bg); border-right-color: var(--line); }
#sideMenu li, .menupage li { border-bottom-color: var(--line); }
#sideMenu a, .menupage a { color: var(--fg); }
#sideMenu a[aria-current], .menupage a[aria-current] { color: var(--accent); }
footer.site { border-top-color: var(--line); }

/* Cards, rows, panels */
.lcard a { background: var(--card); }
.lcard .strip p { color: var(--muted); }
.stars i { color: #3a3f48; }
.stars i.on { color: #ffc600; }
.facts, .nearby a, .frow, .fpost, .comment { background: var(--card); }
.feed .frow { background: none; }
.feed li, .feed .frow { border-bottom-color: var(--line); }
.feed .fimg { background: var(--card); }
.fpost, .comment, .facts { border-color: var(--line); }
.av { background: hsl(var(--h, 0), 35%, 38%); }
.event .evdate b { color: var(--fg); }
.sitemap { background: var(--card); }
.gm-style-iw, .gm-style-iw * { color: #222 !important; } /* Google's info boxes stay white */
.gm-style-iw a { color: #1a0dab !important; }

/* Buttons, pills, forms */
.btn.alt, .catnav a, .sortbar button { color: var(--fg); border-color: #3a3f48; background: transparent; }
.catnav a[aria-current], .sortbar button[aria-pressed=true] { background: var(--accent); border-color: var(--accent); color: #fff; }
.pager a { color: #5aa9ff; }
input, textarea, select { background: var(--card) !important; color: var(--fg) !important; border-color: #3a3f48 !important; }
input::placeholder, textarea::placeholder { color: var(--muted); }
.msg.error { color: #ff7b72; }
.msg.ok { color: #56d364; }
.products .pimg { border-color: var(--line); } /* the product photos keep their white backdrop */
.products .price { color: var(--fg); }
.cats a { color: var(--fg); border-color: #3a3f48; }
.cats a:hover { color: var(--accent); border-color: var(--accent); }