.lobify-demo,
.lobify-demo * {
	box-sizing: border-box;
}

.lobify-demo {
	position: relative;
	--lobify-border: #e1e4e8;
	--lobify-text: #202124;
	--lobify-muted: #667085;
	--lobify-red: #ec6671;
	--lobify-blue: #5d94b2;
	--lobify-yellow: #f5cf62;
	--lobify-demo-desktop-scale: .7;
	--lobify-folio-overlay: #0b1a2c;
	--lobify-folio-shell: #cfd6db;
	--lobify-folio-header: #2f3d59;
	--lobify-folio-content: #cfd6db;
	--lobify-folio-rufina-connection-background: #f4e7b0;
	--lobify-folio-rufina-connection-text: #263d55;
	--lobify-folio-rufina-connection-border: #d6bd62;
	--lobify-folio-rufina-connection-whatsapp: #4d9934;
	--lobify-folio-rufina-connection-whatsapp-text: #ffffff;
	--lobify-folio-rufina-connection-lobipass: #5d94b2;
	--lobify-folio-rufina-connection-lobipass-text: #ffffff;
	--lobify-folio-info-card: #f1f3f8;
	--lobify-folio-reservation-area: #ffffff;
	--lobify-folio-modify-button: #6d83e1;
	--lobify-folio-special-header: #03719f;
	--lobify-folio-special-area: #ffffff;
	--lobify-folio-special-input: #f4f4f4;
	--lobify-folio-note: #f0f5fb;
	--lobify-folio-close: #d8888e;
	--lobify-folio-account: #6d83e1;
	--lobify-folio-payments: #c8aa4e;
	--lobify-folio-pending: #d68f95;
	--lobify-folio-tab-active: #454c68;
	--lobify-folio-tab-inactive: #95a6c0;
	--lobify-folio-guest-field: #f8f9fc;
	--lobify-folio-transactions-panel: #ffffff;
	--lobify-folio-transactions-field: #f3f4f6;
	--lobify-folio-transactions-quantity: #eef0f4;
	--lobify-folio-transactions-quantity-button: #ffffff;
	--lobify-folio-transactions-switch-inactive: #64c85f;
	--lobify-folio-transactions-discount-value: #f5f5f5;
	--lobify-folio-transactions-discount-target: #ffffff;
	--lobify-folio-transactions-discount-check: #df5a8d;
	--lobify-folio-transactions-authorization: #f3f4f6;
	--lobify-folio-transactions-filters-wrap: #f1f1ef;
	--lobify-folio-transactions-filter-item: #ffffff;
	--lobify-folio-transactions-filter-item-active: #fff8fb;
	--lobify-folio-transactions-remove: #e66b67;
	--lobify-folio-footer: #075a74;
	--lobify-folio-action-checkin: #8bc56b;
	--lobify-folio-action-payment: #cfa43b;
	--lobify-folio-action-send: #4d9934;
	--lobify-folio-action-danger: #c85752;
	--lobify-folio-status-no-deposit: #e3cd71;
	--lobify-folio-status-deposit: #bfe1f6;
	--lobify-folio-status-in-house: #8cc36b;
	--lobify-folio-status-internal: #cec7e8;
	--lobify-folio-status-quote: #fdcae1;
	--lobify-folio-status-checkout: #fcb7ba;
	--lobify-folio-cleaning-dirty: #d29a94;
	--lobify-folio-cleaning-working: #ffc80a;
	--lobify-folio-cleaning-clean: #8f9b73;
	--lobify-folio-cleaning-reviewed: #8aa0bd;
	--lobify-new-reservation-overlay: #1f2c3e;
	--lobify-new-reservation-shell: #e8ebef;
	--lobify-new-reservation-header: #263d55;
	--lobify-new-reservation-control: #ffffff;
	--lobify-new-reservation-stepper: #f5f6f8;
	--lobify-new-reservation-menu-alt: #f2f3f3;
	--lobify-new-reservation-accent: #e65388;
	--lobify-new-reservation-calendar-active: #5559be;
	--lobify-new-reservation-calendar-range: #d9dcf0;
	--lobify-new-reservation-availability: #d9eadf;
	--lobify-new-reservation-guest-area: #d9dde0;
	--lobify-new-reservation-notice: #fff4c9;
	--lobify-new-reservation-footer: #263d55;
	--lobify-new-reservation-button-walkin: #8eb28b;
	--lobify-new-reservation-button-add: #f3d069;
	--lobify-new-reservation-button-internal: #c2a4e0;
	--lobify-new-reservation-button-quote: #e4add1;
	font-family: Arial, Helvetica, sans-serif;
	color: var(--lobify-text);
	width: 100%;
}

.lobify-demo button {
	font: inherit;
}

.lobify-demo__guide-pointer {
	position: absolute;
	z-index: 55;
	pointer-events: none;
	width: max-content;
	height: max-content;
	min-width: 0;
	max-width: none !important;
	overflow: visible !important;
	transform: translateX(-50%);
	filter: drop-shadow(0 6px 10px rgba(17, 24, 39, .18));
}

.lobify-demo__guide-pointer[hidden] {
	display: none !important;
}

.lobify-demo__guide-pointer.is-visible {
	animation: lobify-guide-pointer-bob .95s ease-in-out infinite alternate;
}

.lobify-demo__guide-pointer img {
	display: block;
	height: 25px;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	max-height: none !important;
	flex: 0 0 auto;
	object-fit: contain;
	transform-origin: center center;
}

.lobify-demo__guide-pointer.is-pointing-left {
	animation-name: lobify-guide-pointer-nudge-left;
}

.lobify-demo__guide-pointer.is-pointing-left img {
	transform: rotate(90deg);
}

@keyframes lobify-guide-pointer-bob {
	0% {
		transform: translateX(-50%) translateY(-2px);
	}
	100% {
		transform: translateX(-50%) translateY(4px);
	}
}

@keyframes lobify-guide-pointer-nudge-left {
	0% {
		transform: translateX(-50%) translateX(2px);
	}
	100% {
		transform: translateX(-50%) translateX(-4px);
	}
}

.lobify-demo__layout {
	/*
	 * La demo conserva sus proporciones originales, pero se presenta al 70%.
	 * El ancho compensado evita que queden huecos laterales en Elementor.
	 */
	width: 142.857143%;
	zoom: var(--lobify-demo-desktop-scale);
	display: grid;
	grid-template-columns: minmax(245px, 300px) minmax(980px, 1fr);
	gap: 22px;
	align-items: stretch;
	width: 100%;
}

.lobify-demo__layout--no-guide {
	grid-template-columns: minmax(980px, 1fr);
}

.lobify-demo__guide {
	position: relative;
	min-height: 720px;
	padding: 6px 10px 16px;
	border: 0;
	border-radius: 0;
	background: transparent;
	overflow: visible;
	box-shadow: none;
	transition: width .25s ease, opacity .25s ease;
}

.lobify-demo__guide.is-collapsed {
	min-height: 78px;
	max-height: 78px;
	padding-bottom: 10px;
}

.lobify-demo__guide.is-collapsed .lobify-demo__speech,
.lobify-demo__guide.is-collapsed .lobify-demo__loby,
.lobify-demo__guide.is-collapsed [data-demo-reset] {
	display: none;
}

.lobify-demo__guide-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 190px;
	max-width: 100%;
	min-height: 34px;
	padding: 7px 13px;
	border-radius: 999px;
	background: #18394c;
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .08em;
}

.lobify-demo__speech {
	position: relative;
	z-index: 2;
	margin-top: 0;
	width: 100%;
	padding: 24px 22px 26px;
	border: 2px solid #d9e5ec;
	border-radius: 24px;
	background: rgba(255, 255, 255, .60);
	-webkit-backdrop-filter: blur(10px) saturate(125%);
	backdrop-filter: blur(10px) saturate(125%);
	box-shadow: 0 10px 24px rgba(20, 51, 71, .10);
	line-height: 1.5;
}

.lobify-demo__speech::after {
	content: "";
	position: absolute;
	left: 36px;
	bottom: -14px;
	width: 24px;
	height: 24px;
	background: rgba(255, 255, 255, .58);
	border-right: 2px solid #d9e5ec;
	border-bottom: 2px solid #d9e5ec;
	transform: rotate(45deg);
}

.lobify-demo__speech strong,
.lobify-demo__speech span {
	display: block;
}

.lobify-demo__speech strong {
	font-size: 22px;
	margin-bottom: 8px;
}

.lobify-demo__speech span {
	font-size: 16px;
	color: #4b5964;
}


.lobify-demo__guide-start {
	position: absolute;
	right: 14px;
	bottom: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 78px;
	height: 30px;
	padding: 0 11px;
	border: 0;
	border-radius: 999px;
	background: #9fcd9a;
	color: #21452b;
	font-size: 12px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 5px 11px rgba(56, 105, 63, .16);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.lobify-demo__speech:has(.lobify-demo__guide-start) {
	padding-bottom: 48px;
}

.lobify-demo__guide-start:hover,
.lobify-demo__guide-start:focus-visible {
	background: #a9d6a4;
	box-shadow: 0 8px 16px rgba(56, 105, 63, .22);
	transform: translateY(-1px);
	outline: none;
}

.lobify-demo__loby {
	position: absolute;
	z-index: 1;
	left: 50%;
	bottom: 112px;
	width: 72%;
	max-height: 350px;
	object-fit: contain;
	object-position: bottom center;
	transform: translateX(-50%);
}

.lobify-demo__guide-progress {
	position: absolute;
	z-index: 3;
	left: 18px;
	right: 18px;
	bottom: 48px;
	padding: 10px 12px;
	border: 1px solid #dbe5eb;
	border-radius: 14px;
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 8px 20px rgba(20, 51, 71, .08);
}

.lobify-demo__guide-progress-copy {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 7px;
	color: #4b5964;
	font-size: 11px;
	font-weight: 700;
}

.lobify-demo__guide-progress-copy strong {
	color: #18394c;
	font-size: 12px;
}

.lobify-demo__guide-progress-tools {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.lobify-demo__guide-index-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 27px;
	height: 27px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: #dce9f0;
	color: #29485a;
	font-size: 15px;
	font-weight: 900;
	cursor: pointer;
}

.lobify-demo__guide-index-toggle:hover,
.lobify-demo__guide-index-toggle:focus-visible {
	background: #cfe0e9;
	outline: 2px solid rgba(93, 148, 178, .24);
	outline-offset: 2px;
}

.lobify-demo__guide-progress-track {
	height: 8px;
	overflow: hidden;
	border-radius: 999px;
	background: #e5edf2;
}

.lobify-demo__guide-progress-track span {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background-color: #8cc36b;
	background-image: repeating-linear-gradient(
		135deg,
		rgba(255, 255, 255, .42) 0,
		rgba(255, 255, 255, .42) 8px,
		rgba(255, 255, 255, .08) 8px,
		rgba(255, 255, 255, .08) 16px
	);
	background-size: 24px 24px;
	animation: lobify-guide-progress-flow .8s linear infinite;
	transition: width .3s ease;
}

@keyframes lobify-guide-progress-flow {
	from { background-position: 0 0; }
	to { background-position: 24px 0; }
}

.lobify-demo__folio-card--refreshed {
	transform: translateZ(0);
	backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
}

.lobify-demo__guide-index[hidden] {
	display: none !important;
}

.lobify-demo__guide-index {
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(100% + 9px);
	padding: 10px;
	border: 1px solid #d7e2e8;
	border-radius: 14px;
	background: rgba(255, 255, 255, .97);
	box-shadow: 0 16px 32px rgba(20, 51, 71, .16);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.lobify-demo__guide-index-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 2px 2px 8px;
	color: #203b4b;
}

.lobify-demo__guide-index-header strong {
	font-size: 13px;
	font-weight: 900;
}

.lobify-demo__guide-index-header button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: var(--lobify-folio-close);
	color: #ffffff;
	font-size: 24px;
	font-weight: 900;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 6px 14px rgba(216, 136, 142, .28);
}

.lobify-demo__guide-index-list {
	display: grid;
	gap: 5px;
}

.lobify-demo__guide-index-list button {
	display: grid;
	grid-template-columns: 12px 1fr;
	align-items: center;
	gap: 9px;
	width: 100%;
	min-height: 34px;
	padding: 7px 9px;
	border: 1px solid transparent;
	border-radius: 9px;
	background: #f6f9fb;
	color: #314c5d;
	font-size: 12px;
	font-weight: 800;
	text-align: left;
	cursor: pointer;
}

.lobify-demo__guide-index-list button:hover,
.lobify-demo__guide-index-list button:focus-visible {
	background: #edf5f8;
	border-color: #cfe1e9;
	outline: none;
}

.lobify-demo__guide-index-list button.is-active {
	border-color: #7da9be;
	background: #e8f2f6;
}

/* Tema 8: destacar la experiencia conectada de Rufina con un amarillo suave. */
.lobify-demo__guide-index-list button[data-guide-topic="direct_rufina"] {
	border-color: #e3cd79;
	background: #fff3b8;
}

.lobify-demo__guide-index-list button[data-guide-topic="direct_rufina"]:hover,
.lobify-demo__guide-index-list button[data-guide-topic="direct_rufina"]:focus-visible,
.lobify-demo__guide-index-list button[data-guide-topic="direct_rufina"].is-active {
	border-color: #d3b94d;
	background: #ffed9a;
}

.lobify-demo__guide-topic-dot {
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	box-shadow: 0 0 0 3px rgba(0, 0, 0, .03);
}

.lobify-demo__guide-topic-dot.is-pending {
	background: #e5a5a5;
}

.lobify-demo__guide-topic-dot.is-completed {
	background: #7fbd7a;
}

.lobify-demo__guide-actions {
	position: absolute;
	z-index: 3;
	left: 18px;
	right: 18px;
	bottom: 14px;
	display: flex;
	justify-content: center;
	gap: 10px;
}

.lobify-demo__text-button {
	padding: 0;
	border: 0;
	background: transparent;
	color: #3c6d89;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.lobify-demo__workspace {
	position: relative;
	isolation: isolate;
	min-width: 0;
	border: 1px solid #e6e8eb;
	border-radius: 24px;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 14px 32px rgba(18, 39, 55, .08);
}

.lobify-demo__toolbar {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	min-height: 92px;
	padding: 10px 18px;
	background: #fff;
}

.lobify-demo__toolbar-actions,
.lobify-demo__counters {
	display: flex;
	align-items: center;
	gap: 10px;
}

.lobify-demo__counters {
	justify-content: flex-end;
}

.lobify-demo__menu-button {
	display: none;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 4px;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	cursor: default;
}

.lobify-demo__menu-button span {
	display: block;
	width: 18px;
	height: 2px;
	border-radius: 999px;
	background: #8b96a1;
}

.lobify-demo__mobile-actions {
	display: none;
}

.lobify-demo__button {
	min-height: 38px;
	padding: 8px 16px;
	border: 0;
	border-radius: 999px;
	font-weight: 800;
	font-size: 13px;
	cursor: pointer;
}

.lobify-demo__button--primary {
	background: var(--lobify-blue);
	color: #fff;
}

.lobify-demo__button--secondary {
	background: #d8d8d8;
	color: #252525;
}

.lobify-demo__today-pill {
	padding: 8px 18px;
	border: 1px solid #d7d7d7;
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 3px 8px rgba(0, 0, 0, .12);
	white-space: nowrap;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .02em;
}

.lobify-demo__today-pill strong {
	margin-left: 2px;
	color: #b33c35;
}

.lobify-demo__counter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 56px;
	height: 56px;
	border-radius: 18px;
	box-shadow: 0 8px 14px rgba(0, 0, 0, .14);
	font-size: 22px;
	font-weight: 900;
}

.lobify-demo__counter-icon {
	display: block;
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	object-fit: contain;
	pointer-events: none;
}

.lobify-demo__counter--green { background: #cce39d; }
.lobify-demo__counter--rose { background: #efc1bf; }
.lobify-demo__counter--pink { background: #efbaba; }
.lobify-demo__counter--gold { background: #f5ca5a; }

.lobify-demo__calendar-shell {
	padding: 0 16px 16px;
}

.lobify-demo__calendar-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 52px;
	border: 1px solid var(--lobify-border);
	background: #fff;
}

.lobify-demo__range,
.lobify-demo__views {
	display: flex;
	align-items: center;
}

.lobify-demo__range {
	gap: 8px;
	padding-left: 8px;
	font-size: 14px;
}

.lobify-demo__caret {
	color: #66717a;
}

.lobify-demo__icon-button,
.lobify-demo__views button {
	border: 0;
	background: transparent;
	cursor: pointer;
}

.lobify-demo__icon-button {
	width: 28px;
	height: 34px;
	font-size: 28px;
	line-height: 1;
	color: #6d7880;
}

.lobify-demo__views button {
	min-height: 50px;
	padding: 0 13px;
	font-size: 13px;
	color: #222;
}

.lobify-demo__views button.is-active {
	color: #d34962;
	border-left: 1px solid var(--lobify-border);
	border-right: 1px solid var(--lobify-border);
}

.lobify-demo__grid {
	min-width: 1040px;
	border-left: 1px solid var(--lobify-border);
	border-bottom: 1px solid var(--lobify-border);
}

.lobify-demo__date-row,
.lobify-demo__category-row,
.lobify-demo__room-row {
	display: grid;
	grid-template-columns: 174px repeat(12, minmax(72px, 1fr));
}

.lobify-demo__room-row {
	position: relative;
	grid-template-rows: 68px;
}

.lobify-demo__date-row > *,
.lobify-demo__category-row > *,
.lobify-demo__room-row > * {
	border-top: 1px solid var(--lobify-border);
	border-right: 1px solid var(--lobify-border);
}

.lobify-demo__date-spacer,
.lobify-demo__date-cell {
	min-height: 42px;
}

.lobify-demo__date-cell {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 7px;
	font-size: 12px;
	font-weight: 500;
}

.lobify-demo__date-cell.is-today {
	color: #db3c5b;
}

.lobify-demo__date-cell.is-weekend,
.lobify-demo__rate-cell.is-weekend,
.lobify-demo__room-cell.is-weekend {
	background: #f0f0f0;
}

.lobify-demo__category-label,
.lobify-demo__room-label {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 68px;
	background: #fff;
}

.lobify-demo__category-label {
	gap: 13px;
	padding: 0 10px;
	font-size: 12px;
	font-weight: 800;
	background: #f2f4f6;
}

.lobify-demo__category-label span {
	font-size: 22px;
	color: #5f6c72;
}

.lobify-demo__rate-cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 68px;
	font-size: 12px;
	line-height: 1.6;
}

.lobify-demo__rate-cell strong {
	color: var(--lobify-red);
	font-size: 12px;
}

.lobify-demo__room-label {
	gap: 16px;
	padding: 0 12px;
	font-size: 13px;
}

.lobify-demo__room-cell {
	min-height: 68px;
	background: #fff;
}

.lobify-demo__door-hanger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 28px;
	width: 28px;
	height: 54px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.lobify-demo__door-hanger-icon {
	display: block;
	width: 19.2px;
	height: 49.6px;
	object-fit: contain;
	pointer-events: none;
}

.lobify-demo__cleaning-menu {
	position: absolute;
	z-index: 50;
	left: 2px;
	top: 58px;
	width: 230px;
	padding: 12px 0;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 14px 28px rgba(0,0,0,.20);
}

.lobify-demo__cleaning-menu--up {
	top: auto;
	bottom: 58px;
}

.lobify-demo__cleaning-menu[hidden] {
	display: none;
}

.lobify-demo__cleaning-menu button {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 10px 18px;
	border: 0;
	background: transparent;
	font-size: 17px;
	text-align: left;
	cursor: pointer;
}

.lobify-demo__cleaning-menu button:hover {
	background: #f6f7f8;
}

.lobify-demo__cleaning-menu button span {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--status-color);
}

.lobify-demo__reservation {
	/*
	 * El folio sale por completo del flujo del grid. Así no aparta columnas,
	 * no crea una fila implícita y queda montado sobre la habitación real.
	 */
	position: absolute;
	z-index: 8;
	grid-row: 1;
	top: 50%;
	right: var(--lobify-reservation-right-offset, 5px);
	left: var(--lobify-reservation-left-offset, 5px);
	width: auto;
	min-width: 0;
	min-height: 44px;
	overflow: hidden;
	padding: 5px 9px;
	border: 0;
	border-radius: 4px;
	box-shadow: 0 7px 13px rgba(0,0,0,.23);
	transform: translateY(-50%);
	text-align: left;
	cursor: pointer;
}

.lobify-demo__reservation[hidden] {
	display: none;
}

.lobify-demo__reservation--sin_deposito {
	background: var(--lobify-yellow);
}

.lobify-demo__reservation--en_casa {
	background: #d4edbc;
}

.lobify-demo__reservation--deposito {
	background: #bfe1f6;
}

.lobify-demo__reservation.is-recently-updated {
	z-index: 8;
	animation: lobify-demo-reservation-pulse 1s ease-in-out 5;
}

@keyframes lobify-demo-reservation-pulse {
	0%, 100% {
		box-shadow: 0 7px 13px rgba(0, 0, 0, .23), 0 0 0 0 rgba(44, 132, 181, 0);
	}
	50% {
		box-shadow: 0 7px 13px rgba(0, 0, 0, .23), 0 0 0 5px rgba(44, 132, 181, .55);
	}
}

.lobify-demo__reservation--uso_interno {
	background: #cec7e8;
}

.lobify-demo__reservation--cotizacion_temporal {
	background: #fdcae1;
}

.lobify-demo__reservation--checkout {
	background: #fcb7ba;
}

.lobify-demo__reservation--cancelada {
	background: #fcb7ba;
}


.lobify-demo__crm-marker {
	position: absolute;
	z-index: 7;
	grid-row: 1;
	top: 50%;
	right: var(--lobify-reservation-right-offset, 5px);
	left: var(--lobify-reservation-left-offset, 5px);
	display: flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	min-height: 44px;
	padding: 5px 9px;
	border: 2px solid rgba(205, 86, 86, .70);
	border-radius: 6px;
	background: rgba(252, 183, 186, .28);
	box-shadow: 0 6px 14px rgba(134, 47, 47, .12);
	transform: translateY(-50%);
	color: #8f373b;
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .02em;
	text-align: center;
	text-transform: uppercase;
	pointer-events: none;
}

.lobify-demo__crm-marker[hidden] {
	display: none;
}

.lobify-demo__crm-marker.is-pulsing {
	animation: lobify-demo-crm-pulse 1s ease-in-out 6;
}

@keyframes lobify-demo-crm-pulse {
	0%, 100% {
		box-shadow: 0 6px 14px rgba(134, 47, 47, .12), 0 0 0 0 rgba(205, 86, 86, 0);
	}
	50% {
		box-shadow: 0 6px 14px rgba(134, 47, 47, .18), 0 0 0 5px rgba(205, 86, 86, .34);
	}
}

.lobify-demo__reservation {
	color: #30363b;
}

.lobify-demo__reservation strong,
.lobify-demo__reservation span {
	display: block;
	overflow: hidden;
	font-size: 11px;
	line-height: 1.25;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.lobify-demo__reservation strong {
	text-transform: uppercase;
}

.lobify-demo__reservation .lobify-demo__reservation-total {
	display: flex;
	align-items: center;
	gap: 4px;
}

.lobify-demo__reservation-origin {
	display: block;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	object-fit: contain;
}

.lobify-demo__folio[hidden],
.lobify-demo__folio-actions[hidden] {
	display: none !important;
}

/*
 * El folio vive como una capa centrada dentro del workspace.
 * Se siente parte del sistema, no un lightbox ajeno a la experiencia.
 */
.lobify-demo__folio {
	position: absolute;
	z-index: 40;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 14px;
	pointer-events: none;
}

.lobify-demo__folio-backdrop {
	position: absolute;
	inset: 0;
	background: var(--lobify-folio-overlay);
	opacity: .08;
	pointer-events: auto;
	cursor: pointer;
}

.lobify-demo__folio-card {
	position: relative;
	z-index: 1;
	width: min(560px, calc(100% - 20px));
	max-height: calc(100% - 22px);
	overflow: auto;
	border-radius: 18px;
	background: var(--lobify-folio-shell);
	box-shadow: 0 18px 34px rgba(8, 25, 39, .28);
	pointer-events: auto;
	animation: lobify-demo-folio-in .2s ease-out both;
}

@keyframes lobify-demo-folio-in {
	from {
		opacity: 0;
		transform: translateY(8px) scale(.985);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

/*
 * Folio conectado de Rufina.
 * Este bloque solo se activa para su reserva y permite continuar el recorrido
 * hacia los ejemplos reales de WhatsApp y lobiPass en la página principal.
 */
.lobify-demo__rufina-connections[hidden] {
	display: none !important;
}

.lobify-demo__rufina-connections {
	display: grid;
	gap: 11px;
	padding: 13px 14px 14px;
	border-bottom: 2px solid var(--lobify-folio-rufina-connection-border);
	border-radius: 18px 18px 0 0;
	background: var(--lobify-folio-rufina-connection-background);
	color: var(--lobify-folio-rufina-connection-text);
}

.lobify-demo__folio-card.has-rufina-connections .lobify-demo__folio-header {
	border-radius: 0;
}

.lobify-demo__rufina-connections-copy {
	display: grid;
	gap: 4px;
}

.lobify-demo__rufina-connections-kicker {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	width: fit-content;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .08em;
	line-height: 1.1;
}

.lobify-demo__rufina-connections-kicker svg {
	display: block;
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.lobify-demo__rufina-connections-copy > strong {
	font-size: 15px;
	font-weight: 900;
	line-height: 1.2;
}

.lobify-demo__rufina-connections-copy p {
	margin: 0;
	font-size: 11px;
	font-weight: 650;
	line-height: 1.38;
}

.lobify-demo__rufina-connections-actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 9px;
}

.lobify-demo__rufina-connection-button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 39px;
	padding: 9px 11px;
	border: 0;
	border-radius: 8px;
	box-shadow: 0 5px 11px rgba(31, 53, 73, .13);
	font-size: 11px;
	font-weight: 900;
	line-height: 1.15;
	text-decoration: none !important;
	transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}

.lobify-demo__rufina-connection-button--whatsapp {
	background: var(--lobify-folio-rufina-connection-whatsapp);
	color: var(--lobify-folio-rufina-connection-whatsapp-text) !important;
}

.lobify-demo__rufina-connection-button--lobipass {
	background: var(--lobify-folio-rufina-connection-lobipass);
	color: var(--lobify-folio-rufina-connection-lobipass-text) !important;
}

.lobify-demo__rufina-connection-button svg {
	flex: 0 0 auto;
	display: block;
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.lobify-demo__rufina-connection-button:hover,
.lobify-demo__rufina-connection-button:focus-visible {
	filter: brightness(.96);
	transform: translateY(-1px);
	box-shadow: 0 7px 15px rgba(31, 53, 73, .18);
	outline: 2px solid rgba(255,255,255,.72);
	outline-offset: -4px;
}

@media (max-width: 480px) {
	.lobify-demo__rufina-connections {
		padding: 12px;
	}

	.lobify-demo__rufina-connections-actions {
		grid-template-columns: 1fr;
	}
}

.lobify-demo__folio-header,
.lobify-demo__folio-meta-row,
.lobify-demo__folio-pills,
.lobify-demo__folio-balance,
.lobify-demo__folio-tabs {
	padding-left: 11px;
	padding-right: 11px;
}

.lobify-demo__folio-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding-top: 13px;
	padding-bottom: 11px;
	background: var(--lobify-folio-header);
	border-radius: 18px 18px 0 0;
}

.lobify-demo__folio-header h3 {
	margin: 0;
	color: #ffffff;
	font-size: 21px;
	line-height: 1.1;
	font-weight: 900;
	text-transform: uppercase;
}

.lobify-demo__folio-close {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: var(--lobify-folio-close);
	color: #ffffff;
	font-weight: 900;
	cursor: pointer;
}

.lobify-demo__folio-close span {
	display: block;
	font-size: 36px;
	line-height: 1;
	transform: translateY(-1px);
}

.lobify-demo__folio-close:hover,
.lobify-demo__folio-close:focus-visible {
	filter: brightness(.93);
	outline: 2px solid rgba(255,255,255,.5);
	outline-offset: 2px;
}

.lobify-demo__folio-meta-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	padding-top: 8px;
	padding-bottom: 8px;
	background: var(--lobify-folio-header);
}

.lobify-demo__folio-meta-row p {
	margin: 0;
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
}

.lobify-demo__folio-meta-row span {
	opacity: .92;
	font-weight: 700;
}

.lobify-demo__folio-meta-row strong {
	font-size: 17px;
	font-weight: 900;
}

.lobify-demo__folio-pills {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 11px;
	padding-top: 6px;
	padding-bottom: 10px;
	background: var(--lobify-folio-header);
}

.lobify-demo__folio-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 9px 11px;
	border: 0;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	color: #17202d;
}

.lobify-demo__folio-pill-caret {
	font-size: 14px;
}

.lobify-demo__folio-pill--status.status-sin_deposito { background: var(--lobify-folio-status-no-deposit); }
.lobify-demo__folio-pill--status.status-deposito { background: var(--lobify-folio-status-deposit); }
.lobify-demo__folio-pill--status.status-en_casa { background: var(--lobify-folio-status-in-house); }
.lobify-demo__folio-pill--status.status-uso_interno { background: var(--lobify-folio-status-internal); }
.lobify-demo__folio-pill--status.status-cotizacion_temporal { background: var(--lobify-folio-status-quote); }
.lobify-demo__folio-pill--status.status-checkout { background: var(--lobify-folio-status-checkout); }
.lobify-demo__folio-pill--status.status-cancelada { background: var(--lobify-folio-status-checkout); }

.lobify-demo__folio-pill--cleaning.status-sucia { background: var(--lobify-folio-cleaning-dirty); }
.lobify-demo__folio-pill--cleaning.status-limpiando { background: var(--lobify-folio-cleaning-working); }
.lobify-demo__folio-pill--cleaning.status-limpia { background: var(--lobify-folio-cleaning-clean); }
.lobify-demo__folio-pill--cleaning.status-revisada { background: var(--lobify-folio-cleaning-reviewed); }

.lobify-demo__folio-cleaning-control {
	position: relative;
	min-width: 0;
}

.lobify-demo__folio-cleaning-control > .lobify-demo__folio-pill {
	width: 100%;
}

.lobify-demo__folio-pill--cleaning:disabled {
	cursor: default;
	opacity: 1;
}

.lobify-demo__folio-pill--cleaning.is-enabled {
	cursor: pointer;
}

.lobify-demo__folio-pill--cleaning.is-enabled:hover,
.lobify-demo__folio-pill--cleaning.is-enabled:focus-visible {
	filter: brightness(.96);
	outline: 2px solid rgba(255, 255, 255, .72);
	outline-offset: 2px;
}

.lobify-demo__folio-cleaning-menu[hidden] {
	display: none !important;
}

.lobify-demo__folio-cleaning-menu {
	position: absolute;
	z-index: 12;
	top: calc(100% + 6px);
	right: 0;
	left: 0;
	overflow: hidden;
	border: 1px solid #d7e1e8;
	border-radius: 7px;
	background: #ffffff;
	box-shadow: 0 14px 24px rgba(16, 35, 53, .24);
}

.lobify-demo__folio-cleaning-menu button {
	display: block;
	width: 100%;
	min-height: 44px;
	padding: 10px 14px;
	border: 0;
	color: #17202d;
	font-size: 13px;
	font-weight: 900;
	text-align: left;
	cursor: pointer;
}

.lobify-demo__folio-cleaning-menu button + button {
	border-top: 1px solid rgba(255, 255, 255, .45);
}

.lobify-demo__folio-cleaning-menu button.status-sucia { background: var(--lobify-folio-cleaning-dirty); }
.lobify-demo__folio-cleaning-menu button.status-limpiando { background: var(--lobify-folio-cleaning-working); }
.lobify-demo__folio-cleaning-menu button.status-limpia { background: var(--lobify-folio-cleaning-clean); }
.lobify-demo__folio-cleaning-menu button.status-revisada { background: var(--lobify-folio-cleaning-reviewed); }

.lobify-demo__folio-cleaning-menu button:hover,
.lobify-demo__folio-cleaning-menu button:focus-visible {
	filter: brightness(.94);
	outline: 2px solid #2e5e79;
	outline-offset: -3px;
}

.lobify-demo__folio-balance {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	padding-bottom: 10px;
	background: var(--lobify-folio-header);
}

.lobify-demo__folio-balance-card {
	padding: 6px 8px 8px;
	text-align: center;
	color: #ffffff;
}

.lobify-demo__folio-balance-card span {
	display: block;
	margin-bottom: 4px;
	font-size: 11px;
	font-weight: 800;
}

.lobify-demo__folio-balance-card strong {
	display: block;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: .01em;
}

.lobify-demo__folio-balance-card--account { background: var(--lobify-folio-account); }
.lobify-demo__folio-balance-card--payments { background: var(--lobify-folio-payments); }
.lobify-demo__folio-balance-card--pending { background: var(--lobify-folio-pending); }

.lobify-demo__folio-tabs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	padding-top: 14px;
	padding-bottom: 10px;
	background: var(--lobify-folio-content);
}

.lobify-demo__folio-tab {
	min-height: 51px;
	padding: 10px 11px;
	border: 0;
	border-radius: 999px;
	background: var(--lobify-folio-tab-inactive);
	color: #ffffff;
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
}

.lobify-demo__folio-tab.is-active {
	background: var(--lobify-folio-tab-active);
}

.lobify-demo__folio-body {
	padding: 11px;
	background: var(--lobify-folio-reservation-area);
}

.lobify-demo__folio-panel {
	background: transparent;
}

.lobify-demo__folio-panel[hidden] {
	display: none !important;
}

.lobify-demo__folio-reservation-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 10px;
}

.lobify-demo__folio-info-card {
	min-width: 0;
	min-height: 75px;
	padding: 10px 16px;
	border: 1px solid #d5dbe6;
	border-radius: 10px;
	background: var(--lobify-folio-info-card);
	color: #27304b;
}

.lobify-demo__folio-info-card span {
	display: block;
	margin-bottom: 5px;
	color: #56617d;
	font-size: 12px;
	font-weight: 700;
}

.lobify-demo__folio-info-card strong {
	display: block;
	overflow-wrap: anywhere;
	font-size: 18px;
	line-height: 1.15;
	font-weight: 800;
}

.lobify-demo__folio-info-card em {
	display: block;
	margin: 0;
	font-style: normal;
	font-size: 16px;
	line-height: 1.1;
	font-weight: 800;
	color: #27304b;
}

.lobify-demo__folio-info-card--period {
	min-height: 98px;
}

.lobify-demo__folio-info-card--period strong {
	font-size: 16px;
}

.lobify-demo__folio-info-card--nights {
	min-height: 98px;
}

.lobify-demo__folio-info-card--nights strong {
	font-size: 41px;
	line-height: 1;
}

.lobify-demo__folio-modify-button {
	display: block;
	width: 100%;
	min-height: 50px;
	margin-top: 12px;
	padding: 10px 16px;
	border: 0;
	border-radius: 7px;
	background: var(--lobify-folio-modify-button);
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}


.lobify-demo__folio-guest-member {
	display: grid;
	grid-template-columns: minmax(120px, 150px) 1fr;
	gap: 10px 16px;
	align-items: start;
	margin-bottom: 12px;
}

.lobify-demo__folio-guest-member-id span {
	display: block;
	margin-bottom: 4px;
	color: #27304b;
	font-size: 12px;
	font-weight: 800;
}

.lobify-demo__folio-guest-member-id strong {
	display: block;
	color: #27304b;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.1;
}

.lobify-demo__folio-guest-tier {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 18px;
	padding-top: 4px;
}

.lobify-demo__folio-guest-tier label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #27304b;
	font-size: 12px;
	font-weight: 800;
}

.lobify-demo__folio-guest-tier input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	position: relative;
	width: 23px;
	height: 23px;
	margin: 0;
	border: 2px solid #777b7d;
	border-radius: 50%;
	background: #ffffff;
	box-sizing: border-box;
	pointer-events: none;
}

.lobify-demo__folio-guest-tier input[type="radio"]:checked {
	border-color: #e65b90;
}

.lobify-demo__folio-guest-tier input[type="radio"]:checked::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: #e65b90;
}

.lobify-demo__folio-guest-grid,
.lobify-demo__folio-vehicle-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 14px;
}

.lobify-demo__folio-field {
	min-width: 0;
}

.lobify-demo__folio-field--full {
	grid-column: 1 / -1;
}

.lobify-demo__folio-field label {
	display: block;
	margin: 0 0 6px;
	color: #27304b;
	font-size: 12px;
	font-weight: 800;
}

.lobify-demo__folio-field input {
	display: block;
	width: 100%;
	min-height: 42px;
	padding: 10px 12px;
	border: 1px solid #cfd6e2;
	border-radius: 8px;
	background: var(--lobify-folio-guest-field);
	color: #27304b;
	font: inherit;
	font-size: 12px;
	font-weight: 700;
}

.lobify-demo__folio-field input[readonly] {
	cursor: default;
}

.lobify-demo__folio-save-button {
	display: block;
	width: 100%;
	min-height: 50px;
	margin-top: 14px;
	padding: 10px 16px;
	border: 0;
	border-radius: 8px;
	background: var(--lobify-folio-modify-button);
	color: #ffffff;
	font-size: 16px;
	font-weight: 800;
}

.lobify-demo__folio-guest-section {
	margin-top: 18px;
	background: transparent;
}

.lobify-demo__folio-guest-section h4 {
	width: auto;
	margin: 0 -12px 14px;
}


.lobify-demo__folio-panel[data-folio-panel="transactions"] {
	margin: -11px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-panel[data-folio-panel="account"] h4,
.lobify-demo__folio-account-section h4 {
	width: auto;
	margin-left: -11px;
	margin-right: -11px;
}

.lobify-demo__transactions-section {
	margin: 0 0 14px;
	background: var(--lobify-folio-transactions-panel);
	border: 0;
	border-radius: 0;
	overflow: hidden;
}

.lobify-demo__transactions-section:last-child {
	margin-bottom: 0;
}

.lobify-demo__transactions-section h4,
.lobify-demo__folio-special h4,
.lobify-demo__folio-guest-section h4,
.lobify-demo__folio-panel[data-folio-panel="account"] h4,
.lobify-demo__folio-account-section h4,
.lobify-demo__folio-section-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 0 14px;
	background: var(--lobify-folio-special-header);
	color: #ffffff;
	font-size: 16px;
	line-height: 1.15;
	font-weight: 900;
	text-align: center;
	text-transform: uppercase;
}

.lobify-demo__transactions-body {
	padding: 12px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-guest-section .lobify-demo__folio-section-bar {
	margin-left: -11px;
	margin-right: -11px;
	width: auto;
}

.lobify-demo__folio-panel[data-folio-panel="account"] {
	margin: -11px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-section {
	margin: 0 0 14px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-section:last-child {
	margin-bottom: 0;
}

.lobify-demo__folio-account-summary {
	padding: 12px 12px 10px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 16px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-summary-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	align-items: start;
	font-size: 14px;
	color: #152149;
}

.lobify-demo__folio-account-summary-row strong {
	font-size: 14px;
	font-weight: 600;
}

.lobify-demo__folio-account-table,
.lobify-demo__folio-account-list {
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-row {
	display: grid;
	grid-template-columns: 88px 1fr 122px;
	gap: 10px;
	align-items: center;
	padding: 12px;
	border-bottom: 1px solid rgba(21, 33, 73, 0.10);
	font-size: 13px;
	color: #152149;
}

.lobify-demo__folio-account-row strong {
	text-align: right;
	font-size: 13px;
	font-weight: 500;
}

.lobify-demo__folio-account-list-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px;
	border-bottom: 1px solid rgba(21, 33, 73, 0.10);
	font-size: 13px;
	color: #152149;
}

.lobify-demo__folio-account-list-row strong,
.lobify-demo__folio-account-total strong,
.lobify-demo__folio-account-grand-row strong {
	font-size: 13px;
	font-weight: 700;
	text-align: right;
	color: #152149;
}

.lobify-demo__folio-account-list-row strong.is-negative,
.lobify-demo__folio-account-total strong.is-negative {
	color: #63bd63;
}

.lobify-demo__folio-account-list-row strong.is-payments,
.lobify-demo__folio-account-total strong.is-payments {
	color: #d9ab2f;
}

.lobify-demo__folio-account-empty {
	margin: 0;
	padding: 20px 12px;
	text-align: center;
	font-size: 13px;
	color: #a0a3bb;
	border-bottom: 1px solid rgba(21, 33, 73, 0.10);
}

.lobify-demo__folio-account-empty--compact {
	padding-top: 18px;
	padding-bottom: 18px;
}

.lobify-demo__folio-account-total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 12px;
	font-size: 14px;
	font-weight: 700;
	color: #152149;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-section--grand {
	padding: 14px 12px 4px;
	background: var(--lobify-folio-transactions-panel);
}

.lobify-demo__folio-account-grand-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 0 0 10px;
	font-size: 14px;
	color: #152149;
}

.lobify-demo__folio-account-grand-row:last-child strong {
	font-size: 16px;
	font-weight: 900;
}
.lobify-demo__transactions-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 12px;
}

.lobify-demo__transactions-field {
	min-width: 0;
	min-height: 52px;
	padding: 8px 10px;
	border: 0;
	border-bottom: 1px solid #8f949c;
	border-radius: 5px 5px 0 0;
	background: var(--lobify-folio-transactions-field);
	color: #27304b;
}

.lobify-demo__transactions-field--full {
	grid-column: 1 / -1;
}

.lobify-demo__transactions-field small {
	display: block;
	margin-bottom: 3px;
	font-size: 10px;
	font-weight: 500;
	color: #5b6370;
}

.lobify-demo__transactions-field strong,
.lobify-demo__transactions-field > span {
	display: block;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.25;
	color: #17203a;
}

.lobify-demo__transactions-select {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.lobify-demo__transactions-select b {
	font-size: 14px;
	color: #69717b;
}

.lobify-demo__transactions-quantity {
	display: grid;
	grid-template-columns: 46px 1fr 46px;
	align-items: stretch;
	min-height: 52px;
	border: 1px solid #d2d7df;
	border-radius: 7px;
	overflow: hidden;
	background: var(--lobify-folio-transactions-quantity);
}

.lobify-demo__transactions-quantity button,
.lobify-demo__transactions-quantity strong {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	background: transparent;
	color: #52627c;
	font-size: 15px;
}

.lobify-demo__transactions-quantity button {
	background: var(--lobify-folio-transactions-quantity-button);
}

.lobify-demo__transactions-primary {
	display: block;
	width: 100%;
	min-height: 44px;
	margin-top: 12px;
	padding: 10px 14px;
	border: 0;
	border-radius: 7px;
	background: var(--lobify-folio-modify-button);
	color: #ffffff;
	font-size: 13px;
	font-weight: 800;
	text-align: center;
}

.lobify-demo__transactions-switch {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-bottom: 12px;
}

.lobify-demo__transactions-switch button {
	min-height: 42px;
	border: 0;
	border-radius: 7px;
	background: var(--lobify-folio-transactions-switch-inactive);
	color: #ffffff;
	font-family: inherit;
	font-size: 13px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
}

.lobify-demo__transactions-switch button.is-active {
	background: var(--lobify-folio-modify-button);
}

/* Tipografía unificada de botones internos de Transacciones. */
.lobify-demo .lobify-demo__transactions-primary,
.lobify-demo .lobify-demo__transactions-switch button {
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.2 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.lobify-demo__transactions-pending {
	margin: 6px 0 0;
	color: #d33d42;
	font-size: 10px;
	font-weight: 700;
}



.lobify-demo__transactions-section--discount,
.lobify-demo__transactions-section--movements {
	border-radius: 0;
}

.lobify-demo__transactions-body--discount,
.lobify-demo__transactions-body--movements {
	padding: 18px 14px 20px;
}

.lobify-demo__transactions-discount-options {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 150px;
	gap: 14px;
	align-items: center;
}

.lobify-demo__transactions-discount-option {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	min-width: 0;
	padding: 8px 4px;
	color: #17203a;
}

.lobify-demo__transactions-discount-option strong {
	font-size: 16px;
	line-height: 1.25;
	font-weight: 500;
}

.lobify-demo__transactions-radio {
	position: relative;
	flex: 0 0 auto;
	width: 23px;
	height: 23px;
	margin-top: 2px;
	border: 2px solid #777b7d;
	border-radius: 50%;
	background: #ffffff;
}

.lobify-demo__transactions-discount-option.is-active .lobify-demo__transactions-radio {
	border-color: #e65b90;
}

.lobify-demo__transactions-discount-option.is-active .lobify-demo__transactions-radio::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: #e65b90;
}

.lobify-demo__transactions-discount-value {
	display: grid;
	grid-template-columns: 1fr 24px 30px;
	align-items: center;
	min-height: 52px;
	padding: 0 12px;
	border-radius: 7px;
	background: var(--lobify-folio-transactions-discount-value);
	color: #27304b;
	font-size: 16px;
}

.lobify-demo__transactions-number-arrows {
	color: #a8adb6;
	font-size: 8px;
	line-height: .85;
	text-align: center;
}

.lobify-demo__transactions-discount-value b,
.lobify-demo__transactions-discount-target b,
.lobify-demo__transactions-authorization b {
	color: #59bc67;
	font-size: 24px;
	line-height: 1;
	text-align: center;
}

.lobify-demo__transactions-subtitle {
	margin: 28px 0 14px;
	font-size: 16px;
	font-weight: 900;
	color: #17203a;
}

.lobify-demo__transactions-select-all {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 18px;
	padding: 0 10px;
	color: #17203a;
}

.lobify-demo__transactions-select-all strong {
	font-size: 15px;
	font-weight: 500;
}

.lobify-demo__transactions-checkbox {
	width: 22px;
	height: 22px;
	border: 2px solid #808385;
	border-radius: 2px;
	background: #ffffff;
}

.lobify-demo__transactions-discount-target {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 28px;
	gap: 10px;
	align-items: center;
	min-height: 70px;
	margin-bottom: 26px;
	padding: 14px 18px;
	border: 1px solid #d7d7d7;
	border-radius: 7px;
	background: var(--lobify-folio-transactions-discount-target);
}

.lobify-demo__transactions-discount-target strong {
	font-size: 17px;
	font-weight: 500;
	color: #17203a;
}

.lobify-demo__transactions-discount-target b {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 3px;
	background: var(--lobify-folio-transactions-discount-check);
	color: #ffffff;
	font-size: 16px;
}

.lobify-demo__transactions-authorization {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 28px;
	gap: 10px;
	align-items: center;
	min-height: 58px;
	margin-bottom: 20px;
	padding: 12px 16px;
	border: 3px solid #ccefd3;
	border-radius: 9px;
	background: var(--lobify-folio-transactions-authorization);
	color: #56617d;
}

.lobify-demo__transactions-authorization strong {
	font-size: 14px;
	font-weight: 800;
}

.lobify-demo__transactions-section--discount .lobify-demo__transactions-primary {
	min-height: 56px;
	font-size: 17px;
}

.lobify-demo__transactions-filters {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px 12px;
	margin-bottom: 18px;
	padding: 12px;
	border: 1px solid #d7dade;
	border-radius: 8px;
	background: var(--lobify-folio-transactions-filters-wrap);
}

.lobify-demo__transactions-filters span {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 12px;
	min-height: 58px;
	padding: 10px 14px;
	border: 1px solid #d2d2d2;
	border-radius: 7px;
	background: var(--lobify-folio-transactions-filter-item);
	color: #17203a;
	font-size: 15px;
	text-align: left;
}

.lobify-demo__transactions-filters i {
	position: relative;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	border: 2px solid #777b7d;
	border-radius: 50%;
	background: #ffffff;
}

.lobify-demo__transactions-filters span.is-active {
	border-color: #efc5d6;
	background: var(--lobify-folio-transactions-filter-item-active);
	color: #17203a;
}

.lobify-demo__transactions-filters span.is-active i {
	border-color: #e65b90;
	box-shadow: 0 0 0 9px rgba(230, 91, 144, .13);
}

.lobify-demo__transactions-filters span.is-active i::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: #e65b90;
}

.lobify-demo__transactions-table {
	padding-top: 8px;
	border-top: 1px solid #d9dde4;
}

.lobify-demo__transactions-table-head,
.lobify-demo__transactions-table-row {
	display: grid;
	grid-template-columns: 54px 112px minmax(0, 1fr) 118px;
	gap: 12px;
	align-items: center;
}

.lobify-demo__transactions-table-head {
	padding: 10px 0 12px;
	color: #17203a;
	font-size: 13px;
	text-align: left;
}

.lobify-demo__transactions-table-row {
	min-height: 74px;
	padding: 10px 0;
	border-top: 0;
	color: #17203a;
	font-size: 13px;
}

.lobify-demo__transactions-table-row > span:nth-child(2),
.lobify-demo__transactions-table-row > span:nth-child(3) {
	line-height: 1.35;
}

.lobify-demo__transactions-table-row > strong {
	text-align: left;
	font-size: 14px;
	font-weight: 500;
}

.lobify-demo__transactions-table-row > strong.is-negative {
	color: #2f8d21;
}

.lobify-demo__transactions-table-row > strong.is-cancelled {
	color: #c45a5f;
}

.lobify-demo__transactions-remove {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 6px;
	background: var(--lobify-folio-transactions-remove);
	color: #ffffff;
	font-size: 18px;
	font-weight: 900;
}

.lobify-demo__transactions-total {
	display: grid;
	grid-template-columns: 54px 112px minmax(0, 1fr) 118px;
	gap: 12px;
	align-items: center;
	padding: 8px 0 2px;
	color: #17203a;
	font-size: 13px;
}

.lobify-demo__transactions-total span {
	grid-column: 3;
}

.lobify-demo__transactions-total strong {
	grid-column: 4;
	min-width: 0;
	text-align: left;
	font-weight: 500;
}

.lobify-demo__folio-special {
	background: var(--lobify-folio-special-area);
}

.lobify-demo__folio-special h4 {
	margin: 0;
}

.lobify-demo__folio-special-body {
	padding: 18px 20px 20px;
	background: var(--lobify-folio-special-area);
}

.lobify-demo__folio-special textarea {
	display: block;
	width: 100%;
	min-height: 66px;
	resize: none;
	padding: 13px 14px;
	border: 2px solid #b8b8b8;
	border-radius: 7px;
	background: var(--lobify-folio-special-input);
	color: #56617d;
	font: inherit;
	font-size: 12px;
	font-weight: 700;
}

.lobify-demo__folio-special textarea::placeholder {
	color: #97a0b4;
	opacity: 1;
}

.lobify-demo__folio-card > [data-folio-actions] {
	padding: 11px;
	background: var(--lobify-folio-footer);
	border-radius: 0 0 18px 18px;
}

.lobify-demo__folio-actions--reservation,
.lobify-demo__folio-actions--in-house {
	display: grid;
	gap: 14px;
	grid-template-columns: 1fr 1fr;
}

.lobify-demo__folio-actions--checkout,
.lobify-demo__folio-actions--cancelled {
	display: block;
}

.lobify-demo__action-button {
	min-height: 62px;
	padding: 10px 14px;
	border: 0;
	border-radius: 7px;
	color: #ffffff;
	font-size: 14px;
	font-weight: 900;
	text-transform: uppercase;
	text-align: center;
}

.lobify-demo__action-button:has(.lobify-demo__action-icon) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	white-space: nowrap;
}

.lobify-demo__action-icon {
	display: block;
	flex: 0 0 16px;
	width: 16px !important;
	height: 16px !important;
	max-width: 16px !important;
	max-height: 16px !important;
	object-fit: contain;
}

.lobify-demo__action-button .lobify-demo__action-icon + span {
	display: inline;
	white-space: nowrap;
}

.lobify-demo__action-button--wide {
	grid-column: 1 / -1;
}

.lobify-demo__action-button--light-green { background: var(--lobify-folio-action-checkin); }
.lobify-demo__action-button--gold { background: var(--lobify-folio-action-payment); }
.lobify-demo__action-button--green { background: var(--lobify-folio-action-send); }
.lobify-demo__action-button--red { background: var(--lobify-folio-action-danger); }

.lobify-demo__folio-completed {
	padding: 18px;
	border-radius: 8px;
	background: var(--lobify-folio-status-checkout);
	color: #5a272a;
	font-size: 15px;
	font-weight: 900;
	text-align: center;
	text-transform: uppercase;
}

.lobify-demo__folio-alert[hidden] {
	display: none !important;
}

.lobify-demo__folio-alert {
	position: absolute;
	z-index: 60;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
	background: rgba(30, 42, 58, .48);
	pointer-events: auto;
}

.lobify-demo__folio-alert-card {
	width: min(360px, 100%);
	padding: 24px 22px 20px;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 18px 36px rgba(17, 29, 45, .28);
	text-align: center;
}

.lobify-demo__folio-alert-card strong {
	display: block;
	margin-bottom: 10px;
	color: #b74444;
	font-size: 24px;
	font-weight: 900;
}

.lobify-demo__folio-alert-card p {
	margin: 0 0 18px;
	color: #30363b;
	font-size: 15px;
	line-height: 1.45;
}

.lobify-demo__folio-alert-card button {
	min-width: 130px;
	min-height: 42px;
	padding: 9px 16px;
	border: 0;
	border-radius: 8px;
	background: var(--lobify-folio-action-danger);
	color: #ffffff;
	font-weight: 800;
	cursor: pointer;
}


.lobify-demo__checkout-balance-alert[hidden] {
	display: none !important;
}

.lobify-demo__checkout-balance-alert {
	position: absolute;
	z-index: 65;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 18px;
	background: rgba(30, 42, 58, .46);
	pointer-events: auto;
}

.lobify-demo__checkout-balance-card {
	width: min(500px, 100%);
	max-height: calc(100% - 24px);
	overflow: auto;
	border-radius: 8px;
	background: #ffffff;
	box-shadow: 0 18px 38px rgba(17, 29, 45, .30);
}

.lobify-demo__checkout-balance-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	padding: 28px 28px 24px;
	border-bottom: 1px solid #e5e8ee;
}

.lobify-demo__checkout-balance-header > strong {
	color: #151d35;
	font-size: 25px;
	line-height: 1.45;
	font-weight: 900;
}

.lobify-demo__checkout-balance-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 70px;
	height: 70px;
	padding: 0;
	border: 0;
	border-radius: 10px;
	background: #d7696c;
	color: #ffffff;
	cursor: pointer;
}

.lobify-demo__checkout-balance-close span {
	font-size: 34px;
	line-height: 1;
	font-weight: 700;
}

.lobify-demo__checkout-balance-body {
	min-height: 250px;
	padding: 40px 28px 30px;
}

.lobify-demo__checkout-balance-body p {
	margin: 0;
	color: #17213a;
	font-size: 21px;
	line-height: 1.65;
}

.lobify-demo__checkout-balance-body p strong {
	font-weight: 500;
}

.lobify-demo__checkout-balance-actions {
	display: flex;
	justify-content: flex-end;
	gap: 12px;
	padding: 22px 28px;
	border-top: 1px solid #e5e8ee;
}

.lobify-demo__checkout-balance-actions button {
	min-width: 142px;
	min-height: 60px;
	padding: 12px 20px;
	border: 0;
	border-radius: 10px;
	background: #f4f5f7;
	color: #1c2945;
	font-size: 20px;
	font-weight: 700;
	cursor: pointer;
}

.lobify-demo__checkout-balance-actions button:hover,
.lobify-demo__checkout-balance-close:hover {
	filter: brightness(.96);
}

.lobify-demo__demo [data-demo-reservation],
.lobify-demo__demo [data-cleaning-trigger],
.lobify-demo__demo [data-cleaning-option],
.lobify-demo__demo [data-guide-start],
.lobify-demo__demo [data-demo-reset],
.lobify-demo__demo [data-folio-close],
.lobify-demo__demo [data-folio-alert-close],
.lobify-demo__demo [data-folio-tab],
.lobify-demo__demo [data-folio-cleaning-option],
.lobify-demo__demo [data-folio-cleaning-trigger]:not(:disabled),
.lobify-demo__demo .lobify-demo__action-button:not(:disabled),
.lobify-demo__demo .lobify-demo__folio-save-button:not(:disabled),
.lobify-demo__demo .lobify-demo__folio-modify-button:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__demo .lobify-demo__action-button:disabled,
.lobify-demo__demo .lobify-demo__folio-save-button:disabled,
.lobify-demo__demo .lobify-demo__folio-modify-button:disabled,
.lobify-demo__demo [data-folio-cleaning-trigger]:disabled {
	cursor: default;
}


@media (max-width: 980px) {
	.lobify-demo__transactions-grid,
	.lobify-demo__transactions-switch {
		grid-template-columns: 1fr;
	}

	.lobify-demo__transactions-filters {
		grid-template-columns: 1fr 1fr;
	}

	.lobify-demo__transactions-table-head,
	.lobify-demo__transactions-table-row {
		grid-template-columns: 34px 72px minmax(0, 1fr) 78px;
	}

	.lobify-demo__folio-card {
		width: calc(100% - 10px);
	}
	.lobify-demo__folio-meta-row,
	.lobify-demo__folio-pills,
	.lobify-demo__folio-balance,
	.lobify-demo__folio-reservation-grid,
	.lobify-demo__folio-guest-grid,
	.lobify-demo__folio-vehicle-grid {
		grid-template-columns: 1fr;
	}

	.lobify-demo__folio-guest-member {
		grid-template-columns: 1fr;
	}

	.lobify-demo__folio-guest-tier {
		gap: 10px 14px;
	}

	.lobify-demo__folio-reservation-grid,
	.lobify-demo__folio-details-grid,
	.lobify-demo__folio-actions--reservation,
	.lobify-demo__folio-actions--in-house {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 1280px) {
	.lobify-demo__layout {
		grid-template-columns: 230px minmax(980px, 1fr);
	}
	.lobify-demo__toolbar {
		grid-template-columns: 1fr;
		justify-items: center;
	}
	.lobify-demo__toolbar-actions,
	.lobify-demo__counters {
		justify-content: center;
	}
}

/*
 * Señales de interacción.
 * RUFI destaca el siguiente paso, pero todas las funciones ya programadas
 * permanecen disponibles para explorar libremente.
 */
.lobify-demo button:disabled,
.lobify-demo [role="button"][aria-disabled="true"] {
	opacity: 1;
	cursor: default !important;
}

.lobify-demo button:not(:disabled),
.lobify-demo [role="button"]:not([aria-disabled="true"]),
.lobify-demo [data-demo-reservation],
.lobify-demo [data-cleaning-trigger],
.lobify-demo [data-cleaning-option],
.lobify-demo [data-folio-checkin-action],
.lobify-demo [data-folio-checkout-action]:not(:disabled),
.lobify-demo [data-folio-cleaning-trigger]:not(:disabled),
.lobify-demo [data-folio-cleaning-option],
.lobify-demo [data-demo-reset],
.lobify-demo [data-folio-close],
.lobify-demo [data-folio-alert-close],
.lobify-demo [data-checkout-balance-alert-close],
.lobify-demo [data-folio-tab],
.lobify-demo [data-guide-start],
.lobify-demo .lobify-demo__action-button:not(:disabled),
.lobify-demo .lobify-demo__folio-save-button:not(:disabled),
.lobify-demo .lobify-demo__folio-modify-button:not(:disabled) {
	cursor: pointer !important;
}

.lobify-demo [data-demo-reservation]:hover,
.lobify-demo [data-cleaning-trigger]:hover,
.lobify-demo [data-cleaning-option]:hover,
.lobify-demo [data-folio-checkin-action]:hover,
.lobify-demo [data-folio-checkout-action]:not(:disabled):hover,
.lobify-demo [data-folio-cleaning-trigger]:not(:disabled):hover,
.lobify-demo [data-folio-cleaning-option]:hover,
.lobify-demo [data-demo-reset]:hover,
.lobify-demo [data-folio-close]:hover,
.lobify-demo [data-folio-alert-close]:hover,
.lobify-demo [data-checkout-balance-alert-close]:hover,
.lobify-demo [data-folio-tab]:hover,
.lobify-demo [data-guide-start]:hover,
.lobify-demo .lobify-demo__action-button:not(:disabled):hover,
.lobify-demo .lobify-demo__folio-save-button:not(:disabled):hover,
.lobify-demo .lobify-demo__folio-modify-button:not(:disabled):hover {
	filter: brightness(.97);
}

/* El paso sugerido por LOBI conserva una señal extra, sin bloquear lo demás. */
.lobify-demo__reservation.is-tour-actionable:hover,
.lobify-demo__door-hanger.is-tour-actionable:hover,
.lobify-demo__action-button.is-tour-actionable:hover,
.lobify-demo__folio-pill.is-tour-actionable:hover {
	outline: 2px solid rgba(36, 94, 130, .34);
	outline-offset: 2px;
}

/* Cada mensaje nuevo de LOBI da dos pulsos suaves para llamar la atención. */
.lobify-demo__speech.is-message-pulsing {
	animation: lobify-demo-lobi-message-pulse .78s ease-in-out 2;
	transform-origin: 50% 70%;
}

@keyframes lobify-demo-lobi-message-pulse {
	0%, 100% {
		transform: scale(1);
		box-shadow: 0 10px 24px rgba(20, 51, 71, .10);
	}
	50% {
		transform: scale(1.025);
		box-shadow: 0 15px 34px rgba(24, 57, 76, .24), 0 0 0 5px rgba(93, 148, 178, .13);
	}
}

@media (prefers-reduced-motion: reduce) {
	.lobify-demo__speech.is-message-pulsing {
		animation: none;
	}
}

.lobify-demo__folio-cancelled {
	background: #f4b8bb;
	color: #6d2e32;
}

/* Nueva reserva guiada ---------------------------------------------------- */
.lobify-demo__workspace {
	position: relative;
}

.lobify-demo__new-reservation[hidden] {
	display: none !important;
}

html.lobify-demo-modal-open,
body.lobify-demo-modal-open {
	overflow: hidden !important;
}

.lobify-demo.has-new-reservation-open {
	z-index: 2147483000;
}

.lobify-demo__new-reservation {
	position: absolute;
	inset: 0;
	z-index: 2147483001;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 18px;
	overflow: auto;
}

/*
 * Escritorio: el único desplazamiento vertical pertenece al formulario.
 * La capa que cubre el calendario no debe crear un segundo scrollbar.
 */
@media (min-width: 901px) {
	.lobify-demo:not(.lobify-demo--mode-mobile) .lobify-demo__new-reservation {
		overflow: hidden;
	}

	.lobify-demo:not(.lobify-demo--mode-mobile) .lobify-demo__new-reservation-card {
		max-height: 100%;
		overscroll-behavior: contain;
	}
}

.lobify-demo__new-reservation-backdrop {
	position: absolute;
	inset: 0;
	background: var(--lobify-new-reservation-overlay);
	opacity: .32;
	backdrop-filter: blur(2px);
}

.lobify-demo__new-reservation-card {
	position: relative;
	z-index: 1;
	width: min(940px, 100%);
	max-height: calc(100% - 12px);
	overflow: auto;
	border-radius: 14px;
	background: var(--lobify-new-reservation-shell);
	box-shadow: 0 24px 60px rgba(20, 36, 52, .28);
	color: #17213f;
}

/* Mano de RUFI para la interguía de Nueva Reserva en todos los dispositivos. */
.lobify-demo__new-reservation-step-pointer {
	position: absolute;
	z-index: 2147483647;
	display: block;
	width: max-content;
	height: max-content;
	min-width: 0;
	max-width: none !important;
	overflow: visible !important;
	pointer-events: none;
	transform: translateX(-50%);
	filter: drop-shadow(0 6px 10px rgba(17, 24, 39, .20));
}

.lobify-demo__new-reservation-step-pointer[hidden] {
	display: none !important;
}

.lobify-demo__new-reservation-step-pointer.is-visible {
	animation: lobify-new-reservation-pointer-bob .92s ease-in-out infinite alternate;
}

.lobify-demo__new-reservation-step-pointer img {
	display: block;
	height: 25px;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	max-height: none !important;
	flex: 0 0 auto !important;
	object-fit: contain !important;
}

@keyframes lobify-new-reservation-pointer-bob {
	0% { transform: translateX(-50%) translateY(-2px); }
	100% { transform: translateX(-50%) translateY(4px); }
}

.lobify-demo__new-reservation-header {
	position: sticky;
	top: 0;
	z-index: 10;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	min-height: 82px;
	padding: 12px 26px;
	background: var(--lobify-new-reservation-header);
	color: #fff;
}

.lobify-demo__new-reservation-header h3 {
	grid-column: 2;
	margin: 0;
	color: #ffffff !important;
	font-size: 18px;
	font-weight: 900;
	text-align: center;
}

.lobify-demo__new-reservation-header .lobify-demo__new-reservation-close {
	grid-column: 3;
	justify-self: end;
}

.lobify-demo__new-reservation-body {
	padding: 28px;
}

.lobify-demo__new-reservation-top-grid {
	display: grid;
	grid-template-columns: 1fr 1fr 170px;
	gap: 18px;
	align-items: start;
}

.lobify-demo__new-reservation-control-wrap {
	position: relative;
}

.lobify-demo__new-reservation-control {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 3px 12px;
	align-items: center;
	width: 100%;
	min-height: 68px;
	padding: 10px 16px;
	border: 0;
	border-bottom: 1px solid #8d9297;
	border-radius: 7px 7px 0 0;
	background: var(--lobify-new-reservation-control);
	text-align: left;
	color: #17213f;
}

button.lobify-demo__new-reservation-control:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-reservation-control small,
.lobify-demo__new-reservation-control strong {
	grid-column: 1;
}

.lobify-demo__new-reservation-control small {
	font-size: 13px;
	font-weight: 500;
	color: #666b72;
}

.lobify-demo__new-reservation-control strong {
	font-size: 17px;
	font-weight: 700;
}

.lobify-demo__new-reservation-control > span {
	grid-column: 2;
	grid-row: 1 / span 2;
	font-size: 24px;
	color: #5263c7;
}

.lobify-demo__new-reservation-control > .lobify-demo__new-calendar-icon {
	color: #777777;
}

.lobify-demo__new-calendar-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
}

.lobify-demo__new-calendar-icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.lobify-demo__new-reservation-control.is-readonly {
	cursor: default;
}

.lobify-demo__new-reservation-nights {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 10px;
	padding-top: 14px;
	color: #234f6e;
}

.lobify-demo__new-reservation-nights span {
	font-size: 28px;
	font-weight: 800;
}

.lobify-demo__new-reservation-nights strong {
	font-size: 44px;
	line-height: 1;
}

.lobify-demo__new-date-picker {
	position: absolute;
	left: 0;
	top: calc(100% + 4px);
	z-index: 40;
	width: 360px;
	padding: 16px;
	border-radius: 7px;
	background: var(--lobify-new-reservation-control);
	box-shadow: 0 8px 24px rgba(20, 36, 52, .25);
}

.lobify-demo__new-date-picker-head {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 22px;
	align-items: center;
	margin-bottom: 16px;
}

.lobify-demo__new-date-picker-head strong {
	font-size: 15px;
	letter-spacing: .08em;
}

.lobify-demo__new-date-picker-head span {
	font-size: 26px;
	color: #777;
}

.lobify-demo__new-date-weekdays,
.lobify-demo__new-date-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	row-gap: 5px;
	column-gap: 0;
	text-align: center;
}

.lobify-demo__new-date-weekdays {
	margin-bottom: 8px;
	font-size: 12px;
	color: #7d7f83;
}

.lobify-demo__new-date-grid button,
.lobify-demo__new-date-grid span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font-size: 14px;
}

.lobify-demo__new-date-grid button:not(:disabled) {
	cursor: pointer;
	font-weight: 800;
	color: #263d55;
}

/* Fechas objetivo de la práctica antes de ser seleccionadas. */
.lobify-demo__new-date-grid button[data-date-role]:not(.is-start):not(.is-end) {
	position: relative;
	z-index: 1;
	font-size: 19px;
	font-weight: 900;
	animation: lobify-demo-date-target-pulse 1.45s ease-in-out infinite;
}

.lobify-demo__new-date-grid button[data-date-role]:not(.is-start):not(.is-end)::after {
	position: absolute;
	inset: 5px;
	border: 2px solid rgba(78, 88, 181, .24);
	border-radius: 999px;
	content: '';
	pointer-events: none;
}

@keyframes lobify-demo-date-target-pulse {
	0%, 100% {
		transform: scale(1);
		box-shadow: 0 0 0 0 rgba(78, 88, 181, 0);
	}
	50% {
		transform: scale(1.12);
		box-shadow: 0 0 0 5px rgba(78, 88, 181, .12);
	}
}

@media (prefers-reduced-motion: reduce) {
	.lobify-demo__new-date-grid button[data-date-role]:not(.is-start):not(.is-end) {
		animation: none;
	}
}

.lobify-demo__new-date-grid button:disabled {
	color: #a5a5a5;
}

.lobify-demo__new-date-grid button.is-start,
.lobify-demo__new-date-grid button.is-end {
	border-radius: 0;
	color: #fff;
	font-size: 19px;
	font-weight: 900;
}

.lobify-demo__new-date-grid button.is-range {
	font-size: 17px;
	font-weight: 700;
}

.lobify-demo__new-date-grid button.is-start {
	background:
		radial-gradient(circle at center, var(--lobify-new-reservation-calendar-active) 0 21px, transparent 21.5px),
		linear-gradient(to right, transparent 0 50%, var(--lobify-new-reservation-calendar-range) 50% 100%);
}

.lobify-demo__new-date-grid button.is-end {
	background:
		radial-gradient(circle at center, var(--lobify-new-reservation-calendar-active) 0 21px, transparent 21.5px),
		linear-gradient(to right, var(--lobify-new-reservation-calendar-range) 0 50%, transparent 50% 100%);
}

.lobify-demo__new-date-grid button.is-range {
	border-radius: 0;
	background: var(--lobify-new-reservation-calendar-range);
	color: #17213f;
}

.lobify-demo__new-reservation-guests {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: 22px;
}

.lobify-demo__new-reservation-guests label,
.lobify-demo__new-reservation-room-select > label {
	display: block;
	margin-bottom: 7px;
	font-size: 14px;
	font-weight: 800;
	color: #234f6e;
}

.lobify-demo__new-stepper {
	display: grid;
	grid-template-columns: 72px 1fr 72px;
	min-height: 58px;
	border: 1px solid #d4d8de;
	border-radius: 8px;
	overflow: hidden;
	background: var(--lobify-new-reservation-stepper);
}

.lobify-demo__new-stepper button {
	border: 0;
	background: var(--lobify-new-reservation-stepper);
	font-size: 24px;
	color: #657198;
}

.lobify-demo__new-stepper button:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-stepper strong {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
}

.lobify-demo__new-reservation-room-select {
	position: relative;
	margin-top: 22px;
}

.lobify-demo__new-reservation-room-select > button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-height: 58px;
	padding: 0 16px;
	border: 1px solid #cbd1d9;
	border-radius: 7px;
	background: var(--lobify-new-reservation-control);
	font-size: 18px;
	font-weight: 700;
	color: #62666b;
}

.lobify-demo__new-reservation-room-select > button:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-room-menu {
	position: absolute;
	left: 0;
	right: 0;
	top: calc(100% + 2px);
	z-index: 35;
	padding: 0;
	border-radius: 5px;
	background: var(--lobify-new-reservation-control);
	box-shadow: 0 8px 20px rgba(20, 36, 52, .18);
	overflow: hidden;
}

.lobify-demo__new-room-menu > span,
.lobify-demo__new-room-menu button {
	display: block;
	width: 100%;
	padding: 18px 20px;
	border: 0;
	background: var(--lobify-new-reservation-control);
	text-align: left;
	font-size: 17px;
	color: #21304d;
}

.lobify-demo__new-room-menu > span {
	color: #aaa;
}

.lobify-demo__new-room-menu button:nth-of-type(1),
.lobify-demo__new-room-menu button:nth-of-type(3) {
	background: var(--lobify-new-reservation-menu-alt);
}

.lobify-demo__new-room-menu button:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-availability {
	margin-top: 14px;
}

.lobify-demo__new-availability > h4,
.lobify-demo__new-guest-section > h4 {
	margin: 0;
	padding: 16px 20px;
	background: var(--lobify-new-reservation-availability);
	font-size: 16px;
	font-weight: 900;
	color: #111;
}

.lobify-demo__new-rate-card {
	margin-top: 18px;
	border-radius: 7px;
	background: var(--lobify-new-reservation-control);
	box-shadow: 0 2px 5px rgba(20, 36, 52, .22);
	overflow: hidden;
}

.lobify-demo__new-rate-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 26px 28px;
	background: var(--lobify-new-reservation-availability);
}

.lobify-demo__new-rate-title strong {
	font-size: 22px;
}

.lobify-demo__new-rate-head,
.lobify-demo__new-rate-row {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 44px;
	gap: 12px;
	align-items: center;
	padding: 18px 20px;
	border: 0;
	border-bottom: 1px solid #ddd;
	background: var(--lobify-new-reservation-control);
	text-align: left;
	font-size: 15px;
	color: #111;
}

button.lobify-demo__new-rate-row:not(:disabled) {
	width: 100%;
	cursor: pointer;
}

.lobify-demo__new-rate-row i {
	justify-self: center;
	width: 23px;
	height: 23px;
	border: 2px solid #777;
	border-radius: 50%;
}

.lobify-demo__new-rate-row.is-selected i {
	border-color: var(--lobify-new-reservation-accent);
	box-shadow: inset 0 0 0 5px var(--lobify-new-reservation-control);
	background: var(--lobify-new-reservation-accent);
}

.lobify-demo__new-rate-row.is-disabled {
	color: #777;
}

.lobify-demo__new-rate-row small {
	display: block;
	margin-top: 5px;
}

.lobify-demo__new-room-choice {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px 22px;
}

.lobify-demo__new-room-choice label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 800;
}

.lobify-demo__new-room-choice input {
	appearance: none;
	width: 23px;
	height: 23px;
	border: 2px solid #777;
	border-radius: 3px;
	background: #fff;
}

.lobify-demo__new-room-choice input:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-room-choice input:checked {
	border-color: var(--lobify-new-reservation-accent);
	background: var(--lobify-new-reservation-accent);
}

.lobify-demo__new-room-choice input:checked::after {
	content: '✓';
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 17px;
	font-weight: 900;
}

.lobify-demo__new-guest-section {
	margin-top: 22px;
	padding-bottom: 18px;
	background: var(--lobify-new-reservation-guest-area);
}

.lobify-demo__new-guest-section > h4 {
	background: var(--lobify-folio-special-header, #03719f);
	color: #fff;
	text-align: center;
}

.lobify-demo__new-guest-fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px 24px;
	padding: 24px 28px;
}

.lobify-demo__new-guest-fields label {
	display: grid;
	gap: 8px;
	font-size: 14px;
	font-weight: 800;
}

.lobify-demo__new-guest-fields label.is-full {
	grid-column: 1 / -1;
}

.lobify-demo__new-guest-fields input {
	min-height: 52px;
	padding: 0 14px;
	border: 0;
	border-radius: 7px;
	background: var(--lobify-new-reservation-control);
	font-size: 14px;
	font-weight: 700;
	color: #33416b;
}

.lobify-demo__new-guest-fields input:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-demo-notice {
	display: grid;
	gap: 4px;
	margin: 0 28px;
	padding: 12px 15px;
	border: 1px solid #efd88a;
	border-radius: 7px;
	background: var(--lobify-new-reservation-notice);
	color: #6b571b;
	font-size: 13px;
}

.lobify-demo__new-reservation-footer {
	padding: 22px 28px 28px;
	background: var(--lobify-new-reservation-footer);
	color: #fff;
	text-align: center;
}

.lobify-demo__new-reservation-footer > strong {
	display: block;
	margin-bottom: 18px;
	font-size: 18px;
}

.lobify-demo__new-reservation-footer > div {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 18px;
}

.lobify-demo__new-reservation-footer button {
	min-height: 54px;
	border: 0;
	border-radius: 7px;
	background: var(--lobify-new-reservation-button-walkin);
	font-size: 16px;
	font-weight: 800;
}

.lobify-demo__new-reservation-footer button:nth-child(3) {
	background: var(--lobify-new-reservation-button-internal);
}

.lobify-demo__new-reservation-footer button:nth-child(4) {
	background: var(--lobify-new-reservation-button-quote);
}

.lobify-demo__new-reservation-footer button.is-add {
	background: var(--lobify-new-reservation-button-add);
}

.lobify-demo__new-reservation-footer button.is-add:not(:disabled) {
	cursor: pointer;
}

.lobify-demo__new-reservation button:disabled,
.lobify-demo__new-reservation input:disabled {
	opacity: .55;
	cursor: default;
}

.lobify-demo__new-reservation .is-demo-step {
	position: relative;
	z-index: 2;
	outline: 4px solid rgba(255, 200, 10, .38);
	box-shadow: 0 0 0 8px rgba(255, 200, 10, .12);
	animation: lobify-new-reservation-pulse 1.7s ease-in-out infinite;
}

@keyframes lobify-new-reservation-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.012); }
}

@media (max-width: 1100px) {
	.lobify-demo__new-reservation-top-grid {
		grid-template-columns: 1fr 1fr 130px;
	}
	.lobify-demo__new-rate-head,
	.lobify-demo__new-rate-row {
		grid-template-columns: 1.35fr .9fr .9fr 38px;
	}
}


/* Guía móvil: permanece oculta fuera de la vista móvil. */
.lobify-demo__mobile-guide-ui {
	display: none;
}


.lobify-demo__room-label[data-cleaning-cell] {
	cursor: pointer;
}

/* Mensaje final del recorrido: centrado dentro del módulo, no en todo el navegador. */
.lobify-demo__guide-completion[hidden] {
	display: none !important;
}

.lobify-demo__guide-completion {
	position: absolute;
	inset: 0;
	z-index: 2147482000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	opacity: 0;
	transition: opacity .18s ease;
}

.lobify-demo__guide-completion.is-visible {
	opacity: 1;
}

.lobify-demo__guide-completion-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(235, 244, 248, .48);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.lobify-demo__guide-completion-card {
	position: relative;
	z-index: 1;
	width: min(520px, calc(100% - 24px));
	padding: 30px 28px 26px;
	border: 2px solid rgba(217, 229, 236, .96);
	border-radius: 24px;
	background: rgba(255, 255, 255, .88);
	-webkit-backdrop-filter: blur(14px) saturate(125%);
	backdrop-filter: blur(14px) saturate(125%);
	box-shadow: 0 24px 60px rgba(20, 51, 71, .24);
	text-align: center;
	transform: translateY(10px) scale(.98);
	transition: transform .18s ease;
}

.lobify-demo__guide-completion.is-visible .lobify-demo__guide-completion-card {
	transform: translateY(0) scale(1);
}

.lobify-demo__guide-completion-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	margin-bottom: 14px;
	border-radius: 50%;
	background: #e7f4ec;
	color: #3c8a61;
	font-size: 30px;
	font-weight: 900;
	box-shadow: 0 10px 24px rgba(60, 138, 97, .18);
}

.lobify-demo__guide-completion-card > strong {
	display: block;
	margin-bottom: 10px;
	color: #203b4b;
	font-size: 26px;
	line-height: 1.18;
}

.lobify-demo__guide-completion-card p {
	margin: 0 auto 20px;
	max-width: 430px;
	color: #536674;
	font-size: 16px;
	line-height: 1.55;
}

.lobify-demo__guide-completion-card button {
	min-height: 42px;
	padding: 10px 20px;
	border: 0;
	border-radius: 999px;
	background: #fa6d7c;
	color: #ffffff;
	font-size: 14px;
	font-weight: 900;
	cursor: pointer;
	box-shadow: 0 10px 22px rgba(250, 109, 124, .25);
}

.lobify-demo__guide-completion-card button:hover,
.lobify-demo__guide-completion-card button:focus-visible {
	filter: brightness(.96);
	outline: 3px solid rgba(250, 109, 124, .22);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.lobify-demo__new-reservation-step-pointer.is-visible {
		animation: none;
	}
}