/**
 * MÍR Rental — pole termínu na produktu + zobrazení termínu v košíku.
 *
 * Barvy a rozměry jdou z design tokenů webu (--mir-*, kategorie MÍR
 * v Bricks). Každý var() má fallback na stejnou hodnotu, jakou má token
 * dnes — plugin tak přežije i případnou změnu tématu.
 *
 * Breakpointy webu jsou max-width: 1279 / 991 / 767 / 478.
 */

/* --- Blok termínu na detailu produktu ------------------------------- */

.mir-rental-dates {
	margin: 0 0 var(--mir-space-lg, 22px);
	padding: var(--mir-space-md, 16px);
	border: 1px solid var(--mir-border-soft, rgba(233, 233, 237, 0.1));
	border-radius: var(--mir-radius-lg, 12px);
	background: var(--mir-surface, #232532);
}

.mir-rental-dates__title {
	/* legend se chová jako kicker — malý, prostrkaný, tlumený */
	padding: 0 var(--mir-space-2xs, 6px);
	font-size: var(--mir-fs-micro, 11px);
	font-weight: var(--mir-fw-heading, 500);
	letter-spacing: var(--mir-ls-label, 0.1em);
	text-transform: uppercase;
	color: var(--mir-ink-muted, rgba(233, 233, 237, 0.58));
}

.mir-rental-dates__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--mir-space-sm, 12px);
}

.mir-rental-dates__field {
	margin: 0;
}

.mir-rental-dates__field label {
	display: block;
	margin-bottom: var(--mir-space-3xs, 4px);
	font-size: var(--mir-fs-sm, 13.5px);
	color: var(--mir-ink-body, rgba(233, 233, 237, 0.72));
}

.mir-rental-dates__field input[type="date"] {
	width: 100%;
	padding: var(--mir-space-xs, 8px) var(--mir-space-sm, 12px);
	border: 1px solid var(--mir-border-12, rgba(233, 233, 237, 0.12));
	border-radius: var(--mir-radius-md, 8px);
	background: var(--mir-bg, #161826);
	color: var(--mir-text, #e9e9ed);
	font-size: var(--mir-fs-base, 15px);
	line-height: var(--mir-lh-body, 1.55);
	/* Nativní ikona kalendáře ve světlé variantě na tmavém pozadí. */
	color-scheme: dark;
	transition: border-color var(--mir-dur-fast, 0.2s) var(--mir-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.mir-rental-dates__field input[type="date"]:hover {
	border-color: var(--mir-border-14, rgba(233, 233, 237, 0.14));
}

.mir-rental-dates__field input[type="date"]:focus {
	outline: none;
	border-color: var(--mir-accent, #9184d9);
	box-shadow: 0 0 0 3px var(--mir-accent-tint, rgba(145, 132, 217, 0.12));
}

.mir-rental-dates__hint {
	margin: var(--mir-space-xs, 8px) 0 0;
	font-size: var(--mir-fs-sm, 13.5px);
	color: var(--mir-ink-dim, rgba(233, 233, 237, 0.45));
}

/* --- Kalendář dostupnosti (fáze 3) ----------------------------------- */

/* Tlačítko rozbalení — kalendář je standardně sbalený. */
.mir-rental-cal-toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--mir-space-xs, 8px);
	margin-top: var(--mir-space-sm, 12px);
	padding: var(--mir-space-2xs, 6px) var(--mir-space-sm, 12px);
	border: 1px solid var(--mir-border-12, rgba(233, 233, 237, 0.12));
	border-radius: var(--mir-radius-md, 8px);
	background: transparent;
	color: var(--mir-accent-300, #d2cefd);
	font-size: var(--mir-fs-sm, 13.5px);
	cursor: pointer;
	transition: border-color var(--mir-dur-fast, 0.2s) var(--mir-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.mir-rental-cal-toggle:hover {
	border-color: var(--mir-accent, #9184d9);
}

.mir-rental-cal-toggle::after {
	content: "▾";
	font-size: 10px;
	transition: transform var(--mir-dur-fast, 0.2s) var(--mir-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.mir-rental-cal-toggle.is-open::after {
	transform: rotate(180deg);
}

.mir-rental-cal {
	margin-top: var(--mir-space-md, 16px);
	max-width: 100%; /* Nikdy nepřetéct rámeček Termín pronájmu. */
	min-width: 0;
}

.mir-rental-cal[hidden] {
	display: none;
}

/* Grid se nesmí rozpadnout kvůli min-content šířce buněk. */
.mir-rental-cal__months,
.mir-rental-cal__month,
.mir-rental-cal__grid {
	min-width: 0;
}

/* Obrana proti globálním stylům tématu pro <button> (padding z tokenů
   --btn-space nafoukl denní buňky a druhý měsíc přetékal z rámečku).
   !important je tu záměrně — přebíjíme cizí element-selektory tématu. */
.mir-rental-dates button.mir-rental-cal__day {
	width: 100%;
	min-width: 0 !important;
	padding: 8px 0 !important; /* Výška buňkám nevadí — problém byla šířka. */
	line-height: 1.3 !important;
	box-sizing: border-box;
}

.mir-rental-dates .mir-rental-cal__nav > button {
	width: auto;
	min-width: 0 !important;
	padding: 2px 12px !important;
	box-sizing: border-box;
}

/* --- Rychlý součet pod poli termínu ---------------------------------- */

.mir-rental-dates__summary {
	margin: var(--mir-space-sm, 12px) 0 0;
	padding: var(--mir-space-xs, 8px) var(--mir-space-sm, 12px);
	border-left: 3px solid var(--mir-accent, #9184d9);
	background: var(--mir-accent-tint, rgba(145, 132, 217, 0.12));
	color: var(--mir-ink-strong, rgba(233, 233, 237, 0.88));
	font-size: var(--mir-fs-base, 15px);
	font-variant-numeric: tabular-nums;
}

.mir-rental-dates__summary[hidden] {
	display: none;
}

.mir-rental-cal__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--mir-space-sm, 12px);
	margin-bottom: var(--mir-space-xs, 8px);
}

.mir-rental-cal__nav > button {
	padding: 2px var(--mir-space-sm, 12px);
	border: 1px solid var(--mir-border-12, rgba(233, 233, 237, 0.12));
	border-radius: var(--mir-radius-md, 8px);
	background: var(--mir-bg, #161826);
	color: var(--mir-text, #e9e9ed);
	font-size: var(--mir-fs-md, 16.5px);
	line-height: 1.4;
	cursor: pointer;
	transition: border-color var(--mir-dur-fast, 0.2s) var(--mir-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.mir-rental-cal__nav > button:hover:not(:disabled) {
	border-color: var(--mir-accent, #9184d9);
}

.mir-rental-cal__nav > button:disabled {
	opacity: 0.35;
	cursor: default;
}

.mir-rental-cal__legend {
	font-size: var(--mir-fs-micro, 11px);
	color: var(--mir-ink-dim, rgba(233, 233, 237, 0.45));
	letter-spacing: var(--mir-ls-label, 0.1em);
	text-transform: uppercase;
}

.mir-rental-cal__legend i {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin: 0 4px 0 10px;
	border-radius: var(--mir-radius-pill, 999px);
}

.mir-rental-cal__legend .is-free { background: var(--mir-accent-300, #d2cefd); }
.mir-rental-cal__legend .is-part { background: var(--mir-accent-700, #5d5294); }
.mir-rental-cal__legend .is-full { background: var(--mir-neutral-700, #595d6c); }

.mir-rental-cal__months {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--mir-space-md, 16px);
}

.mir-rental-cal__title {
	margin-bottom: var(--mir-space-2xs, 6px);
	font-size: var(--mir-fs-sm, 13.5px);
	font-weight: var(--mir-fw-heading, 500);
	color: var(--mir-ink-body, rgba(233, 233, 237, 0.72));
	text-transform: capitalize;
}

.mir-rental-cal__grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}

.mir-rental-cal__dow {
	padding: 2px 0;
	font-size: var(--mir-fs-micro, 11px);
	text-align: center;
	color: var(--mir-ink-dim, rgba(233, 233, 237, 0.45));
}

.mir-rental-cal__day {
	padding: var(--mir-space-2xs, 6px) 0;
	border: 1px solid transparent;
	border-radius: var(--mir-radius-sm, 4px);
	background: var(--mir-bg, #161826);
	color: var(--mir-text, #e9e9ed);
	font-size: var(--mir-fs-sm, 13.5px);
	text-align: center;
	cursor: pointer;
	transition: border-color var(--mir-dur-fast, 0.2s) var(--mir-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.mir-rental-cal__day:hover:not(:disabled) {
	border-color: var(--mir-accent, #9184d9);
}

/* Částečně obsazený den: tečka pod číslem. */
.mir-rental-cal__day--part {
	background:
		radial-gradient(circle at 50% 85%, var(--mir-accent-700, #5d5294) 2px, transparent 2.5px),
		var(--mir-bg, #161826);
}

.mir-rental-cal__day--full {
	color: var(--mir-ink-faint, rgba(233, 233, 237, 0.4));
	text-decoration: line-through;
	cursor: default;
}

.mir-rental-cal__day--past {
	opacity: 0.3;
	cursor: default;
}

/* Vybraný rozsah. */
.mir-rental-cal__day.is-start,
.mir-rental-cal__day.is-end {
	background: var(--mir-accent, #9184d9);
	color: var(--mir-bg, #161826);
	font-weight: var(--mir-fw-heading, 500);
}

.mir-rental-cal__day.is-between {
	background: var(--mir-accent-tint, rgba(145, 132, 217, 0.12));
	border-color: var(--mir-accent-900, #2b2741);
}

/* --- Woo notices nad formulářem produktu ----------------------------- */

/* Bricks šablona nemá notice oblast — plugin je tiskne nad formulář.
   Chybová/potvrzovací hláška v tmavém kabátě webu. */

.mir-rental-notices ul,
.mir-rental-notices .woocommerce-error,
.mir-rental-notices .woocommerce-message,
.mir-rental-notices .woocommerce-info {
	list-style: none;
	margin: 0 0 var(--mir-space-md, 16px);
	padding: 0;
}

/* Obal hlášky dostává z globálních Woo/theme stylů bílé pozadí
   a červený rám — tady se kompletně vypíná, vzhled nese až vnitřní
   řádek (li) v barvách webu. !important záměrně: přebíjíme cizí
   selektory, které se načítají po nás. */
.mir-rental-notices .woocommerce-error,
.mir-rental-notices .woocommerce-message,
.mir-rental-notices .woocommerce-info {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: inherit !important;
}

.mir-rental-notices .woocommerce-error::before,
.mir-rental-notices .woocommerce-message::before,
.mir-rental-notices .woocommerce-info::before,
.mir-rental-notices .woocommerce-error li::before,
.mir-rental-notices .woocommerce-message::after,
.mir-rental-notices .woocommerce-info::after {
	display: none !important;
	content: none !important;
}

/* Novější Woo markup hlášek (notice banner, bílé výchozí pozadí) —
   stejný tmavý kabát, kdyby ho některá verze začala renderovat. */
.mir-rental-notices .wc-block-components-notice-banner {
	margin: 0 0 var(--mir-space-md, 16px);
	padding: var(--mir-space-sm, 12px) var(--mir-space-md, 16px);
	border: 0 !important;
	border-left: 3px solid var(--mir-accent, #9184d9) !important;
	border-radius: var(--mir-radius-md, 8px);
	background: var(--mir-surface, #232532) !important;
	color: var(--mir-ink-strong, rgba(233, 233, 237, 0.88)) !important;
	box-shadow: none !important;
	font-size: var(--mir-fs-sm, 13.5px);
}

.mir-rental-notices .wc-block-components-notice-banner.is-error {
	border-left-color: var(--error, hsl(351, 95%, 56%)) !important;
}

.mir-rental-notices .wc-block-components-notice-banner > svg {
	display: none;
}

.mir-rental-notices .woocommerce-error li,
.mir-rental-notices .woocommerce-message,
.mir-rental-notices .woocommerce-info {
	padding: var(--mir-space-sm, 12px) var(--mir-space-md, 16px);
	border-radius: var(--mir-radius-md, 8px);
	background: var(--mir-surface, #232532);
	color: var(--mir-ink-strong, rgba(233, 233, 237, 0.88));
	font-size: var(--mir-fs-sm, 13.5px);
	line-height: var(--mir-lh-body, 1.55);
}

.mir-rental-notices .woocommerce-error li {
	border-left: 3px solid var(--error, hsl(351, 95%, 56%));
	margin-bottom: var(--mir-space-xs, 8px);
}

.mir-rental-notices .woocommerce-message,
.mir-rental-notices .woocommerce-info {
	border-left: 3px solid var(--mir-accent, #9184d9);
}

/* Tlačítko „Zobrazit košík" uvnitř potvrzovací hlášky. */
.mir-rental-notices .woocommerce-message .button,
.mir-rental-notices .wc-forward {
	float: right;
	margin-left: var(--mir-space-sm, 12px);
	color: var(--mir-accent-300, #d2cefd);
	text-decoration: underline;
	background: none;
	padding: 0;
}

/* --- Řádek „Termín" u položek košíku a pokladny ---------------------- */

/* Woo renderuje item data jako dl.variation — jen doladění čitelnosti. */
.woocommerce dl.variation dt,
.woocommerce-checkout dl.variation dt {
	color: var(--mir-ink-muted, rgba(233, 233, 237, 0.58));
}

.woocommerce dl.variation dd,
.woocommerce-checkout dl.variation dd {
	color: var(--mir-ink-body, rgba(233, 233, 237, 0.72));
}

/* --- Mobil ----------------------------------------------------------- */

@media (max-width: 767px) {
	/* Jeden měsíc kalendáře — dva vedle sebe by byly nečitelné. */
	.mir-rental-cal__months {
		grid-template-columns: 1fr;
	}

	.mir-rental-cal__month:nth-child(2) {
		display: none;
	}
}

@media (max-width: 478px) {
	/* Od/Do pod sebe — dva date inputy vedle sebe se na úzkém displeji
	   nevejdou bez ořezu nativního UI. */
	.mir-rental-dates__grid {
		grid-template-columns: 1fr;
	}
}
