/* public/schermen/concurrenten/veranderingen.css — alleen wat het scherm Veranderingen extra nodig heeft (docs/ontwerp/concurrenten/03). Alles onder .cc, alleen huid-variabelen. */

/* tegels met staafjes */
.cc .cvr-tg{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;min-width:0}
.cc .cvr-tg>div:first-child{min-width:0}
.cc .cvr-sr{display:flex;align-items:flex-end;gap:6px;flex:none}
.cc .cvr-sr b{font-size:12px;font-weight:600}
.cc .cvr-bij{font-size:12px;font-weight:500}
/* held-tegel: verdeling per soort */
.cc .cvr-stak{display:flex;height:18px;border-radius:5px;overflow:hidden;margin:8px 0 6px;gap:1px}
.cc .cvr-stak i{display:flex;align-items:center;justify-content:center;min-width:14px;font-style:normal;font-size:11px;font-weight:600;background:rgba(255,255,255,.95);color:var(--blauw-900)}
.cc .cvr-stak i:nth-child(2){background:rgba(255,255,255,.75)}
.cc .cvr-stak i:nth-child(3){background:rgba(255,255,255,.55);color:var(--blauw-900)}
.cc .cvr-stak i:nth-child(4){background:rgba(255,255,255,.4);color:var(--wit)}
.cc .cvr-stak i:nth-child(5){background:rgba(255,255,255,.3);color:var(--wit)}
.cc .cvr-stak i:nth-child(n+6){background:rgba(255,255,255,.22);color:var(--wit)}
.cc .cvr-leg{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:12px;color:rgba(255,255,255,.85)}

/* tijdlijn */
.cc .cvr-kopje{min-width:0;flex:1 1 360px}
.cc .cvr-titel{font-size:15px;font-weight:600;letter-spacing:-.01em}
.cc .cvr .cc-filters{flex:0 1 auto;justify-content:flex-end}
.cc .cvr-sel{width:auto;min-width:150px;min-height:34px;padding:0 10px;border-radius:var(--r2)}
.cc .cvr{container-type:inline-size}
.cc .cvr [data-cvr-body]{transition:opacity .12s ease}
.cc .cvr [data-cvr-body].bezig{opacity:.55;pointer-events:none}
.cc .cvr-dag{display:grid;grid-template-columns:112px minmax(0,1fr);border-top:1px solid var(--rand2)}
.cc .cvr-dl{padding:14px 0 0 20px;font-size:13px}
.cc .cvr-dl b{font-weight:600}
.cc .cvr-rijen{display:flex;flex-direction:column;min-width:0}
.cc .cvr-ev{display:grid;grid-template-columns:188px 28px 28px minmax(0,1fr) 176px minmax(0,140px) 12px;gap:10px;align-items:center;min-height:52px;padding:8px 20px 8px 0;border-top:1px solid var(--rand2);color:var(--tekst);font-variant-numeric:tabular-nums;font-size:13px}
.cc .cvr-rijen > :first-child{border-top:0}
.cc .cvr-rijen > :first-child.cvr-ev,.cc .cvr-rijen > .cvr-bundel:first-child > .cvr-ev{border-top:0}
.cc .cvr-ev:hover{background:var(--hover);text-decoration:none;color:var(--tekst)}
.cc .cvr-k{display:flex;align-items:center;gap:6px;border-left:3px solid transparent;padding-left:8px;min-height:30px}
.cc .cvr-ev.nw .cvr-k{border-left-color:var(--blauw-900)}
.cc .cvr-tekst{min-width:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;overflow-wrap:anywhere}
.cc .cvr-wie{font-size:12px}
.cc .cvr-p{text-align:right;white-space:nowrap}
.cc .cvr-prijs s{color:var(--grijs)}
.cc .cvr-prijs b{font-weight:600}
.cc .cvr-p{padding-right:4px}
.cc .cvr-pct{font-size:12px;font-weight:600;margin-left:2px}
.cc .cvr-pct.omlaag{color:var(--koraal-900)}
.cc .cvr-pct.omhoog{color:var(--groen-900)}
.cc .cvr-c{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc .cvr-pijl{color:var(--grijs);font-size:16px;text-align:right;line-height:1}
.cc .cvr-open{cursor:pointer}
.cc .cvr-open.uit .cvr-pijl{transform:rotate(180deg)}
.cc .cvr-onderdelen{background:var(--grijs-100);border-top:1px solid var(--rand2)}
.cc .cvr-onderdelen[hidden]{display:none}
.cc .cvr-onder{display:grid;grid-template-columns:28px minmax(0,1fr) 190px 110px;gap:12px;align-items:center;min-height:40px;padding:6px 20px 6px 188px;border-top:1px solid var(--rand2);color:var(--tekst);font-size:12.5px;font-variant-numeric:tabular-nums}
.cc .cvr-onder:first-child{border-top:0}
.cc .cvr-onder:hover{background:var(--hover);text-decoration:none;color:var(--tekst)}
.cc .cvr-ot{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc .cvr-op{text-align:right;white-space:nowrap}
.cc .cvr-op s{color:var(--grijs)}

@container (max-width:1040px){
  .cc .cvr-ev{grid-template-columns:188px 28px 28px minmax(0,1fr) 176px 12px}
  .cc .cvr-ev .cvr-c{display:none}
  .cc .cvr-onder{grid-template-columns:28px minmax(0,1fr) 160px;padding-left:188px}
  .cc .cvr-onder .k{display:none}
}
@container (max-width:640px){
  .cc .cvr-dag{grid-template-columns:1fr}
  .cc .cvr-dl{padding:12px 20px 0}
  .cc .cvr-ev{grid-template-columns:188px 28px minmax(0,1fr) 12px;padding-left:12px}
  .cc .cvr-ev .cvr-p,.cc .cvr-ev .cc-foto{display:none}
}

/* afstemming op het bord (03-veranderingen.html) */
.cc .cvr-stak{height:16px;margin:6px 0 0;gap:0}
.cc .cvr-stak i{font-size:10px;min-width:0;background:var(--wit);color:var(--blauw-900)}
.cc .cvr-stak i:nth-child(2){background:rgba(255,255,255,.7);color:var(--blauw-900)}
.cc .cvr-stak i:nth-child(3){background:rgba(255,255,255,.45);color:var(--wit)}
.cc .cvr-stak i:nth-child(4){background:rgba(255,255,255,.28);color:var(--wit)}
.cc .cvr-stak i:nth-child(n+5){background:rgba(255,255,255,.22);color:var(--wit)}
.cc .cvr-leg{gap:0 10px;font-size:11px;color:rgba(255,255,255,.8);margin-top:4px}
.cc .cvr-dag{grid-template-columns:110px minmax(0,1fr);gap:12px;padding:12px 16px}
.cc .cvr-dag:first-of-type{border-top:0}
.cc .cvr-dl{padding:0}
.cc .cvr-dl .k{font-weight:400}
.cc .cvr-ev{grid-template-columns:160px 36px 32px minmax(0,1fr) 150px 170px 24px;min-height:0;padding:6px 0;border-top:0}
.cc .cvr-k{border-left:0;padding-left:0;min-height:0}
.cc .cvr-ev.nw{box-shadow:-11px 0 0 -8px var(--blauw-900)}
.cc .cvr-ev .cc-av.klein{width:36px;height:36px;font-size:12px}
.cc .cvr-ev .cc-foto.klein{width:32px;height:32px;border-radius:8px;background:var(--grijs-100);border-color:var(--rand2)}
.cc .cvr-pct{font-size:11px}
.cc .cvr-ev .cvr-p{font-size:12px}
.cc .cvr-ev.nw .cvr-k{border-left-color:transparent}