/* Studio 27 Teamportaal — kleine aanvullingen bovenop styles.css + glass.css.
   Hergebruikt dezelfde tokens (--paper/--ink/--c/--r-*/--glass-*) → 1:1 huisstijl. */

/* boot/spinner in huisstijl */
.boot{position:fixed;inset:0;z-index:210;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;
  background:var(--glass-grad);color:var(--ink-3);font-family:var(--font-display);font-weight:700;font-size:13.5px;}
.boot .spin{width:30px;height:30px;border-radius:50%;border:3px solid var(--glass-line);border-top-color:var(--s27-blue);animation:tspin .8s linear infinite;}
@keyframes tspin{to{transform:rotate(360deg)}}

/* login extras (oauth-btn + divider zitten in de klant-tweaks.css, hier zelf) */
.login-welkom{text-align:center;font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--ink-3);margin-bottom:6px;}
.oauth-btn{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;margin:22px 0 6px;padding:13px;
  border:1px solid var(--glass-border);border-radius:var(--r-md);background:var(--glass-fill-strong);
  font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--ink);transition:box-shadow 150ms,transform 150ms var(--bounce);}
.oauth-btn:hover{box-shadow:var(--glass-sh);transform:translateY(-1px);}
.login-err{color:var(--s27-orange-ink);font-family:var(--font-body);font-size:13px;text-align:center;min-height:18px;margin:6px 0 0;}
.login-card .micro{display:block;text-align:center;font-size:11.5px;color:var(--ink-4);margin-top:10px;}

/* sidebar footer: ingelogd teamlid + uitloggen */
.sb-me{display:flex;align-items:center;gap:10px;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:var(--r-md);padding:9px 10px;}
.sb-me .av{width:34px;height:34px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:800;font-size:12px;color:#fff;background:var(--grad-bp);}
.sb-me .tx{min-width:0;flex:1;line-height:1.2;}
.sb-me .tx b{font-family:var(--font-display);font-size:12.5px;display:block;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sb-me .tx span{font-size:11px;color:var(--ink-4);}
.sb-logout{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--ink-3);background:var(--paper-3);flex:none;transition:background 150ms;}
.sb-logout:hover{background:var(--paper-2);color:var(--s27-orange-ink);}

/* hero greeting */
.t-hero{margin-bottom:8px;}
.t-hero h1{font-family:var(--font-display);font-weight:800;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-0.03em;}
.t-hero .sub{color:var(--ink-3);font-size:14px;font-weight:600;margin-top:2px;}

/* stat-tegels (home) */
.tstats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 6px;}
.tstat{background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-sh);padding:16px 18px;position:relative;overflow:hidden;}
.tstat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c,var(--s27-blue));}
.tstat .n{font-family:var(--font-display);font-weight:900;font-size:clamp(22px,5.5vw,30px);letter-spacing:-0.03em;line-height:1.05;color:var(--c-ink,var(--ink));display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;min-width:0;}
.tstat .l{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--ink-4);margin-top:5px;text-transform:uppercase;letter-spacing:.04em;}

/* proj-row deadline + arrow tweaks */
.proj-row .due{font-family:var(--font-display);font-weight:800;font-size:12.5px;color:var(--ink-3);text-align:right;flex:none;white-space:nowrap;}
.proj-row .due.laat{color:var(--s27-orange-ink);}
.proj-row .due small{display:block;font-weight:700;font-size:9.5px;color:var(--ink-4);text-transform:uppercase;letter-spacing:.04em;}
.proj-row .pr-disc .at{color:var(--ink-3);}

/* ledenraster (collega's) */
.tmembers{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:13px;}
.tmember{display:flex;align-items:center;gap:12px;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-sh);padding:13px 15px;width:100%;text-align:left;transition:transform 160ms var(--ease-out),box-shadow 160ms;}
.tmember:hover{transform:translateY(-3px);box-shadow:var(--glass-sh-lg);}
.tmember .av{width:42px;height:42px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:15px;color:#fff;background:var(--grad-bp);}
.tmember .nm{font-family:var(--font-display);font-weight:800;font-size:14px;letter-spacing:-0.01em;}
.tmember .rol{font-size:11.5px;color:var(--ink-4);font-weight:600;}

/* backlink */
.backlink{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--s27-blue-ink);background:none;padding:0;margin:0 0 14px;}

/* ---- projectdetail-modal extra's ---- */
.pj-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 16px;font-size:13px;color:var(--ink-3);font-weight:600;}
.pj-meta b{color:var(--ink-2);font-family:var(--font-display);}
.pj-avs{display:flex;}
.pj-avs .av{width:30px;height:30px;border-radius:50%;border:2px solid var(--paper);margin-left:-8px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:11px;color:#fff;background:var(--grad-bp);}
.pj-avs .av:first-child{margin-left:0;}
.pj-block{margin-bottom:20px;}
.pj-block h4{font-family:var(--font-display);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-4);margin:0 0 9px;}
.pj-brief{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:15px 17px;font-size:14px;line-height:1.55;color:var(--ink-2);white-space:pre-wrap;}
.pj-brief.leeg{color:var(--ink-4);font-style:italic;}
.status-actions{display:flex;flex-wrap:wrap;gap:8px;}
.st-btn{font-family:var(--font-display);font-weight:700;font-size:12.5px;padding:8px 14px;border-radius:var(--r-pill);
  border:1.5px solid var(--line);background:var(--paper);color:var(--ink-2);transition:all 150ms var(--ease-out);min-height:38px;}
.st-btn:hover{border-color:var(--ink-4);}
.st-btn.on{background:var(--ink);color:#fff;border-color:var(--ink);}
.st-btn:disabled{opacity:.5;cursor:default;}
.sub-row{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);margin-bottom:8px;}
.sub-row .sb-bar{width:4px;align-self:stretch;border-radius:3px;background:var(--ink-4);flex:none;}
.sub-row .sb-nm{flex:1;min-width:0;font-family:var(--font-display);font-weight:700;font-size:13.5px;}
.linkcard{display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);margin-bottom:8px;text-decoration:none;color:inherit;transition:transform 150ms,box-shadow 150ms;}
.linkcard:hover{transform:translateX(3px);box-shadow:var(--sh-sm);}
.linkcard .li{width:36px;height:36px;border-radius:9px;background:var(--s27-blue-soft);color:var(--s27-blue-ink);display:flex;align-items:center;justify-content:center;flex:none;}
.linkcard .ll{font-family:var(--font-display);font-weight:700;font-size:13.5px;}
.linkcard .lu{font-size:11px;color:var(--ink-4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* chat intern + composer toggle */
.msg.intern .bubble{background:var(--s27-yellow-soft);border-color:color-mix(in oklab,var(--s27-yellow) 40%,transparent);}
.msg.intern .who::after{content:" · interne notitie";color:var(--s27-yellow-ink);font-weight:700;}
.chat-tools{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.chat-toggle{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-display);font-weight:700;font-size:12.5px;color:var(--ink-3);cursor:pointer;}
.chat-toggle input{width:16px;height:16px;accent-color:var(--s27-yellow-ink);}
.chat-hint{font-size:11.5px;color:var(--ink-4);}

/* verlof */
.vl-row{display:flex;align-items:center;gap:14px;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-sh);padding:14px 18px;margin-bottom:9px;}
.vl-row .vl-type{font-family:var(--font-display);font-weight:800;font-size:15px;flex:1;}
.vl-row .vl-dates{font-size:13px;color:var(--ink-3);font-weight:600;}
.vl-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.dropdown-soon{opacity:.6}

/* binnenkort */
.soon-card{background:var(--glass-fill);border:1px dashed var(--glass-border);border-radius:20px;box-shadow:var(--glass-sh);padding:34px;text-align:center;}
.soon-card .ic{font-size:34px;margin-bottom:8px;}
.soon-card h3{font-family:var(--font-display);font-weight:800;font-size:18px;margin:0 0 6px;}
.soon-card p{color:var(--ink-3);font-size:14px;max-width:46ch;margin:0 auto;}
.soon-card .tag{display:inline-block;margin-top:14px;font-family:var(--font-display);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--s27-purple-ink);background:var(--s27-purple-soft);padding:4px 12px;border-radius:var(--r-pill);}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;
  font-family:var(--font-display);font-weight:700;font-size:13.5px;padding:12px 20px;border-radius:var(--r-pill);box-shadow:var(--sh-lg);
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s var(--bounce);z-index:300;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* rol-chip in sidebar-footer */
.role-chip{display:inline-block;font-family:var(--font-display);font-weight:800;font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;padding:2px 7px;border-radius:var(--r-pill);}
.role-chip.role-admin{background:var(--s27-purple-soft);color:var(--s27-purple-ink);}
.role-chip.role-sales{background:var(--s27-green-soft);color:var(--s27-green-ink);}
.role-chip.role-accountmanager{background:var(--s27-pink-soft);color:var(--s27-pink-ink);}

/* account-overzicht (Ilke) */
.acc-search{position:relative;margin:0 0 16px;}
.acc-search input{width:100%;font-family:var(--font-body);font-size:14px;padding:12px 14px 12px 42px;border:1px solid var(--glass-border);border-radius:var(--r-md);background:var(--glass-fill);color:var(--ink);outline:none;transition:box-shadow 150ms;}
.acc-search input:focus{box-shadow:var(--focus);border-color:var(--s27-blue);}
.acc-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--ink-4);}
.acc-card{background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:18px;box-shadow:var(--glass-sh);margin-bottom:9px;overflow:hidden;transition:box-shadow 150ms;}
.acc-card:hover{box-shadow:var(--glass-sh-lg);}
.acc-head{display:flex;align-items:center;gap:13px;width:100%;padding:15px 18px;text-align:left;}
.acc-head .acc-sw{width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,var(--s27-purple),var(--s27-blue));flex:none;}
.acc-main{flex:1;min-width:0;}
.acc-nm{font-family:var(--font-display);font-weight:800;font-size:15.5px;letter-spacing:-0.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.acc-subline{font-size:12px;color:var(--ink-4);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px;}
.acc-meta{display:flex;align-items:center;gap:8px;flex:none;}
.acc-badge{font-family:var(--font-display);font-weight:700;font-size:11.5px;color:var(--ink-3);background:var(--paper-3);padding:4px 11px;border-radius:var(--r-pill);white-space:nowrap;}
.acc-badge.bad{background:var(--s27-orange-soft);color:var(--s27-orange-ink);}
.acc-head .chev{color:var(--ink-4);transition:transform .2s var(--ease);flex:none;}
.acc-head.open .chev{transform:rotate(180deg);}
.acc-body{display:none;padding:0 16px 12px;}
.acc-body.open{display:block;}

/* cijfers/financieel + health */
.fincard{background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-sh);padding:20px 22px;margin-bottom:16px;}
.fincard h3{font-family:var(--font-display);font-weight:800;font-size:16px;margin:0 0 14px;letter-spacing:-0.01em;}
.cbars{display:flex;flex-direction:column;gap:8px;}
.cbar{display:flex;align-items:center;gap:13px;font-size:13px;}
.cbar-l{width:120px;flex:none;font-family:var(--font-display);font-weight:700;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cbar-t{flex:1;height:12px;border-radius:var(--r-pill);background:rgba(150,120,150,.16);overflow:hidden;}
.cbar-t i{display:block;height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--s27-blue),var(--s27-purple));}
.cbar.green .cbar-t i{background:linear-gradient(90deg,var(--s27-green),var(--s27-blue));}
.cbar-v{width:96px;flex:none;text-align:right;font-family:var(--font-display);font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink);}
.disclaimer-note{display:flex;gap:10px;align-items:flex-start;font-size:12px;color:var(--ink-2);background:var(--s27-yellow-soft);border:1px solid color-mix(in oklab,var(--s27-yellow) 35%,transparent);border-radius:var(--r-md);padding:12px 15px;margin-top:6px;line-height:1.55;}
.disclaimer-note span:first-child{font-weight:800;color:var(--s27-yellow-ink);}
.uren-row{display:flex;align-items:center;gap:13px;font-size:13px;margin-bottom:7px;}
.uren-row .un{width:130px;flex:none;font-family:var(--font-display);font-weight:700;color:var(--ink-2);}
.uren-row .ut{flex:1;height:14px;border-radius:var(--r-pill);background:rgba(150,120,150,.16);overflow:hidden;}
.uren-row .ut i{display:block;height:100%;border-radius:var(--r-pill);}
.uren-row .uv{width:48px;flex:none;text-align:right;font-family:var(--font-display);font-weight:800;font-variant-numeric:tabular-nums;}
.acc-fb{font-family:var(--font-display);font-weight:700;font-size:11px;color:var(--s27-orange-ink);background:var(--s27-orange-soft);padding:4px 9px;border-radius:var(--r-pill);white-space:nowrap;}

/* projectdetail bewerk-controls */
.pj-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.pj-brieftext{width:100%;min-height:120px;font-family:var(--font-body);font-size:14px;line-height:1.55;padding:13px 15px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);color:var(--ink-2);outline:none;resize:vertical;transition:box-shadow 150ms;}
.pj-brieftext:focus{box-shadow:var(--focus);border-color:var(--s27-blue);}
.as-wrap{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.as-chip{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-pill);padding:4px 6px 4px 5px;font-family:var(--font-display);font-weight:700;font-size:12.5px;color:var(--ink-2);}
.as-chip .av{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;background:var(--grad-bp);}
.as-x{width:18px;height:18px;border-radius:50%;background:var(--paper-3);color:var(--ink-3);font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;}
.as-x:hover{background:var(--s27-orange-soft);color:var(--s27-orange-ink);}
.as-add{font-family:var(--font-body);font-size:13px;padding:7px 12px;border:1px dashed var(--line);border-radius:var(--r-pill);background:var(--paper);color:var(--ink-3);cursor:pointer;outline:none;}
.as-add:focus{box-shadow:var(--focus);}
.klant-jump{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--s27-blue-ink);background:var(--s27-blue-soft);padding:4px 11px;border-radius:var(--r-pill);text-decoration:none;transition:transform 150ms var(--bounce);display:inline-block;}
.klant-jump:hover{transform:translateY(-1px);}

@media(max-width:1100px){ .tstats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){ .tstats,.vl-grid,.pj-edit-grid{grid-template-columns:1fr;} .acc-head .acc-meta{display:none;} .cbar-l,.uren-row .un{width:90px;} }

/* AI-dagplanning */
.ai-plan{font-size:14.5px;line-height:1.85;color:var(--ink-2);}
.ai-plan b{font-family:var(--font-display);font-weight:800;color:var(--ink);font-size:15px;display:inline-block;margin-top:6px;}

/* ── Admin-impersonatie (enkel zaakvoerder) ───────────────────────────── */
#impCtl{display:flex;align-items:center;}
.imp-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 13px;border-radius:var(--r-pill);
  border:1px solid var(--s27-purple-soft);background:var(--paper);color:var(--s27-purple-ink);cursor:pointer;
  font-family:var(--font-display);font-weight:700;font-size:12.5px;transition:transform 150ms var(--bounce),box-shadow 150ms;}
.imp-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(94,80,200,.18);}
.imp-btn svg{flex:none;}
.imp-banner{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:var(--r-pill);
  border:none;background:var(--grad-bp);color:#fff;cursor:pointer;
  font-family:var(--font-display);font-weight:800;font-size:12.5px;box-shadow:0 6px 18px rgba(94,80,200,.32);
  animation:pulseDot 2.6s var(--ease-out) infinite;}
.imp-banner svg{flex:none;opacity:.92;}
.imp-banner:hover{filter:brightness(1.05);}
.imp-list{display:flex;flex-direction:column;gap:7px;}
.imp-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 12px;border-radius:var(--r-md);
  border:1px solid var(--line);background:var(--paper);cursor:pointer;transition:transform 130ms var(--bounce),box-shadow 130ms,border-color 130ms;}
.imp-row:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(94,80,200,.16);border-color:var(--s27-purple-soft);}
.imp-row .av{width:38px;height:38px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:800;font-size:14px;color:#fff;background:var(--grad-bp);}
.imp-row .nm{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--ink);}
.imp-row .rol{font-size:11.5px;color:var(--ink-4);margin-top:1px;}

/* ── Weekplanner (drag-and-drop) ──────────────────────────────────────── */
.pl-hero{margin-bottom:4px;}
.pl-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:6px 0 14px;}
.pl-nav{display:flex;align-items:center;gap:6px;}
.pl-arrow{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink-3);font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform 130ms var(--bounce),box-shadow 130ms;}
.pl-arrow:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(0,0,0,.10);}
.pl-today{height:34px;padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--s27-purple-soft);background:var(--paper);color:var(--s27-purple-ink);font-family:var(--font-display);font-weight:700;font-size:12.5px;cursor:pointer;}
.pl-today:hover{background:var(--s27-purple-soft);}
.pl-week{font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--ink);}
.pl-who{margin-left:auto;}
.pl-select{height:36px;padding:0 30px 0 13px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--paper);color:var(--ink);font-family:var(--font-display);font-weight:700;font-size:12.5px;cursor:pointer;
  -webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2390909a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;}

.pl-wrap{display:flex;align-items:flex-start;gap:14px;}
.pl-backlog{flex:none;width:248px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:12px;position:sticky;top:8px;max-height:calc(100vh - 150px);display:flex;flex-direction:column;}
.pl-bl-head{font-family:var(--font-display);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-4);margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.pl-bl-n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--r-pill);background:var(--s27-purple-soft);color:var(--s27-purple-ink);font-size:11px;}
.pl-bl-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1;padding-right:2px;}
.pl-empty{font-size:12.5px;color:var(--ink-4);padding:18px 6px;text-align:center;}

.pl-card{position:relative;display:flex;align-items:center;gap:9px;padding:9px 11px 9px 13px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--paper);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform 120ms var(--bounce),box-shadow 120ms;}
.pl-card:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.10);}
.pl-card>.bar{position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:var(--r-pill);background:var(--c);}
.pl-card-main{flex:1;min-width:0;}
.pl-card-nm{font-family:var(--font-display);font-weight:700;font-size:12.5px;color:var(--ink);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-card-sub{font-size:10.5px;color:var(--ink-4);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-est{flex:none;font-family:var(--font-display);font-weight:800;font-size:11px;color:var(--c-ink);background:var(--c-soft);border-radius:var(--r-pill);padding:2px 7px;}
.pl-due{flex:none;font-size:10px;font-weight:700;color:var(--ink-4);}
.pl-due.laat{color:var(--s27-orange-ink);}

.pl-grid{flex:1;min-width:0;display:flex;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:auto;}
.pl-gutter{flex:none;width:50px;border-right:1px solid var(--line);}
.pl-colhead{height:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper);z-index:3;}
.pl-colhead b{font-family:var(--font-display);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);line-height:1;}
.pl-colhead span{font-size:10.5px;color:var(--ink-4);margin-top:2px;}
.pl-colhead.today b{color:var(--s27-purple-ink);}
.pl-colhead.today{background:var(--s27-purple-soft);}
.pl-gh{border-bottom:1px solid var(--line);}
.pl-hr{position:relative;border-bottom:1px dashed var(--line);}
.pl-hr span{position:absolute;top:-7px;right:6px;font-size:10px;color:var(--ink-4);background:var(--paper);padding:0 2px;}
.pl-cols{flex:1;min-width:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(148px,1fr);}
.pl-col{border-right:1px solid var(--line);min-width:0;}
.pl-col:last-child{border-right:none;}
.pl-col.today{background:rgba(124,108,232,.035);}
.pl-colbody{position:relative;}
.pl-colbody.drop,.pl-col.pl-drop .pl-colbody{background:var(--s27-purple-soft);}
.pl-backlog.pl-drop{outline:2px dashed var(--s27-purple);outline-offset:-2px;}
.pl-line{position:absolute;left:0;right:0;height:0;border-top:1px dashed var(--line);pointer-events:none;}

.pl-block{position:absolute;left:4px;right:4px;border-radius:8px;background:var(--c-soft);border:1px solid var(--c);border-left:3px solid var(--c);padding:5px 8px;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 1px 3px rgba(0,0,0,.08);transition:box-shadow 120ms;z-index:1;}
.pl-block:hover{box-shadow:0 6px 16px rgba(0,0,0,.16);z-index:2;}
.pl-block>.bar{display:none;}
.pl-bl-nm{font-family:var(--font-display);font-weight:700;font-size:11.5px;color:var(--c-ink);line-height:1.15;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.pl-bl-meta{font-size:10px;color:var(--ink-4);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pl-bl-dl{display:inline-block;margin-top:3px;font-size:9.5px;font-weight:700;color:var(--s27-orange-ink);}
.pl-dragging{opacity:.32;pointer-events:none;}

.pl-ghost{position:fixed;z-index:99999;pointer-events:none;max-width:230px;padding:8px 12px;border-radius:10px;background:var(--c);color:#fff;font-family:var(--font-display);font-weight:700;font-size:12px;box-shadow:0 12px 30px rgba(0,0,0,.28);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
body.pl-grabbing,body.pl-grabbing *{cursor:grabbing !important;}

@media(max-width:760px){
  .pl-wrap{flex-direction:column;}
  .pl-backlog{width:100%;position:static;max-height:none;}
  .pl-bl-list{max-height:210px;}
  .pl-grid{width:100%;}
}

/* ── Berichten-inbox ──────────────────────────────────────────────────── */
.msg-inbox{display:flex;flex-direction:column;gap:10px;}
.mi-row{position:relative;display:flex;align-items:flex-start;gap:13px;width:100%;text-align:left;padding:14px 16px 14px 18px;
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper);cursor:pointer;
  transition:transform 130ms var(--bounce),box-shadow 130ms,border-color 130ms;}
.mi-row:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.10);border-color:var(--c-soft);}
.mi-row>.bar{position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:var(--r-pill);background:var(--c);}
.mi-main{flex:1;min-width:0;}
.mi-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px;}
.mi-bedrijf{font-family:var(--font-display);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--c-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mi-tijd{flex:none;font-size:11px;color:var(--ink-4);}
.mi-naam{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--ink);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mi-snippet{font-size:12.5px;color:var(--ink-3);margin-top:4px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mi-badge{flex:none;align-self:center;font-family:var(--font-display);font-weight:800;font-size:11.5px;color:#fff;background:var(--c);border-radius:var(--r-pill);padding:6px 12px;box-shadow:0 4px 12px rgba(0,0,0,.12);}
@media(max-width:600px){ .mi-badge{display:none;} }

/* ── Shoot-aanvragen (creator-accept) ─────────────────────────────────── */
.ar-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.ar-list{display:flex;flex-direction:column;gap:11px;}
.ar-card{position:relative;display:flex;align-items:center;gap:16px;padding:15px 17px 15px 19px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper);box-shadow:0 2px 8px rgba(0,0,0,.04);}
.ar-card>.bar{position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:var(--r-pill);background:var(--c);}
.ar-main{flex:1;min-width:0;}
.ar-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.ar-bedrijf{font-family:var(--font-display);font-weight:800;font-size:14.5px;color:var(--ink);}
.ar-when{font-family:var(--font-display);font-weight:700;font-size:12.5px;color:var(--c-ink);background:var(--c-soft);border-radius:var(--r-pill);padding:2px 9px;}
.ar-loc{font-size:12.5px;color:var(--ink-3);margin-top:5px;}
.ar-note{font-size:12.5px;color:var(--ink-3);margin-top:5px;line-height:1.4;}
.ar-by{font-size:11px;color:var(--ink-4);margin-top:7px;}
.ar-acts{flex:none;display:flex;flex-direction:column;gap:7px;}
.ar-acts .btn{white-space:nowrap;}
.ar-mini{padding:11px 15px;box-shadow:none;background:var(--paper-2,var(--paper));opacity:.92;}
.ar-mini .ar-by{margin-top:3px;}
.ar-done{margin-top:2px;}
@media(max-width:600px){ .ar-card{flex-direction:column;align-items:stretch;} .ar-acts{flex-direction:row;} .ar-acts .btn{flex:1;} }

/* ── Weekplanner v2: 7 dagen, agenda-overlay, vaste blokken, resize ──────── */
.pl-cols{grid-auto-columns:minmax(132px,1fr);}
.pl-col.weekend{background:rgba(158,145,158,.05);}
.pl-col.weekend .pl-colhead{background:rgba(158,145,158,.07);}
.pl-col.weekend.today{background:rgba(124,108,232,.05);}

/* all-day-balk (verlof + all-day agenda) tussen kop en raster — vaste hoogte = uitlijning gutter */
.pl-allday{height:24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:4px;padding:0 5px;overflow:hidden;}
.pl-allday.pl-gh{background:var(--paper);}
.pl-ad{flex:none;max-width:100%;font-size:9.5px;font-weight:800;border-radius:5px;padding:2px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-display);}
.pl-ad.verlof{background:var(--s27-orange-soft);color:var(--s27-orange-ink);}
.pl-ad.agenda{background:var(--ink-4);color:#fff;}

/* read-only Google-agenda-blok */
.pl-event{position:absolute;left:4px;right:4px;border-radius:8px;padding:4px 8px;overflow:hidden;cursor:default;z-index:1;
  background:repeating-linear-gradient(45deg,#EFEAE1,#EFEAE1 7px,rgba(158,145,158,.10) 7px,rgba(158,145,158,.10) 9px);
  border:1px solid #D9D1C4;}
.pl-event-nm{font-family:var(--font-display);font-weight:700;font-size:11px;color:var(--ink-3);line-height:1.15;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.pl-event-meta{font-size:9.5px;color:var(--ink-4);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* vaste taakblokken (shoot/meeting/payroll): slotje, klikbaar maar niet sleepbaar */
.pl-vast{cursor:pointer;}
.pl-vast::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 9px,rgba(255,255,255,.28) 9px,rgba(255,255,255,.28) 11px);pointer-events:none;border-radius:8px;}
.pl-lock{position:absolute;top:3px;right:5px;font-size:10px;line-height:1;opacity:.85;z-index:2;}

/* resize-greep onderaan een verplaatsbaar blok */
.pl-movable::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;cursor:ns-resize;border-radius:0 0 8px 8px;background:linear-gradient(to bottom,transparent,rgba(0,0,0,.05));}
.pl-movable:hover::after{background:linear-gradient(to bottom,transparent,rgba(0,0,0,.12));}
.pl-resizing{box-shadow:0 8px 22px rgba(0,0,0,.20);z-index:5;opacity:1 !important;}
.pl-show-resize::before{content:var(--rz);position:absolute;right:6px;bottom:6px;z-index:3;font-family:var(--font-display);font-weight:800;font-size:10px;background:var(--c);color:#fff;padding:1px 6px;border-radius:6px;}

/* ── Capaciteit ─────────────────────────────────────────────────────────── */
.cap-table{display:flex;flex-direction:column;gap:9px;margin-top:6px;}
.cap-row{display:grid;grid-template-columns:1fr 120px auto;grid-template-areas:"naam bar num" "sub sub sub";align-items:center;gap:10px 12px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);}
.cap-row.leeg{border-color:var(--s27-orange-soft);background:linear-gradient(0deg,var(--s27-orange-soft),var(--paper) 60%);}
.cap-naam{grid-area:naam;font-family:var(--font-display);font-weight:700;font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:8px;}
.cap-flag{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--s27-orange-ink);background:var(--s27-orange-soft);border-radius:var(--r-pill);padding:2px 7px;}
.cap-bars{grid-area:bar;height:8px;border-radius:var(--r-pill);background:var(--line);overflow:hidden;}
.cap-bar{height:100%;border-radius:var(--r-pill);background:var(--grad-bp);}
.cap-bar.alt{background:var(--s27-blue);}
.cap-num{grid-area:num;font-size:12.5px;color:var(--ink-3);white-space:nowrap;}
.cap-num b{font-family:var(--font-display);color:var(--ink);}
.cap-sub{grid-area:sub;font-size:11px;color:var(--ink-4);}
.cap-disc{display:flex;gap:8px;margin-top:18px;padding:12px 14px;border-radius:var(--r-md);background:var(--paper-2,rgba(158,145,158,.06));font-size:11.5px;color:var(--ink-4);line-height:1.5;}
.cap-disc span:first-child{flex:none;}
@media(max-width:600px){ .cap-row{grid-template-columns:1fr auto;grid-template-areas:"naam num" "bar bar" "sub sub";} .cap-bars{width:100%;} }

/* ---- Capaciteit: openklapbaar teamlid ---- */
.cap-hint{font-size:11.5px;color:var(--ink-4);margin:2px 0 8px;}
.cap-lidlist{display:flex;flex-direction:column;gap:8px;margin-top:4px;}
.cap-lid{border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);overflow:hidden;transition:border-color .15s;}
.cap-lid.leeg{border-color:var(--s27-orange-soft);background:linear-gradient(0deg,var(--s27-orange-soft),var(--paper) 70%);}
.cap-lid.open{border-color:var(--s27-purple-soft,rgba(94,80,200,.32));}
.cap-hd{width:100%;display:grid;grid-template-columns:minmax(120px,1.1fr) 1.5fr auto 18px;align-items:center;gap:12px;padding:12px 14px;background:none;border:0;cursor:pointer;text-align:left;font-family:inherit;}
.cap-hd:hover{background:rgba(94,80,200,.035);}
.cap-hd-naam{font-family:var(--font-display);font-weight:700;font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:8px;}
.cap-hd-mid{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.cap-hd-wk{font-size:12px;color:var(--ink-3);}
.cap-hd-wk b{font-family:var(--font-display);color:var(--ink);font-weight:700;}
.cap-hd-vl{font-size:10.5px;font-weight:700;color:var(--s27-green-ink,#2c7a4b);background:var(--s27-green-soft,rgba(54,179,107,.12));border-radius:var(--r-pill);padding:2px 8px;white-space:nowrap;}
.cap-hd-bz{font-size:12px;color:var(--ink-3);white-space:nowrap;text-align:right;}
.cap-hd-bz b{font-family:var(--font-display);color:var(--ink);font-weight:700;}
.cap-chev{color:var(--ink-4);transition:transform .2s;justify-self:end;}
.cap-lid.open .cap-chev{transform:rotate(180deg);}
.cap-detail{display:none;padding:4px 14px 14px;border-top:1px solid var(--line);}
.cap-lid.open .cap-detail{display:block;}
.cap-weken{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 6px;}
.cw{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 6px 8px;border-radius:var(--r-sm,8px);background:var(--paper-2,rgba(158,145,158,.05));}
.cw.now{background:rgba(94,80,200,.07);outline:1px solid rgba(94,80,200,.18);}
.cw-bar{position:relative;width:30px;height:62px;border-radius:6px;background:var(--line);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;}
.cw-fill{width:100%;border-radius:0 0 6px 6px;background:var(--grad-bp);}
.cw-fill.ok{background:var(--s27-blue);}
.cw-fill.vol{background:linear-gradient(0deg,var(--s27-orange),var(--s27-orange-ink,#e07a2c));}
.cw-fill.leeg{background:var(--s27-green,#36b36b);}
.cw-verlof{position:absolute;top:0;left:0;width:100%;background:repeating-linear-gradient(45deg,rgba(54,179,107,.28),rgba(54,179,107,.28) 4px,transparent 4px,transparent 8px);border-bottom:1px dashed rgba(54,179,107,.5);}
.cw-n{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--ink);}
.cw-vl{font-size:9.5px;color:var(--s27-green-ink,#2c7a4b);font-weight:700;min-height:12px;}
.cw-l{font-size:10px;color:var(--ink-4);text-transform:uppercase;letter-spacing:.03em;}
.cap-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 4px;}
.cap-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-4);margin-right:2px;}
.cap-chip{font-size:11px;color:var(--ink-2,var(--ink-3));background:var(--paper-2,rgba(158,145,158,.07));border:1px solid var(--line);border-radius:var(--r-pill);padding:3px 9px;}
.cap-chip b{font-family:var(--font-display);color:var(--ink);}
.cap-tklist{margin-top:12px;}
.cap-tklist .cap-lbl{display:block;margin-bottom:6px;}
.cap-tk{display:flex;align-items:center;gap:9px;padding:6px 0;border-top:1px solid var(--line);font-size:12.5px;}
.cap-tk:first-of-type{border-top:0;}
.cap-tk-wk{flex:none;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-4);background:var(--line);border-radius:var(--r-pill);padding:2px 7px;}
.cap-tk-wk.nu{color:#fff;background:var(--s27-purple,#5e50c8);}
.cap-tk-n{flex:1;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cap-tk-n i{color:var(--ink-4);font-style:normal;font-size:11px;}
.cap-tk-u{flex:none;font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--ink-3);}
.cap-empty-sm{font-size:12px;color:var(--ink-4);padding:6px 0;}
@media(max-width:600px){ .cap-hd{grid-template-columns:1fr auto 18px;grid-template-areas:"naam bz chev" "mid mid mid";gap:6px 10px;} .cap-hd-naam{grid-area:naam;} .cap-hd-mid{grid-area:mid;} .cap-hd-bz{grid-area:bz;} .cap-chev{grid-area:chev;} }

/* ── Sollicitaties ──────────────────────────────────────────────────────── */
.sol-list{display:flex;flex-direction:column;gap:11px;}
.sol-card{position:relative;display:flex;align-items:center;gap:16px;padding:15px 17px 15px 19px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper);cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.04);transition:transform 130ms var(--bounce),box-shadow 130ms;}
.sol-card:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.10);}
.sol-card>.bar{position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:var(--r-pill);background:var(--c);}
.sol-main{flex:1;min-width:0;}
.sol-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.sol-naam{font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--ink);}
.sol-score{flex:none;font-family:var(--font-display);font-weight:800;font-size:11px;border-radius:var(--r-pill);padding:2px 9px;}
.sol-score.goed{background:var(--s27-green-soft);color:var(--s27-green-ink);}
.sol-score.neutraal{background:var(--line);color:var(--ink-3);}
.sol-vac{font-size:12.5px;color:var(--ink-3);margin-top:3px;}
.sol-dt{color:var(--ink-4);}
.sol-contact{font-size:12px;margin-top:5px;display:flex;gap:6px;flex-wrap:wrap;}
.sol-contact a{color:var(--s27-blue-ink);text-decoration:none;font-weight:600;}
.sol-contact a:hover{text-decoration:underline;}
.sol-acts{flex:none;display:flex;flex-direction:column;gap:7px;align-items:stretch;}
.sol-acts .btn{white-space:nowrap;text-align:center;}
.sol-verdict{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:var(--r-lg);border:1px solid var(--line);margin-bottom:14px;}
.sol-verdict.goed{background:linear-gradient(120deg,var(--s27-green-soft),var(--paper) 70%);border-color:var(--s27-green-soft);}
.sol-verdict.neutraal{background:var(--paper-2,rgba(158,145,158,.05));}
.sol-vscore{flex:none;font-family:var(--font-display);font-weight:900;font-size:34px;line-height:1;color:var(--ink);}
.sol-vscore small{font-size:14px;color:var(--ink-4);font-weight:700;}
.sol-vtx{min-width:0;}
.sol-vtx b{display:block;font-family:var(--font-display);font-size:15px;color:var(--ink);}
.sol-vtx span{font-size:13px;color:var(--ink-3);}
.sol-chips{display:flex;gap:8px;flex-wrap:wrap;}
.sol-chip{font-size:11.5px;font-weight:700;border-radius:var(--r-pill);padding:4px 10px;font-family:var(--font-display);}
.sol-chip.ja{background:var(--s27-green-soft);color:var(--s27-green-ink);}
.sol-chip.nee{background:var(--s27-orange-soft);color:var(--s27-orange-ink);}
.sol-ul{margin:8px 0 0;padding-left:18px;}
.sol-ul li{font-size:13px;color:var(--ink-2,var(--ink-3));margin-bottom:4px;line-height:1.45;}
@media(max-width:600px){ .sol-card{flex-direction:column;align-items:stretch;} .sol-acts{flex-direction:row;} .sol-acts .btn{flex:1;} .sol-verdict{flex-direction:column;text-align:center;} }

/* ── Gezondheid ─────────────────────────────────────────────────────────── */
.gz-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.gz-prog{margin:10px 0;}
.gz-prog-top{display:flex;justify-content:space-between;font-size:12.5px;color:var(--ink-3);margin-bottom:5px;font-family:var(--font-display);font-weight:700;}
.gz-prog-bar{height:9px;border-radius:var(--r-pill);background:var(--line);overflow:hidden;}
.gz-prog-bar i{display:block;height:100%;border-radius:var(--r-pill);background:var(--grad-bp);}
.gz-slots{display:flex;gap:14px;flex-wrap:wrap;margin-top:4px;}
.gz-cb{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink);font-weight:600;cursor:pointer;}
.gz-cb input{width:18px;height:18px;accent-color:var(--s27-purple);}

/* ---- Gezondheid: workout loggen ---- */
.gz-log .gz-field{margin-top:12px;}
.gz-field>label{display:block;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-4);margin-bottom:6px;}
.gz-row2{display:grid;grid-template-columns:auto 1fr;gap:18px;margin-top:12px;align-items:start;}
.gz-chips{display:flex;flex-wrap:wrap;gap:7px;}
.gz-chip{font-family:var(--font-display);font-weight:600;font-size:12.5px;color:var(--ink-2,var(--ink-3));background:var(--paper-2,rgba(158,145,158,.06));border:1px solid var(--line);border-radius:var(--r-pill);padding:7px 13px;cursor:pointer;transition:all .12s;}
.gz-chip:hover{border-color:var(--s27-purple,#5e50c8);}
.gz-chip.on{color:#fff;background:var(--s27-purple,#5e50c8);border-color:var(--s27-purple,#5e50c8);}
.gz-chip.gev{text-transform:capitalize;}
.gz-chip.gev.on.li{background:var(--s27-green,#36b36b);border-color:var(--s27-green,#36b36b);}
.gz-chip.gev.on.zw{background:var(--s27-orange,#e8932f);border-color:var(--s27-orange,#e8932f);}
.gz-chip.gev.on.op{background:#d2503f;border-color:#d2503f;}
.gz-dur{display:inline-flex;align-items:center;gap:6px;}
.gz-dur button{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--paper);font-size:18px;font-weight:700;color:var(--ink-2,var(--ink-3));cursor:pointer;line-height:1;}
.gz-dur button:hover{border-color:var(--s27-purple,#5e50c8);color:var(--s27-purple,#5e50c8);}
.gz-dur input{width:62px;height:34px;text-align:center;border:1px solid var(--line);border-radius:9px;font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--ink);background:var(--paper);}
.gz-dur span{font-size:12.5px;color:var(--ink-4);}
#gz-note{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font-size:14px;color:var(--ink);background:var(--paper);font-family:inherit;}
#gz-note:focus,.gz-dur input:focus{outline:none;border-color:var(--s27-purple,#5e50c8);}
.gz-wo{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);}
.gz-wo:first-of-type{border-top:0;}
.gz-wo-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.gz-wo-type{font-family:var(--font-display);font-weight:700;font-size:13.5px;color:var(--ink);}
.gz-wo-meta{font-size:11.5px;color:var(--ink-4);}
.gz-wo-note{font-size:11.5px;color:var(--ink-3);font-style:italic;}
.gz-wo-hr{color:#c0392b;font-weight:600;}
.gz-hr{display:inline-flex;align-items:center;gap:7px;}
.gz-hr-ic{font-size:14px;}
.gz-hr input{width:62px;height:34px;text-align:center;border:1px solid var(--line);border-radius:9px;font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--ink);background:var(--paper);}
.gz-hr input:focus{outline:none;border-color:var(--s27-purple,#5e50c8);}
.gz-hr-sep{color:var(--ink-4);font-weight:700;}
.gz-hr-u{font-size:12.5px;color:var(--ink-4);}

/* ---- Admin: versie-push-knop in de sidebar-footer ---- */
.sb-pushver{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:8px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-md,10px);background:var(--paper-2,rgba(158,145,158,.05));color:var(--ink-3);font-family:var(--font-display);font-weight:700;font-size:11.5px;cursor:pointer;transition:all .12s;}
.sb-pushver:hover{border-color:var(--s27-purple,#5e50c8);color:var(--s27-purple,#5e50c8);background:rgba(94,80,200,.05);}
.sb-pushver:disabled{opacity:.6;cursor:default;}

/* ---- Cijfers: gestapelde maand-grafiek (per type job / per teamlid) ---- */
.stk{margin-top:4px;}
.stk-legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:12px;}
.stk-li{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-3);}
.stk-li i{width:11px;height:11px;border-radius:3px;flex:none;}
.stk-rows{display:flex;flex-direction:column;gap:7px;}
.stk-row{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:10px;}
.stk-lab{font-size:11.5px;color:var(--ink-4);font-family:var(--font-display);font-weight:700;text-transform:capitalize;}
.stk-bar{display:flex;height:16px;border-radius:5px;overflow:hidden;background:var(--line);}
.stk-seg{height:100%;transition:width .3s;}
.stk-seg:first-child{border-radius:5px 0 0 5px;}
.stk-seg:last-child{border-radius:0 5px 5px 0;}
.stk-tot{font-size:12px;color:var(--ink);font-family:var(--font-display);font-weight:700;white-space:nowrap;min-width:58px;text-align:right;}
@media(max-width:600px){ .stk-row{grid-template-columns:42px 1fr auto;gap:7px;} .stk-tot{min-width:48px;font-size:11px;} }
.stk-ghost{height:100%;background:repeating-linear-gradient(45deg,rgba(150,140,155,.18),rgba(150,140,155,.18) 5px,transparent 5px,transparent 10px);}
.stk-bars{display:flex;flex-direction:column;gap:3px;min-width:0;}
.stk-bar-c{height:9px;opacity:.5;}
.stk-cmp-note{font-size:10.5px;color:var(--ink-4);margin:0 0 8px;}
.stk-dl{display:block;font-size:9.5px;font-weight:800;margin-top:1px;}
.stk-dl.up{color:var(--s27-green-ink,#2c7a4b);}
.stk-dl.down{color:#c0392b;}
.stk-dl.flat{color:var(--ink-4);}

/* ---- Cijfers: filterbalk + dimensie-chips + delta ---- */
.fin-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;}
.fin-fld{display:flex;flex-direction:column;gap:4px;}
.fin-fld>span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-4);}
.fin-sel{height:38px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font-family:var(--font-display);font-weight:700;font-size:13px;padding:0 30px 0 12px;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239a8f9a' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;}
.fin-sel:focus{outline:none;border-color:var(--s27-purple,#5e50c8);}
.fin-custom{display:inline-flex;align-items:center;gap:7px;}
.fin-custom input{height:38px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font-size:13px;padding:0 8px;font-family:inherit;}
.fin-custom input:focus{outline:none;border-color:var(--s27-purple,#5e50c8);}
.fin-custom span{font-size:12px;color:var(--ink-4);}
.fin-pdf{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink-2,var(--ink-3));font-family:var(--font-display);font-weight:700;font-size:12.5px;cursor:pointer;margin-left:auto;align-self:flex-end;}
.fin-pdf:hover{border-color:var(--s27-purple,#5e50c8);color:var(--s27-purple,#5e50c8);}
.fin-active{flex:1;min-width:100%;font-size:11.5px;color:var(--ink-3);font-family:var(--font-display);font-weight:700;padding-top:2px;}
.fin-active .micro{font-weight:600;color:var(--ink-4);}
.fin-chiprow{display:flex;gap:7px;overflow-x:auto;padding-bottom:6px;margin-bottom:8px;-webkit-overflow-scrolling:touch;}
.fin-chip{flex:none;display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--paper);cursor:pointer;font-family:inherit;transition:all .12s;}
.fin-chip i{width:10px;height:10px;border-radius:3px;flex:none;}
.fin-chip .fc-n{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--ink);white-space:nowrap;}
.fin-chip .fc-v{font-size:11px;color:var(--ink-4);white-space:nowrap;}
.fin-chip.off{opacity:.42;}
.fin-chip.off i{filter:grayscale(1);}
.fin-chip:hover{border-color:var(--s27-purple,#5e50c8);}
.fin-quick{display:flex;gap:8px;margin-bottom:12px;}
.fin-quick button{font-size:11px;font-weight:700;color:var(--ink-4);background:none;border:0;cursor:pointer;font-family:var(--font-display);padding:2px 4px;}
.fin-quick button:hover{color:var(--s27-purple,#5e50c8);text-decoration:underline;}
.dlt{display:block;font-size:11px;font-weight:800;margin-top:4px;white-space:nowrap;letter-spacing:0;}
.dlt.up{color:var(--s27-green-ink,#2c7a4b);}
.dlt.down{color:#c0392b;}
.dlt.flat{color:var(--ink-4);}
@media(max-width:600px){ .fin-bar{gap:9px;} .fin-fld,.fin-sel{flex:1;} .fin-sel{width:100%;} .fin-exp{margin-left:0;width:100%;} }

/* ---- Cijfers extra-mile: inzichten / movers / export / contrast ---- */
.dlt.up,.stk-dl.up{color:#1f6b3f;}   /* WCAG AA op wit */
.fin-exp{display:inline-flex;gap:8px;margin-left:auto;align-self:flex-end;}
.fin-sel.sm{height:38px;font-size:12.5px;padding:0 26px 0 9px;}
.fin-insight{display:flex;align-items:flex-start;gap:10px;background:linear-gradient(135deg,rgba(94,80,200,.06),rgba(48,131,220,.05));border-color:var(--s27-purple-soft,rgba(94,80,200,.2));}
.fin-insight .fi-ic{font-size:18px;flex:none;line-height:1.3;}
.fin-insight .fi-tx{font-size:13px;line-height:1.55;color:var(--ink-2,var(--ink));}
.fin-insight .fi-tx b{font-family:var(--font-display);font-weight:800;color:var(--ink);}
.fin-insight .dlt{display:inline;margin-top:0;}
.fin-movers{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px;}
.fin-mlbl{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-4);}
.fin-mover{font-size:11.5px;font-weight:800;font-family:var(--font-display);border-radius:var(--r-pill);padding:3px 10px;}
.fin-mover.up{color:#1f6b3f;background:var(--s27-green-soft,rgba(54,179,107,.12));}
.fin-mover.down{color:#c0392b;background:rgba(210,80,63,.1);}
.fin-chiprow{-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent);mask-image:linear-gradient(90deg,#000 92%,transparent);}

/* ---- AI-acties op een project ---- */
.ai-intro{font-size:12.5px;color:var(--ink-3);line-height:1.5;margin-bottom:12px;}
.ai-acts{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;}
.ai-act{display:flex;align-items:center;gap:9px;padding:12px 13px;border:1px solid var(--line);border-radius:var(--r-md,12px);background:var(--paper);cursor:pointer;font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--ink);text-align:left;transition:all .12s;}
.ai-act:hover{border-color:var(--s27-purple,#5e50c8);background:rgba(94,80,200,.04);}
.ai-act.on{border-color:var(--s27-purple,#5e50c8);background:rgba(94,80,200,.08);box-shadow:0 0 0 1px var(--s27-purple,#5e50c8);}
.ai-act .ai-ic{font-size:17px;flex:none;}
.ai-inputwrap{margin-top:12px;}
.ai-input{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px;color:var(--ink);background:var(--paper);resize:vertical;min-height:80px;}
.ai-input:focus{outline:none;border-color:var(--s27-purple,#5e50c8);}
.ai-out{margin-top:6px;}
.ai-result{margin-top:14px;border:1px solid var(--s27-purple-soft,rgba(94,80,200,.25));border-radius:var(--r-md,12px);overflow:hidden;}
.ai-result-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 13px;background:linear-gradient(135deg,rgba(94,80,200,.08),rgba(48,131,220,.06));border-bottom:1px solid var(--line);}
.ai-tag{font-family:var(--font-display);font-weight:800;font-size:11.5px;color:var(--s27-purple,#5e50c8);text-transform:uppercase;letter-spacing:.03em;}
.ai-result .ai-plan{padding:14px;}
@media(max-width:520px){ .ai-acts{grid-template-columns:1fr;} }
.gz-gev{display:inline-block;font-weight:700;text-transform:capitalize;}
.gz-gev.li{color:var(--s27-green-ink,#2c7a4b);}
.gz-gev.no{color:var(--s27-blue,#3083dc);}
.gz-gev.zw{color:var(--s27-orange-ink,#c9781f);}
.gz-gev.op{color:#c0392b;}
.gz-wo-del{flex:none;width:28px;height:28px;border-radius:7px;border:1px solid transparent;background:none;color:var(--ink-4);font-size:13px;cursor:pointer;}
.gz-wo-del:hover{background:rgba(210,80,63,.08);color:#c0392b;}
.gz-ah-opt{border:1px dashed var(--line);border-radius:var(--r-md);padding:12px 14px;}
.gz-ah-opt summary{cursor:pointer;font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--ink-3);}
.gz-ah-opt[open] summary{margin-bottom:4px;}
@media(max-width:600px){ .gz-row2{grid-template-columns:1fr;gap:12px;} }

/* =========================================================================
 * DARK THEME — ENKEL het teamportaal (team.css laadt na styles.css + glass.css,
 * dus deze :root-flip + donkere glass-overrides raken het klantportaal NIET).
 * ========================================================================= */
:root{
  /* tekst */
  --ink:#ECE7F1; --ink-2:#CDC5D6; --ink-3:#A097AD; --ink-4:#776D83;
  /* oppervlakken */
  --paper:#1B1533; --paper-2:#120E22; --paper-3:#271F40; --line:#342B4F;
  /* merk-"ink" (tekst op -soft) lichter voor contrast op donker */
  --s27-blue-ink:#7DB2F2; --s27-purple-ink:#C6A1F2; --s27-green-ink:#5FCE89;
  --s27-orange-ink:#FF9A6B; --s27-yellow-ink:#F2CF5E; --s27-pink-ink:#F2A9D7; --s27-indigo-ink:#A6B5D0;
  /* merk-"soft" iets sterker zodat de tint zichtbaar blijft op donker */
  --s27-blue-soft:rgba(48,131,220,.20); --s27-purple-soft:rgba(148,65,219,.22); --s27-green-soft:rgba(18,172,78,.20);
  --s27-orange-soft:rgba(246,97,49,.20); --s27-yellow-soft:rgba(248,192,40,.20); --s27-pink-soft:rgba(246,151,206,.22); --s27-indigo-soft:rgba(120,140,180,.24);
  /* glass */
  --glass-grad:linear-gradient(155deg,#191334 0%,#140f28 50%,#0f1220 100%);
  --glass-fill:rgba(255,255,255,.05); --glass-fill-strong:rgba(30,24,54,.92);
  --glass-border:rgba(255,255,255,.10); --glass-line:rgba(255,255,255,.08);
  --glass-sh:0 8px 24px rgba(0,0,0,.40); --glass-sh-lg:0 18px 44px rgba(0,0,0,.58);
  /* schaduwen donkerder */
  --sh-sm:0 2px 6px rgba(0,0,0,.32); --sh-md:0 8px 24px rgba(0,0,0,.44); --sh-lg:0 16px 40px rgba(0,0,0,.55);
  --focus:0 0 0 3px rgba(125,178,242,.32);
}
/* donkere glass-panelen — overschrijven de witte rgba's uit glass.css/styles.css */
.sidebar{background:rgba(27,21,49,.86)!important;border-right-color:var(--glass-border)!important;}
.topbar{background:rgba(20,15,38,.74)!important;border-bottom-color:var(--glass-border)!important;}
.modal{background:rgba(26,20,50,.97)!important;border-color:var(--glass-border)!important;}
.modal-head,.modal-tabs{background:rgba(255,255,255,.035)!important;border-bottom-color:var(--glass-line)!important;}
.icon-btn:hover,.top-right .icon-btn:hover,.icon-btn.topnav-on:hover{background:rgba(255,255,255,.09)!important;box-shadow:none!important;}
.eyebrow{background:rgba(255,255,255,.06)!important;border-color:var(--glass-border)!important;}
.notif:hover,.proj-row .pr-ic,.detail-ic,.modal-close:hover{background:rgba(255,255,255,.06)!important;}
.cbar-t{background:rgba(255,255,255,.09);}
/* subtiele scheidingslijnen die rgba(150,120,150) gebruikten → lichter-op-donker */
.cap-bars,.gz-prog-bar,.stk-bar{background:rgba(255,255,255,.08);}
/* invert-fix: elementen die background:var(--ink) als "donker vlak" gebruikten
   (--ink is nu LICHT) → merkkleur / vaste donkere tint i.p.v. omklappen */
.fpill.active,.fchip.active,.st-btn.on{background:var(--s27-purple)!important;color:#fff!important;border-color:var(--s27-purple)!important;}
.toast{background:#2b2347!important;color:#F2EEF6!important;box-shadow:0 14px 36px rgba(0,0,0,.55)!important;}
/* wordmark is donker (#230F23) → wit maken op dark (sidebar + login) */
.sb-wordmark,.login-card .lwordmark{filter:brightness(0) invert(1);opacity:.95;}
.sb-item:hover{background:rgba(255,255,255,.05);}