/* Argus. Dezelfde kleuren als het html-rapport uit werker/argus_werker/rapport.py,
   zodat een uitslag op het scherm en een uitslag in een bestand er hetzelfde
   uitzien. */
:root { --inkt:#1b1b1f; --grijs:#5b5b66; --lijn:#dcdce4; --rand:#f7f7fa;
        --blok:#8b1a1a; --vraag:#8a5a00; --vorm:#4a4a6a; --meld:#3a5a3a; }
* { box-sizing:border-box; }
body { margin:0; color:var(--inkt); background:#fff;
       font:15px/1.6 "Segoe UI", system-ui, -apple-system, sans-serif; }
header { display:flex; flex-wrap:wrap; align-items:baseline; gap:1rem;
         padding:1rem 1.25rem; border-bottom:1px solid var(--lijn); }
header h1 { font-size:1.3rem; margin:0; }
.wie { margin:0; color:var(--grijs); font-size:.9rem; }
main { max-width:60rem; margin:0 auto; padding:1.5rem 1.25rem 4rem; }
h2 { font-size:1.05rem; margin:2rem 0 .75rem; padding-bottom:.35rem;
     border-bottom:1px solid var(--lijn); }
a { color:#2a4d8f; }
.hint { display:block; color:var(--grijs); font-size:.82rem; font-weight:400; }
.fout { background:#fdf0f0; border-left:4px solid var(--blok); padding:.7rem 1rem;
        border-radius:0 .3rem .3rem 0; }
.melding { background:#f1f6f1; border-left:4px solid var(--meld); padding:.7rem 1rem;
           border-radius:0 .3rem .3rem 0; }
.leeg { color:var(--grijs); }

form { display:flex; flex-direction:column; gap:.9rem; max-width:34rem; }
label { font-weight:600; display:flex; flex-direction:column; gap:.3rem; }
input[type=text], input[type=password], input[type=file] {
  font:inherit; padding:.5rem .6rem; border:1px solid var(--lijn);
  border-radius:.3rem; background:#fff; }
button { font:inherit; font-weight:600; padding:.55rem 1.1rem; border:0;
         border-radius:.3rem; background:#2a4d8f; color:#fff; cursor:pointer;
         align-self:flex-start; }
button:hover { background:#22406f; }

table { width:100%; border-collapse:collapse; font-size:.93rem; }
th, td { text-align:left; padding:.5rem .6rem; border-bottom:1px solid var(--lijn);
         vertical-align:top; }
th { font-size:.78rem; text-transform:uppercase; letter-spacing:.06em;
     color:var(--grijs); }
.stand { text-transform:none; }
.stand.wacht   { color:var(--grijs); }
.stand.bezig   { color:var(--vraag); }
.stand.mislukt { color:var(--blok); }
.tellers { display:flex; flex-wrap:wrap; gap:.3rem; }
.t { font-size:.78rem; border-radius:.25rem; padding:.1rem .45rem; white-space:nowrap; }
.t.blokkerend  { background:#fdf0f0; color:var(--blok); }
.t.vragenronde { background:#fdf7ea; color:var(--vraag); }
.t.vormfout    { background:#f3f3f8; color:var(--vorm); }
.t.melding     { background:#f1f6f1; color:var(--meld); }
.t.geen        { background:#f1f6f1; color:var(--meld); }

.bevinding { border-left:4px solid; padding:.85rem 1rem; margin:0 0 1rem;
             border-radius:0 .35rem .35rem 0; }
.bevinding.blokkerend  { border-color:var(--blok); background:#fdf0f0; }
.bevinding.vragenronde { border-color:var(--vraag); background:#fdf7ea; }
.bevinding.vormfout    { border-color:var(--vorm); background:#f3f3f8; }
.bevinding.melding     { border-color:var(--meld); background:#f1f6f1; }
.kop { display:flex; flex-wrap:wrap; gap:.5rem; align-items:baseline;
       margin-bottom:.4rem; }
.ernst { font-size:.7rem; font-weight:700; letter-spacing:.08em;
         text-transform:uppercase; }
.categorie { font-size:.75rem; color:var(--grijs); }
.samenvatting { font-weight:600; }
.toelichting { color:var(--grijs); font-size:.92rem; margin:.5rem 0 0; }
blockquote { margin:.6rem 0 0; padding:.5rem .8rem; background:#fff;
             border:1px solid var(--lijn); border-radius:.25rem; font-size:.92rem; }
blockquote .plek { display:block; color:var(--grijs); font-size:.78rem;
                   margin-bottom:.25rem; }
.orde li { color:#2f5d3a; margin:.3rem 0; }
.overgeslagen li { color:#7a5a00; margin:.3rem 0; }

footer { max-width:60rem; margin:0 auto; padding:1rem 1.25rem 3rem;
         border-top:1px solid var(--lijn); color:var(--grijs); font-size:.85rem; }

body.inlog main { max-width:22rem; margin:14vh auto; }
body.inlog h1 { margin:0; font-size:1.6rem; }
body.inlog .onder { color:var(--grijs); margin:.2rem 0 1.5rem; }

@media (prefers-color-scheme: dark) {
  :root { --inkt:#e9e9ef; --grijs:#a0a0ae; --lijn:#33333f; --rand:#1e1e26; }
  body { background:#16161c; }
  input[type=text], input[type=password], input[type=file],
  blockquote { background:#1e1e26; color:var(--inkt); }
  .bevinding.blokkerend  { background:#2a1717; }
  .bevinding.vragenronde { background:#2a2313; }
  .bevinding.vormfout    { background:#1f1f28; }
  .bevinding.melding     { background:#182018; }
  .fout { background:#2a1717; } .melding { background:#182018; }
  .t.blokkerend { background:#2a1717; } .t.vragenronde { background:#2a2313; }
  .t.vormfout { background:#1f1f28; } .t.melding, .t.geen { background:#182018; }
  a { color:#8ab0f0; }
}