.etb {
	border: 1px solid #e6e3f5;
	border-radius: 12px;
	background: #fbfaff;
	margin: 18px 0;
	overflow: hidden;
}

.etb-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	background: #7456f1;
	color: #fff;
	flex-wrap: wrap;
}

.etb-title {
	font-weight: 700;
	font-size: 1.05rem;
}

.etb-rate {
	font-size: .9rem;
	opacity: .92;
}

.etb-rate .amount {
	color: #fff;
}

.etb-body {
	display: grid;
	grid-template-columns: minmax(260px, 1fr) minmax(190px, 240px);
	gap: 18px;
	padding: 18px;
}

.etb-fields {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}

.etb-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: .88rem;
	font-weight: 600;
	color: #4a4a68;
	width: 100%;
}

.etb-field input,
.etb-field select {
	padding: 9px 10px;
	border: 1px solid #d9d4f2;
	border-radius: 8px;
	background: #fff;
	font-size: .95rem;
	width: 100%;
}

.etb-cal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.etb-month {
	font-weight: 700;
	color: #35334f;
}

.etb-nav {
	border: 1px solid #d9d4f2;
	background: #fff;
	border-radius: 8px;
	width: 32px;
	height: 32px;
	cursor: pointer;
	font-size: 1.1rem;
	line-height: 1;
	color: #7456f1;
}

.etb-nav:disabled {
	opacity: .35;
	cursor: not-allowed;
}

.etb-weekdays,
.etb-days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
}

.etb-weekdays span {
	text-align: center;
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: #8b88a8;
	padding-bottom: 4px;
}

.etb-day {
	position: relative;
	min-height: 40px;
	border: 1px solid #ece9fb;
	border-radius: 8px;
	background: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: .85rem;
	font-family: inherit;
	color: #35334f;
	cursor: pointer;
	padding: 2px;
}

.etb-day:hover:not(:disabled) {
	border-color: #7456f1;
}

.etb-day .etb-num {
	font-weight: 600;
}

.etb-day .etb-free {
	font-size: .62rem;
	color: #7a7794;
}

.etb-day.ok {
	background: #eef9f1;
	border-color: #cbe9d6;
}

.etb-day.few {
	background: #fff6e8;
	border-color: #f3ddb9;
}

.etb-day.none,
.etb-day.closed {
	background: #fdeeee;
	border-color: #f2d2d2;
	color: #a97878;
	cursor: not-allowed;
}

.etb-day.past,
.etb-day.pad {
	border-color: transparent;
	background: transparent;
	cursor: default;
}

.etb-day.sel {
	background: #7456f1;
	border-color: #7456f1;
	color: #fff;
}

.etb-day.sel .etb-free {
	color: #eee9ff;
}

.etb-day.inrange {
	background: #ddd3fb;
	border-color: #c6b8f8;
}

.etb-legend {
	display: flex;
	gap: 14px;
	margin-top: 10px;
	font-size: .75rem;
	color: #6b6885;
	flex-wrap: wrap;
}

.etb-legend span {
	display: flex;
	align-items: center;
	gap: 5px;
}

.etb-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}

.etb-dot.ok { background: #48a86c; }
.etb-dot.few { background: #e5a33a; }
.etb-dot.none { background: #d86464; }

.etb-foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	border-top: 1px solid #ece9fb;
	background: #fff;
	flex-wrap: wrap;
}

.etb-summary {
	font-size: .86rem;
	color: #5b5878;
}

.etb-total {
	font-size: 1.25rem;
	font-weight: 700;
	color: #35334f;
}

.etb-hint {
	font-size: .8rem;
	color: #7a7794;
	margin-top: 6px;
}

.etb-error {
	background: #fdeeee;
	border: 1px solid #f2d2d2;
	border-radius: 10px;
	padding: 14px 16px;
	margin: 16px 0;
	color: #8f3131;
}

@media (max-width: 720px) {
	.etb-body { grid-template-columns: 1fr; }
	.etb-day { min-height: 36px; font-size: .8rem; }
}

/* --- v1.2: afhentning/aflevering med klokkeslæt, prisoversigt --- */
.etb-body { grid-template-columns: minmax(260px, 1fr) minmax(220px, 280px); }
.etb-pair { width: 100%; display: grid; grid-template-columns: 1fr 96px; gap: 8px; padding: 10px; border: 1px solid #ece9fb; border-radius: 10px; background: #fff; }
.etb-pair-title { grid-column: 1 / -1; font-weight: 700; color: #35334f; font-size: .92rem; }
.etb-pair .etb-field span { font-size: .75rem; font-weight: 600; color: #7a7794; }
.etb-prices { width: 100%; display: flex; flex-direction: column; gap: 4px; padding: 10px; border-radius: 10px; background: #f3f0ff; font-size: .85rem; color: #4a4a68; }
.etb-prices-title { font-weight: 700; color: #35334f; }
.etb-price-row { display: flex; justify-content: space-between; gap: 8px; }
.etb-price-row b { color: #35334f; white-space: nowrap; }
.etb-prices small { color: #7a7794; }
.etb-where { font-size: .8rem; color: #4a4a68; background: #fff; border-left: 3px solid #7456f1; padding: 8px 10px; border-radius: 6px; margin: 0; }
.etb-summary div + div { margin-top: 2px; }
.etb-summary div:last-child { font-weight: 600; color: #35334f; }
/* v1.2.1: produktsidens kolonne er smal – kalender og felter under hinanden */
.etb-body { grid-template-columns: 1fr; }
.etb-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: stretch; }
.etb-fields > .etb-prices, .etb-fields > .etb-hint, .etb-fields > .etb-where, .etb-fields > .etb-field { grid-column: 1 / -1; }
@media (max-width: 520px) { .etb-fields { grid-template-columns: 1fr; } }
/* v1.2.2: alt i én kolonne og felter må krympe */
.etb-body { grid-template-columns: minmax(0, 1fr); }
.etb-fields { grid-template-columns: minmax(0, 1fr); }
.etb-pair { grid-template-columns: minmax(0, 1fr) 96px; }
.etb-field input, .etb-field select { min-width: 0; }