/* NeNBzorg Beschikbaarheidsrooster
   Alle kleuren en maten worden door Elementor overschreven via CSS-variabelen. */

.nbz-rooster{
	--nbz-y: #8E4A28;
	--nbz-m: #EBCBAE;
	--nbz-n: #E6DCCB;
	--nbz-cell-h: 44px;
	--nbz-cell-r: 10px;
	--nbz-side-width: 300px;

	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}

.nbz-rooster.has-side{
	grid-template-columns: minmax(0, 1fr) minmax(0, var(--nbz-side-width));
}

.nbz-main{ min-width: 0; }

.nbz-caption{
	display: block;
	margin-bottom: 12px;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: #8A7C72;
}

/* ---------- tabel ---------- */
.nbz-scroll{ overflow-x: auto; -webkit-overflow-scrolling: touch; }

.nbz-table{
	border-collapse: separate;
	border-spacing: 5px;
	width: 100%;
	min-width: 480px;
	table-layout: fixed;
	margin: 0;
	background: none;
	border: 0;
}

.nbz-table col.nbz-col-label{ width: 96px; }

.nbz-table th,
.nbz-table td{
	border: 0;
	padding: 0;
	background: none;
}

.nbz-table thead th{
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: #8A7C72;
	text-align: center;
	padding-bottom: 2px;
	line-height: 1.4;
}

.nbz-table tbody th.nbz-rowlabel{
	text-align: left;
	font-weight: 600;
	font-size: .92rem;
	color: #2E2621;
	padding-right: 12px;
	white-space: nowrap;
	line-height: 1.4;
}

.nbz-table td{ height: var(--nbz-cell-h); }

.nbz-cell{
	display: block;
	height: var(--nbz-cell-h);
	border-radius: var(--nbz-cell-r);
	background: var(--nbz-n);
	transition: transform .2s ease;
}

.nbz-cell.is-y{ background: var(--nbz-y); }
.nbz-cell.is-m{ background: var(--nbz-m); }
.nbz-cell.is-n{ background: var(--nbz-n); }

/* ---------- legenda ---------- */
.nbz-legend{
	display: grid;
	gap: 9px;
	margin-top: 20px;
	font-size: .9rem;
	color: #5E5148;
}

.nbz-legend-row{
	display: flex;
	align-items: center;
	gap: 10px;
}

.nbz-sw{
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 5px;
	flex: none;
	background: var(--nbz-n);
}

.nbz-sw.is-y{ background: var(--nbz-y); }
.nbz-sw.is-m{ background: var(--nbz-m); }
.nbz-sw.is-n{ background: var(--nbz-n); }

/* ---------- zijpaneel ---------- */
.nbz-side{
	display: grid;
	gap: 18px;
	align-content: start;
	background: #fff;
	border: 1px solid #E6DCCB;
	border-radius: 14px;
	padding: 26px;
}

.nbz-item{ display: grid; gap: 4px; }

.nbz-item-title{
	margin: 0;
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.3;
	color: #8E4A28;
}

.nbz-item-text{
	margin: 0;
	font-size: .9rem;
	line-height: 1.55;
	color: #5E5148;
}

/* ---------- knop ---------- */
.nbz-btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	justify-self: start;
	padding: 12px 22px;
	border: 1.5px solid #8E4A28;
	border-radius: 999px;
	background: transparent;
	color: #8E4A28;
	font-weight: 600;
	font-size: .95rem;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.nbz-btn:hover,
.nbz-btn:focus{
	background: #8E4A28;
	border-color: #8E4A28;
	color: #FFF7F0;
}

.nbz-arrow{
	width: 16px;
	height: 16px;
	flex: none;
	transition: transform .25s ease;
}

.nbz-btn:hover .nbz-arrow{ transform: translateX(3px); }

/* ---------- responsive ---------- */
@media (max-width: 1024px){
	.nbz-rooster.has-side{ grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce){
	.nbz-cell,
	.nbz-btn,
	.nbz-arrow{ transition: none; }
	.nbz-cell:hover{ transform: none; }
}
