/* Tabs, opportunity tables, status words, messages. */
/* ---- tabbladen: 14/800 met 3 px blauwe onderstreping ---- */
.tabs,.subtabs{display:flex;gap:4px;margin:0 0 22px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar,.subtabs::-webkit-scrollbar{display:none}
.tabs button,.subtabs button{flex:none;background:none;border:0;border-bottom:3px solid transparent;color:var(--muted);font-family:inherit;font-weight:800;font-size:14px;padding:14px 12px 11px;margin-bottom:-1px;cursor:pointer;white-space:nowrap;transition:color .12s}
.tabs button:hover,.subtabs button:hover{color:var(--text)}
.tabs button.on,.subtabs button.on{color:var(--text);border-bottom-color:var(--blue)}
table.opps{width:100%;border-collapse:collapse;font-size:14px}
table.opps th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700;padding:0 12px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
table.opps td{padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:middle;color:var(--text)}
table.opps th:first-child,table.opps td:first-child{padding-left:0}table.opps th:last-child,table.opps td:last-child{padding-right:0}
table.opps tr:last-child td{border-bottom:none}table.opps .co{font-weight:700;color:var(--text)}
table.opps td.dt{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
table.opps td.co small{display:block;font-weight:400;color:var(--muted);font-size:12.5px;margin-top:1px}
table.opps td.ar{text-align:right}
/* status = typografie, geen knopjes: stip 6 px + woord 11/700 met letterafstand, ingehouden kleur */
.badge,.lstat,.st{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;line-height:1.4;background:none;padding:0;border-radius:0}
.badge::before,.lstat::before,.st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;opacity:.9}
.badge.no,.lstat.ls-new,.st.exi{color:var(--muted)}
.lstat.ls-acc,.st.new{color:var(--blue-ink)}
.lstat.ls-reg,.st.upd{color:var(--st-reg)}
.st.dev{color:var(--muted)}.st.dev::before{background:none;box-shadow:inset 0 0 0 1.5px currentColor}
.badge.yes,.lstat.ls-won{color:var(--st-won)}
.lstat.ls-lost{color:var(--st-lost)}
.st.conf{color:var(--light);letter-spacing:.16em;font-size:10px}.st.conf::before{display:none}
.oppbar .q{color:var(--muted)}
.opphead{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.opphead b{font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--text)}
.opphead .muted{font-size:13.5px}
.emptyst .lnk{margin-top:16px;display:inline-block}
.ko{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:4px}
.ko td{padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
.ko td:first-child{color:var(--muted);width:34%;padding-right:12px}
.ko tr:last-child td{border-bottom:none}
.modal-card .pipe{display:flex;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}
.modal-card .pipe .kies{min-width:200px;flex:1}
.modal-card .pipe label{margin:0;white-space:nowrap}
.oppbar{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--line)}.oppbar .sp{flex:1}.oppbar b{color:var(--text);font-size:19px;font-weight:800;letter-spacing:-.01em}
.lnk{background:var(--surface);border:1px solid var(--line2);color:var(--text);font-family:inherit;font-weight:700;font-size:13px;padding:8px 14px;border-radius:var(--r-sm);cursor:pointer;text-decoration:none;transition:.15s;white-space:nowrap}
.lnk:hover{border-color:var(--blue);color:var(--blue-ink)}
@media(max-width:640px){
  table.opps,table.opps tbody{display:block}table.opps thead{display:none}
  table.opps tbody tr{display:grid;grid-template-columns:1fr auto;gap:4px 12px;border-bottom:1px solid var(--line);padding:14px 0;align-items:start}
  table.opps tr:first-child{padding-top:0}
  table.opps td{display:block;border:none;padding:0}
  table.opps td.co{grid-column:1;grid-row:1}table.opps td.dt{grid-column:1;grid-row:2;font-size:12.5px}table.opps td.uc{grid-column:1;grid-row:3;color:var(--muted);font-size:13.5px}
  table.opps td.ar{grid-column:2;grid-row:1/4;text-align:right}
  table.opps td.sub{grid-column:1;grid-row:4;font-size:13px}
  table.opps td.od{grid-column:2;grid-row:4;text-align:right}
}
.msg{display:none;border-radius:var(--r-sm);padding:13px 15px;margin-bottom:16px;font-size:14px;font-weight:700}
.msg.ok{display:block;background:color-mix(in srgb,var(--green) 16%,var(--panel));color:var(--green)}
.msg.err{display:block;background:color-mix(in srgb,var(--red) 14%,var(--panel));color:var(--red)}
.msg.info{display:block;background:color-mix(in srgb,var(--blue) 14%,var(--panel));color:var(--blue-ink)}
.hide{display:none}
.opprow{cursor:pointer;transition:background .12s}.opprow:hover{background:var(--surface)}
.sp{flex:1}
.plbar{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.plbar .plsearch{margin-top:0;flex:1;min-width:150px}
.lnk.sm{padding:6px 11px;font-size:12.5px}
.lnk.on{background:color-mix(in srgb,var(--blue) 12%,var(--panel));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--blue) 50%,transparent);border-color:transparent;color:var(--blue-ink)}
.lnk.del{color:var(--red)}
.plsec-h{display:flex;align-items:center;gap:8px}
.plc-meta{flex-wrap:wrap;gap:8px}
