/* Eigen CSS van de app, na /app.css en /theme.css geladen (ook op de core-pagina's). */

/* Logo in de zijbalk en op de inlogpagina: precies het merkgroen, niet het (iets lichtere) accent. */
.brand-mark { background: var(--brand); }

/* Attribuutsets (was een <style>-blok in attribute-sets.html). */
.set-detail h3 { margin: 1.25rem 0 0.35rem; font-size: 1rem; }
.set-detail .resolved { color: var(--ink-faint); text-decoration: line-through; }
.set-detail td.check { width: 2rem; }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 900px) { .cols { grid-template-columns: 1fr; } }
/* Lijst van sets in-/uitklapbaar: na het kiezen van een set klapt de (lange) lijst
   in en staat de analyse direct in beeld. */
details.panel > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-weight: 600; }
details.panel > summary::-webkit-details-marker { display: none; }
details.panel > summary::before { content: '▸'; margin-right: 0.5rem; color: var(--ink-faint); }
details.panel[open] > summary::before { content: '▾'; }
#sets-summary-hint { font-weight: 400; }
tr.active td { background: var(--accent-tint); }
#d-attrs-details summary { cursor: pointer; font-weight: 600; font-size: 1rem; margin: 1.25rem 0 0.35rem; }

/* Instellingen: attribuutlijsten (was een <style>-blok in settings.html). */
.attr-list { max-height: 420px; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.5rem 0.75rem; columns: 2; }
.attr-list label { display: block; font-weight: 400; color: var(--ink); font-size: 0.9rem; padding: 0.15rem 0; break-inside: avoid; }
.attr-list label.blocked { color: var(--ink-faint); text-decoration: line-through; }