.bk-calendar {
	--bk-free-bg: #e8f5e9;
	--bk-free-color: #1b5e20;
	--bk-booked-bg: #fbd5d3;
	--bk-booked-color: #b42318;
	--bk-today-border: #1976d2;
	--bk-range-bg: #1b5e20;
	--bk-range-color: #ffffff;
	--bk-inrange-bg: #c8e6c9;
	--bk-inrange-color: #1b5e20;
	--bk-btn-bg: #ffffff;
	--bk-btn-color: #2d3a33;
	--bk-btn-border: #cfd6d2;
	--bk-btn-hover-bg: #f1f4f2;
	--bk-radius: 6px;
	display: block;
	box-sizing: border-box;
	/* 100vw tjera roditelja da se raširi, max-width:100% ga ograničava na stvarnu širinu okvira. */
	width: 100vw;
	max-width: 100%;
	min-width: 0;
	align-self: stretch;
	font-family: inherit;
}
.bk-calendar *,
.bk-calendar *::before,
.bk-calendar *::after { box-sizing: border-box; }

/* Navigacija: strelice + mjesec/godina u jednoj liniji */
.bk-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	margin-bottom: 12px;
}
.bk-nav-title {
	flex: 1 1 0;
	min-width: 0;
	text-align: center;
	font-weight: 600;
	font-size: 1.1em;
	line-height: 1.2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.bk-calendar button.bk-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 1px solid var(--bk-btn-border);
	border-radius: var(--bk-radius);
	background: var(--bk-btn-bg);
	color: var(--bk-btn-color);
	box-shadow: none;
	line-height: 1;
	text-transform: none;
	cursor: pointer;
}
.bk-calendar button.bk-btn:hover:not(:disabled),
.bk-calendar button.bk-btn:focus-visible:not(:disabled) {
	background: var(--bk-btn-hover-bg);
	color: var(--bk-btn-color);
}
.bk-calendar button.bk-btn:disabled { opacity: .35; cursor: not-allowed; }
.bk-calendar button.bk-btn svg { display: block; }

.bk-months { display: flex; flex-wrap: wrap; gap: 24px; width: 100%; }
.bk-month { flex: 1 1 280px; min-width: 0; }
.bk-month-title { font-weight: 600; text-align: center; margin-bottom: 8px; }

/* Kolone uvijek jednake širine, bez obzira na sadržaj */
.bk-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 4px;
	width: 100%;
}
.bk-dow { text-align: center; font-size: 12px; color: #777; padding: 4px 0; }
.bk-day {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	min-width: 0; min-height: 44px; padding: 4px 2px; border-radius: var(--bk-radius);
	font-size: 14px; user-select: none;
}
.bk-price { font-size: 10px; line-height: 1.1; opacity: .85; }
.bk-empty { visibility: hidden; }

.free-date { background: var(--bk-free-bg); color: var(--bk-free-color); cursor: pointer; }
.free-date:hover { filter: brightness(.95); }

.booked-date {
	background: var(--bk-booked-bg);
	color: var(--bk-booked-color);
	box-shadow: inset 0 0 0 1px rgba(180, 35, 24, .25);
	cursor: not-allowed;
	pointer-events: none;
}
.booked-date .bk-num { text-decoration: line-through; }
.past-date { background: transparent; color: #c4c4c4; cursor: default; pointer-events: none; }
.today { outline: 2px solid var(--bk-today-border); outline-offset: -2px; }

.bk-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 12px; font-size: 13px; }
.bk-legend-item { display: inline-flex; align-items: center; gap: 6px; }
.bk-note { color: #666; font-size: 12px; }
.bk-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 3px; pointer-events: none; }

/* ---------- Izbor perioda (forma za upit) ---------- */

/* U modu forme zauzeti dani moraju primati klik (samo dan odlaska je biraljiv). */
.bk-calendar.bk-form-mode .booked-date { pointer-events: auto; }
.bk-calendar.bk-form-mode .booked-date.bk-checkout-ok {
	cursor: pointer;
	box-shadow: inset 0 0 0 2px var(--bk-range-bg);
}
.bk-calendar .bk-day.in-range {
	background: var(--bk-inrange-bg);
	color: var(--bk-inrange-color);
	cursor: pointer;
}
.bk-calendar .bk-day.range-start,
.bk-calendar .bk-day.range-end {
	background: var(--bk-range-bg);
	color: var(--bk-range-color);
	box-shadow: none;
	cursor: pointer;
	pointer-events: auto;
}
.bk-calendar .bk-day.range-end .bk-num { text-decoration: none; }
.bk-calendar .bk-swatch.booked-date { pointer-events: none; }

/* ---------- Forma ---------- */

.bk-form-wrap { margin-top: 20px; width: 100%; }
.bk-form { display: grid; gap: 12px; width: 100%; }

.bk-summary {
	padding: 12px 14px;
	border: 1px solid #dfe5e1;
	border-radius: var(--bk-radius);
	background: #f7faf8;
	font-size: 14px;
	line-height: 1.5;
}
.bk-summary .bk-note { margin-top: 4px; }
.bk-hint { margin-top: 6px; color: var(--bk-booked-color); font-weight: 600; }

.bk-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 520px) { .bk-row { grid-template-columns: minmax(0, 1fr); } }

.bk-field { display: flex; flex-direction: column; gap: 4px; font-size: 14px; min-width: 0; }
.bk-label { font-size: 13px; opacity: .8; }
.bk-field input,
.bk-field select,
.bk-field textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #cfd6d2;
	border-radius: var(--bk-radius);
	background: #fff;
	color: #222;
	font: inherit;
	box-shadow: none;
}
.bk-field input:focus,
.bk-field select:focus,
.bk-field textarea:focus { outline: 2px solid var(--bk-range-bg); outline-offset: 0; }

.bk-consent { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.4; }
.bk-consent input { margin-top: 2px; flex: 0 0 auto; }

.bk-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.bk-calendar button.bk-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 46px;
	margin: 0;
	padding: 10px 18px;
	border: 0;
	border-radius: var(--bk-radius);
	background: var(--bk-range-bg);
	color: var(--bk-range-color);
	font: inherit;
	font-weight: 600;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
}
.bk-calendar button.bk-submit:hover:not(:disabled) { filter: brightness(1.12); }
.bk-calendar button.bk-submit:disabled { opacity: .6; cursor: wait; }

.bk-form-msg { font-size: 14px; line-height: 1.4; }
.bk-form-msg:empty { display: none; }
.bk-form-msg.is-error { color: var(--bk-booked-color); font-weight: 600; }
.bk-form-msg.is-success { color: var(--bk-free-color); font-weight: 600; }
.bk-form-msg.is-info { color: #666; }

.bk-turnstile { display: flex; justify-content: flex-start; min-height: 0; }