:root {
	--bp-primary: #1a5f7a;
	--bp-primary-dark: #134a61;
	--bp-accent: #e07b39;
	--bp-bg: #f4f7f9;
	--bp-sidebar: #123d52;
	--bp-text: #1f2937;
	--bp-muted: #6b7280;
}

body {
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	color: var(--bp-text);
	background: var(--bp-bg);
}

.btn-primary {
	background: var(--bp-primary);
	border-color: var(--bp-primary);
}
.btn-primary:hover {
	background: var(--bp-primary-dark);
	border-color: var(--bp-primary-dark);
}

.auth-body {
	min-height: 100vh;
	background: linear-gradient(135deg, #e8f1f5 0%, #fdf6f0 100%);
}
.auth-card { border-radius: 1rem; }
.brand-title {
	font-weight: 700;
	color: var(--bp-primary);
	letter-spacing: -0.02em;
}

.dashboard-body { margin: 0; }
.dashboard-wrapper { display: flex; min-height: 100vh; }
.sidebar {
	width: 260px;
	background: var(--bp-sidebar);
	color: #fff;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
}
.sidebar-brand {
	display: block;
	color: #fff;
	font-weight: 700;
	font-size: 1.15rem;
}
.sidebar-menu { flex: 1; padding: .5rem; }
.sidebar-btn {
	display: flex;
	align-items: center;
	gap: .6rem;
	padding: .65rem .85rem;
	border-radius: .5rem;
	color: rgba(255,255,255,.85);
	text-decoration: none;
	margin-bottom: .25rem;
}
.sidebar-btn:hover, .sidebar-btn.active {
	background: rgba(255,255,255,.12);
	color: #fff;
}
.dashboard-main { flex: 1; min-width: 0; }
.dashboard-topbar {
	background: #fff;
	border-bottom: 1px solid #e5e7eb;
}
.dashboard-content { max-width: 1200px; }
.role-badge { background: #e8f1f5; color: var(--bp-primary); }

.stat-card {
	border: 0;
	border-radius: 1rem;
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.stat-card .value { font-size: 1.75rem; font-weight: 700; color: var(--bp-primary); }

.widget-body { background: #fff; }
.widget-header {
	background: linear-gradient(135deg, var(--bp-primary), #2d7f9b);
	color: #fff;
	padding: 1.5rem;
	border-radius: 0 0 1rem 1rem;
}
.public-nav {
	background: #fff;
	border-bottom: 1px solid #e5e7eb;
}

/* Kalender */
.cal-month { display: grid; gap: 2px; }
.cal-month__head, .cal-month__row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-month__wd { text-align: center; font-size: .75rem; font-weight: 600; color: var(--bp-muted); padding: .35rem; }
.cal-month__cell {
	min-height: 6rem;
	border: 1px solid #e5e7eb;
	border-radius: .5rem;
	padding: .4rem;
	text-decoration: none;
	color: inherit;
	background: #fff;
	display: block;
	transition: border-color .15s, box-shadow .15s;
}
.cal-month__cell:hover { border-color: var(--bp-primary); box-shadow: 0 2px 6px rgba(0,0,0,.06); }
.cal-month__cell--outside { opacity: .45; }
.cal-month__cell--today { box-shadow: inset 0 0 0 2px var(--bp-accent); }
.cal-month__day { font-weight: 600; font-size: .9rem; margin-bottom: .2rem; }
.cal-month__status {
	font-size: .68rem;
	font-weight: 600;
	line-height: 1.2;
	margin-bottom: .25rem;
}
.cal-month__meta { font-size: .65rem; }
.cal-status--free { background: #ecfdf5; border-color: #a7f3d0; }
.cal-status--free .cal-month__status { color: #047857; }
.cal-status--partial { background: #fffbeb; border-color: #fde68a; }
.cal-status--partial .cal-month__status { color: #b45309; }
.cal-status--full { background: #fef2f2; border-color: #fecaca; }
.cal-status--full .cal-month__status { color: #b91c1c; }
.cal-status--blocked { background: #f3f4f6; border-color: #d1d5db; }
.cal-status--blocked .cal-month__status { color: #374151; }
.cal-dot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; margin-top: .15rem; }
.cal-dot--full { background: #dc3545; }
.cal-dot--partial { background: #ffc107; }
.cal-pill {
	display: inline-block;
	font-size: .68rem;
	padding: .15rem .4rem;
	border-radius: .25rem;
	margin: .1rem .1rem 0 0;
	white-space: nowrap;
}
.cal-block--booking { background: #dbeafe; color: #1e40af; }
.cal-block--manual { background: #e5e7eb; color: #374151; }
.cal-block--maintenance { background: #fef3c7; color: #92400e; }
.cal-block--channel { background: #ede9fe; color: #5b21b6; }
.cal-legend { display: flex; flex-wrap: wrap; gap: .75rem; }
.cal-legend__item { display: inline-flex; align-items: center; gap: .35rem; }
.cal-legend__item::before { content: ''; width: .75rem; height: .75rem; border-radius: .2rem; }
.cal-legend__item--free::before { background: #a7f3d0; }
.cal-legend__item--partial::before { background: #fde68a; }
.cal-legend__item--full::before { background: #fecaca; }
.cal-legend__item--booking::before { background: #dbeafe; }
.cal-legend__item--manual::before { background: #e5e7eb; }
.cal-legend__item--maintenance::before { background: #fef3c7; }
.cal-legend__item--channel::before { background: #ede9fe; }
.cal-week__cell { vertical-align: top; min-width: 6.5rem; min-height: 5rem; padding: .5rem !important; }
.cal-week__cell--free { background: #ecfdf5; }
.cal-week__cell--blocked { background: #f9fafb; }
.cal-week__status { font-size: .75rem; font-weight: 600; }
.cal-week__status--free { color: #047857; }
.cal-week__today { background: #fffbeb; }
.table.cal-week th, .table.cal-week td { font-size: .85rem; }
.cal-day-row--free { background: #f0fdf4; }
.cal-day-row--blocked { background: #fafafa; }
.cal-day-badge {
	display: inline-block;
	font-size: .75rem;
	font-weight: 600;
	padding: .2rem .55rem;
	border-radius: 999px;
}
.cal-day-badge--free { background: #d1fae5; color: #065f46; }
.cal-day-badge--blocked { background: #e5e7eb; color: #374151; }

/* Grotere datumpikkers */
.form-control-date-lg,
.widget-body input[type="date"].form-control {
	min-height: 3rem;
	font-size: 1.05rem;
	padding: .65rem .85rem;
}
.form-control-date-lg::-webkit-calendar-picker-indicator,
.widget-body input[type="date"].form-control::-webkit-calendar-picker-indicator {
	width: 1.25rem;
	height: 1.25rem;
	cursor: pointer;
}
.widget-availability-hint {
	font-size: .875rem;
	min-height: 1.25rem;
}
.widget-availability-hint--ok { color: #047857; }
.widget-availability-hint--warn { color: #b45309; }
.widget-availability-hint--error { color: #b91c1c; }

/* Widget: eigen beschikbaarheidskalender (geen externe library) */
.widget-cal-shell {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: .75rem;
	padding: 1rem;
}
.widget-cal-months {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
}
@media (min-width: 576px) {
	.widget-cal-months {
		grid-template-columns: 1fr 1fr;
	}
}
.widget-cal-month-title {
	font-weight: 700;
	font-size: 1.05rem;
	text-align: center;
	margin-bottom: .65rem;
	color: #0f172a;
}
.widget-cal-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
}
.widget-cal-dow {
	text-align: center;
	font-size: .75rem;
	font-weight: 700;
	color: #64748b;
	padding: .25rem 0 .35rem;
}
.widget-cal-pad {
	min-height: 2.75rem;
}
.widget-cal-day {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	border: 2px solid transparent;
	border-radius: .5rem;
	font-size: 1rem;
	font-weight: 600;
	padding: 0;
	cursor: pointer;
	background: #fff;
	transition: transform .1s, box-shadow .1s;
}
.widget-cal-day--free {
	background: #d1fae5;
	color: #065f46;
	border-color: #a7f3d0;
}
.widget-cal-day--free:not(:disabled):hover {
	background: #a7f3d0;
	transform: scale(1.05);
	box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.widget-cal-day--booking {
	background: #bfdbfe;
	color: #1e3a8a;
	border-color: #93c5fd;
	text-decoration: line-through;
	opacity: .9;
	cursor: not-allowed;
}
.widget-cal-day--manual {
	background: #e5e7eb;
	color: #374151;
	border-color: #d1d5db;
	text-decoration: line-through;
	cursor: not-allowed;
}
.widget-cal-day--maintenance {
	background: #fde68a;
	color: #92400e;
	border-color: #fcd34d;
	text-decoration: line-through;
	cursor: not-allowed;
}
.widget-cal-day--channel_sync {
	background: #ddd6fe;
	color: #5b21b6;
	border-color: #c4b5fd;
	text-decoration: line-through;
	cursor: not-allowed;
}
.widget-cal-day--past {
	background: #f1f5f9;
	color: #cbd5e1;
	cursor: not-allowed;
}
.widget-cal-day--today {
	box-shadow: inset 0 0 0 2px var(--bp-accent, #0ea5e9);
}
.widget-cal-day--in-range {
	background: #bae6fd !important;
	color: #0c4a6e !important;
	border-color: #7dd3fc !important;
}
.widget-cal-day--start,
.widget-cal-day--end {
	background: var(--bp-primary, #1a6b84) !important;
	color: #fff !important;
	border-color: var(--bp-primary, #1a6b84) !important;
	box-shadow: 0 2px 8px rgba(26,107,132,.35);
}
.widget-cal-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 1rem;
	padding-top: .75rem;
	border-top: 1px solid #e2e8f0;
}
.widget-date-chip {
	background: #fff;
	border: 2px solid #e2e8f0;
	border-radius: .5rem;
	padding: .75rem;
	transition: border-color .15s, background .15s;
}
.widget-date-chip--active {
	border-color: var(--bp-primary, #1a6b84);
	background: #f0f9ff;
}
.widget-date-chip__label {
	display: block;
	font-size: .75rem;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: .03em;
	font-weight: 600;
}
.widget-date-chip__value {
	font-size: 1.15rem;
	color: #0f172a;
}
.widget-cal-legend {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem 1rem;
	justify-content: center;
	font-size: .85rem;
}
.widget-cal-legend__item {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
}
.widget-cal-legend__item::before {
	content: '';
	width: 1rem;
	height: 1rem;
	border-radius: .25rem;
	flex-shrink: 0;
}
.widget-cal-legend__item--free::before { background: #d1fae5; border: 2px solid #a7f3d0; }
.widget-cal-legend__item--booking::before { background: #bfdbfe; border: 2px solid #93c5fd; }
.widget-cal-legend__item--manual::before { background: #e5e7eb; border: 2px solid #d1d5db; }
.widget-cal-legend__item--maintenance::before { background: #fde68a; border: 2px solid #fcd34d; }
.widget-cal-legend__item--channel::before { background: #ddd6fe; border: 2px solid #c4b5fd; }

@media (max-width: 768px) {
	.dashboard-wrapper { flex-direction: column; }
	.sidebar { width: 100%; }
}

.booking-detail-section-title {
	font-size: .85rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
	color: var(--bs-secondary-color);
	margin-bottom: .75rem;
	padding-bottom: .35rem;
	border-bottom: 1px solid var(--bs-border-color);
}
.booking-detail-item dd {
	font-weight: 500;
}
.booking-detail-log-item {
	padding: .5rem 0;
	border-bottom: 1px solid var(--bs-border-color-translucent);
}
.booking-detail-log-item:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
