/* 1.76.466: AI-assistent voor WhatsApp. Pagina (voorbeeldgesprek) en portaal (gesprekken, kennis).
   Vlak, haarlijnen, radius 0; paars alleen als accent, mono alleen voor data. */
.nsl-ph--wai .nsl-display { font-size: clamp(2.2rem, 3.6vw, 3.5rem); line-height: 1.04; letter-spacing: -.02em; }
.nsl-ph--wai .nsl-lead { max-width: 38ch; }
.nsl-wai-soon { margin-top: 14px; }
.nsl-wai-phone { margin: 0 auto; max-width: 400px; border: 1px solid #26262a; background: #0b0b0c; box-shadow: 0 24px 60px rgba(0, 0, 0, .5); }
.nsl-wai-phone header { display: flex; justify-content: space-between; align-items: baseline; padding: 14px 18px; border-bottom: 1px solid #1d1d1f; }
.nsl-wai-phone header b { color: #fff; font-size: 15px; }
.nsl-wai-phone header span { color: #8a8a8a; font-size: 12px; }
.nsl-wai-phone ol { margin: 0; padding: 16px; list-style: none; display: grid; gap: 10px; }
.nsl-wai-phone li { max-width: 82%; padding: 10px 12px 18px; position: relative; font-size: 14px; line-height: 1.5; color: #e6e6e6; }
.nsl-wai-phone li small { position: absolute; right: 10px; bottom: 4px; font-size: 10.5px; color: #7a7a7a; font-family: 'IBM Plex Mono', ui-monospace, monospace; }
.nsl-wai-phone .is-in { background: #17171a; border: 1px solid #222226; }
.nsl-wai-phone .is-ai { justify-self: end; background: #1a1424; border: 1px solid #2c2140; border-right: 2px solid #7643c8; }
.nsl-wai-phone .is-note { justify-self: center; max-width: none; padding: 4px 10px; font-size: 12px; color: #9a9a9a; border: 1px dashed #2a2a2e; }
.nsl-wai-phone figcaption { padding: 10px 18px; border-top: 1px solid #1d1d1f; color: #6f6f6f; font-size: 12px; }

/* Portaal */
.nsl-wai__state { display: inline-flex; align-items: center; gap: 8px; margin: 6px 0 0; color: #9a9a9a; font-size: 13px; }
.nsl-wai__state i { width: 8px; height: 8px; border-radius: 50%; background: #5a5a5c; }
.nsl-wai__state.is-on i { background: #7643c8; }
.nsl-wai__steps { margin: 0 0 16px; padding: 0; list-style: none; counter-reset: s; border-top: 1px solid #1d1d1f; }
.nsl-wai__steps li { counter-increment: s; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 2px 10px; padding: 12px 0; border-bottom: 1px solid #1d1d1f; }
.nsl-wai__steps li::before { content: counter(s); grid-row: span 2; font: 600 17px 'IBM Plex Mono', ui-monospace, monospace; color: #7643c8; }
.nsl-wai__steps b { color: #fff; }
.nsl-wai__steps span { color: #cfcfcf; font-size: 14px; }
.nsl-wai__kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 18px; border-top: 1px solid #1d1d1f; border-bottom: 1px solid #1d1d1f; }
.nsl-wai__kpis > div { padding: 14px 18px 14px 0; display: grid; gap: 4px; align-content: start; }
.nsl-wai__kpis > div + div { padding-left: 18px; border-left: 1px solid #1d1d1f; }
.nsl-wai__kpis dt { color: #9a9a9a; font-size: 13px; }
.nsl-wai__kpis dd { margin: 0; color: #fff; font-size: 24px; font-weight: 600; }
.nsl-wai__kpis small { color: #7a7a7a; font-size: 12px; }
.nsl-wai__bar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 0 0 14px; }
.nsl-wai__err { color: #ff5c7a; font-size: 13px; }
.nsl-wai__inbox { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); border: 1px solid #1d1d1f; min-height: 420px; }
.nsl-wai__list { margin: 0; padding: 0; list-style: none; border-right: 1px solid #1d1d1f; max-height: 560px; overflow-y: auto; }
.nsl-wai__list li a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 12px 14px; border-bottom: 1px solid #17171a; color: inherit; text-decoration: none; transition: background-color .2s ease; }
.nsl-wai__list li a:hover { background: #111113; }
.nsl-wai__list li.is-on a { background: #141416; box-shadow: inset 2px 0 0 #7643c8; }
.nsl-wai__list b { color: #fff; font-size: 14px; }
.nsl-wai__list em { grid-column: 1; font-style: normal; font-size: 11.5px; color: #9a9a9a; }
.nsl-wai__list em.is-hand { color: #ffb86b; }
.nsl-wai__list span { grid-column: 1; color: #8a8a8a; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nsl-wai__list small { grid-column: 2; grid-row: 1; color: #6f6f6f; font-size: 11px; }
.nsl-wai__thread { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; }
.nsl-wai__thread header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid #1d1d1f; }
.nsl-wai__thread header b { color: #fff; margin-right: 8px; }
.nsl-wai__thread header .nsl-mono { color: #8a8a8a; font-size: 12px; }
.nsl-wai__msgs { margin: 0; padding: 16px; list-style: none; display: grid; gap: 8px; align-content: start; max-height: 460px; overflow-y: auto; }
.nsl-wai__msgs li { max-width: 78%; padding: 8px 12px; background: #17171a; border: 1px solid #222226; }
.nsl-wai__msgs li p { margin: 0; color: #e6e6e6; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.nsl-wai__msgs li small { display: block; margin-top: 4px; color: #7a7a7a; font-size: 11px; }
.nsl-wai__msgs li.is-ai, .nsl-wai__msgs li.is-human { justify-self: end; background: #1a1424; border-color: #2c2140; }
.nsl-wai__msgs li.is-human { border-right: 2px solid #ffb86b; }
.nsl-wai__msgs li.is-ai { border-right: 2px solid #7643c8; }
.nsl-wai__reply { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; padding: 12px 16px; border-top: 1px solid #1d1d1f; }
.nsl-wai__closed { margin: 0; padding: 12px 16px; border-top: 1px solid #1d1d1f; }
.nsl-wai__empty { padding: 14px 0; }
.nsl-wai__site { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; max-width: 640px; }
.nsl-wai__know { display: grid; gap: 14px; margin-top: 18px; max-width: 760px; }
.nsl-wai__f { display: grid; gap: 6px; }
.nsl-wai__f span { color: #fff; font-size: 14px; font-weight: 600; }
.nsl-wai__f small { display: block; color: #8a8a8a; font-weight: 400; font-size: 12.5px; }
@media (max-width: 860px) {
	.nsl-wai__inbox { grid-template-columns: minmax(0, 1fr); }
	.nsl-wai__list { border-right: 0; border-bottom: 1px solid #1d1d1f; max-height: 240px; }
	.nsl-wai__kpis { grid-template-columns: minmax(0, 1fr); }
	.nsl-wai__kpis > div + div { padding-left: 0; border-left: 0; border-top: 1px solid #1d1d1f; }
	.nsl-ph--wai .nsl-ph__grid { grid-template-columns: minmax(0, 1fr); }
}
.nsl-wai .nsl-input { width: 100%; min-height: 42px; padding: 9px 12px; border-radius: 6px; border: 1px solid #2a2a2e; background: #0e0e10; color: #fff; font: 14px/1.5 var(--f-body, 'IBM Plex Sans', sans-serif); resize: vertical; transition: border-color .2s ease; }
.nsl-wai .nsl-input:focus { outline: 0; border-color: #7643c8; }
.nsl-wai .nsl-input::placeholder { color: #6a6a6a; }