.lobify-lobipass-demo-stage {
	--lp-demo-scale: 1;
	--lp-demo-unscaled-width: 100%;
	--lp-demo-max-width: 470px;
	--lp-demo-mobile-max-width: 410px;
	border: 0 !important;
	box-shadow: none !important;
	margin-inline: auto;
	max-width: 100%;
	outline: 0 !important;
	overflow: visible;
	position: relative;
	width: min(100%, var(--lp-demo-max-width));
}

.lobify-lobipass-demo-stage > .lobify-lobipass-demo {
	margin: 0;
	max-width: none;
	transform: scale(var(--lp-demo-scale));
	transform-origin: left top;
	width: min(var(--lp-demo-unscaled-width), 470px);
}

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

.lobify-lobipass-demo {
	--lp-green: #063b1e;
	--lp-wifi-card-color: #063b1e;
	--lp-wifi-card-border-color: #d8d3a4;
	--lp-green-soft: #eef7f2;
	--lp-gold: #c9a84c;
	--lp-ink: #111827;
	--lp-text: #374151;
	--lp-muted: #6b7280;
	--lp-border: #e5e7eb;
	--lp-canvas: #faf7f2;
	--lp-navigation-surface: #f5f8fa;
	--lp-bottom-nav-inactive-color: #9ca3af;
	--lp-bottom-nav-active-color: #063b1e;
	--lp-white: #fff;
	--lp-radius: 12px;
	--lp-font-scenarios-11: 11px;
	--lp-font-scenarios-12: 12px;
	--lp-font-scenarios-14: 14px;
	--lp-font-header-9: 9px;
	--lp-font-header-10: 10px;
	--lp-font-header-12: 12px;
	--lp-font-header-13: 13px;
	--lp-font-header-15: 15px;
	--lp-font-headings-11: 11px;
	--lp-font-headings-12: 12px;
	--lp-font-headings-17: 17px;
	--lp-font-headings-19: 19px;
	--lp-font-headings-26: 26px;
	--lp-font-body-10: 10px;
	--lp-font-body-11: 11px;
	--lp-font-small-8: 8px;
	--lp-font-small-9: 9px;
	--lp-font-buttons-10: 10px;
	--lp-font-bottom-nav-9: 9px;
	color: var(--lp-text);
	display: flex;
	flex-direction: column;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	margin-inline: auto;
	width: min(100%, 470px);
	border: 0 !important;
	box-shadow: none !important;
	outline: 0 !important;
}

.lobify-lobipass-demo button {
	font: inherit;
}

.lobify-lobipass-demo button:focus-visible {
	outline: 3px solid rgba(37, 99, 235, 0.35);
	outline-offset: 2px;
}

.lp-icon {
	display: inline-block;
	flex: 0 0 auto;
	height: 18px;
	vertical-align: middle;
	width: 18px;
}

.lp-scenario-selector {
	margin: 0 0 14px;
	order: 1;
}

.lp-scenario-controls {
	background: var(--lp-navigation-surface);
	border: 1px solid rgba(18, 56, 79, 0.12);
	border-radius: 16px;
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
	padding: 5px;
}

.lp-scenario-helper {
	color: var(--lp-muted);
	font-size: var(--lp-font-scenarios-11);
	line-height: 1.4;
	margin: 8px 8px 0;
	text-align: center;
}

.lp-scenario-button {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 12px;
	box-shadow: none;
	color: #52616b;
	cursor: pointer;
	display: flex;
	font-size: 14px;
	font-weight: 700;
	gap: 7px;
	justify-content: center;
	line-height: 1.25;
	margin: 0;
	min-height: 48px;
	padding: 9px 12px;
	text-align: center;
	transition: background-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease;
}

.lp-scenario-button:hover,
.lp-scenario-button:focus-visible {
	background: rgba(255, 255, 255, 0.8);
	color: #12384f;
}

.lp-scenario-button.is-active {
	background: var(--lp-white);
	box-shadow: 0 5px 16px rgba(18, 56, 79, 0.12);
	color: #12384f;
	transform: translateY(-1px);
}

.lp-scenario-button__icon {
	align-items: center;
	background: rgba(18, 56, 79, 0.08);
	border-radius: 50%;
	display: inline-flex;
	flex: 0 0 24px;
	height: 24px;
	justify-content: center;
	width: 24px;
}

.lp-scenario-button__icon .lp-icon {
	height: 14px;
	width: 14px;
}

.lp-scenario-button--before .lp-scenario-button__icon {
	background: #e8f3fa;
	color: #477892;
}

.lp-scenario-button--before.is-active .lp-scenario-button__icon {
	background: #d9ecf7;
	color: #356b87;
}

.lp-scenario-button--during .lp-scenario-button__icon {
	background: #e8f6ee;
	color: #23845a;
}

.lp-scenario-button--during.is-active .lp-scenario-button__icon {
	background: #d9efe3;
	color: #19764e;
}

.lp-scenario-button--checkout .lp-scenario-button__icon {
	background: #fff6d8;
	color: #8f701a;
}

.lp-scenario-button--checkout.is-active .lp-scenario-button__icon {
	background: #f9edbd;
	color: #7a5d0d;
}

.lp-scenario-button--after .lp-scenario-button__icon {
	background: #fcebec;
	color: #b24b4b;
}

.lp-scenario-button--after.is-active .lp-scenario-button__icon {
	background: #f7dadd;
	color: #a93636;
}

.lobify-lobipass-demo--controls-bottom .lp-phone-shell {
	order: 1;
}

.lobify-lobipass-demo--controls-bottom .lp-scenario-selector {
	margin-bottom: 0;
	margin-top: 14px;
	order: 2;
}

.lp-phone-shell {
	background: #181818;
	border-radius: 44px;
	box-shadow: 0 24px 55px rgba(17, 24, 39, 0.22);
	isolation: isolate;
	margin: 0 auto;
	order: 2;
	padding: 10px;
	position: relative;
	width: 100%;
}

.lp-phone-shell.has-frame {
	background: transparent;
	border: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
	outline: 0 !important;
	padding: 0;
}

.lp-phone {
	background: var(--lp-canvas);
	border-radius: 35px;
	display: flex;
	flex-direction: column;
	height: 690px;
	overflow: hidden;
	position: relative;
}

.lp-phone-shell.has-frame .lp-phone {
	border-radius: 4.5% / 2.8%;
	bottom: 3%;
	height: auto;
	left: 4.25%;
	position: absolute;
	right: 4.25%;
	top: 2.9%;
	width: auto;
	z-index: 1;
}

.lp-phone-frame {
	border: 0 !important;
	box-shadow: none !important;
	display: block;
	height: auto;
	pointer-events: none;
	position: relative;
	user-select: none;
	width: 100%;
	z-index: 2;
}

.lp-statusbar {
	align-items: center;
	background-color: var(--lp-header-color);
	background-image:
		linear-gradient(rgba(0, 0, 0, var(--lp-header-overlay)), rgba(0, 0, 0, var(--lp-header-overlay))),
		var(--lp-header-image);
	background-position: center top;
	background-size: cover;
	color: #fff;
	display: flex;
	font-size: 10px;
	font-weight: 600;
	justify-content: space-between;
	padding: 7px 19px 2px;
}

.lp-phone-header {
	background-color: var(--lp-header-color);
	background-image:
		linear-gradient(rgba(0, 0, 0, var(--lp-header-overlay)), rgba(0, 0, 0, var(--lp-header-overlay))),
		var(--lp-header-image);
	background-position: center;
	background-size: cover;
	color: #fff;
	flex: 0 0 auto;
	padding: 10px 14px 14px;
}

.lp-phone-header__top {
	align-items: center;
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin-bottom: 10px;
}

.lp-phone-header__top > div:first-child {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lp-phone-header__eyebrow {
	font-size: 9px;
	letter-spacing: 0.08em;
	opacity: 0.72;
	text-transform: uppercase;
}

.lp-phone-header__top strong {
	font-size: 15px;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.lp-access-code {
	align-items: center;
	background: rgba(255, 255, 255, 0.14);
	border-radius: 8px;
	display: flex;
	flex: 0 0 auto;
	font-family: monospace;
	font-size: 10px;
	gap: 5px;
	padding: 6px 8px;
}

.lp-access-code .lp-icon {
	color: var(--lp-gold);
	height: 14px;
	width: 14px;
}

.lp-guest {
	align-items: center;
	background: rgba(255, 255, 255, 0.13);
	border-radius: 10px;
	display: flex;
	gap: 9px;
	padding: 8px 10px;
}

.lp-guest__avatar {
	align-items: center;
	background: var(--lp-gold);
	border-radius: 50%;
	color: var(--lp-green);
	display: flex;
	flex: 0 0 32px;
	font-size: 12px;
	font-weight: 700;
	height: 32px;
	justify-content: center;
}

.lp-guest > span:last-child {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lp-guest strong {
	font-size: 13px;
	font-weight: 600;
}

.lp-guest small {
	font-size: 10px;
	opacity: 0.68;
}

.lp-phone-content {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 10px;
	scrollbar-color: #d1d5db transparent;
	scrollbar-width: thin;
}

.lp-tab-panel,
.lp-home-state {
	margin: 0;
}

.lp-tab-panel[hidden],
.lp-home-state[hidden],
.lp-whatsapp-overlay[hidden],
.lp-toast[hidden],
.lp-wifi-card[hidden],
.lp-transfer-review[hidden] {
	display: none !important;
}

.lp-state-heading {
	align-items: flex-start;
	display: flex;
	gap: 8px;
	justify-content: space-between;
	margin-bottom: 9px;
}

.lp-state-heading h3 {
	color: var(--lp-ink);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.18;
	margin: 0 0 3px;
}

.lp-state-heading p {
	color: var(--lp-muted);
	font-size: 11px;
	line-height: 1.35;
	margin: 0;
}

.lp-badge,
.lp-service-status {
	background: #f3f4f6;
	border-radius: 999px;
	color: #4b5563;
	display: inline-flex;
	flex: 0 0 auto;
	font-size: 9px;
	font-weight: 600;
	line-height: 1.2;
	padding: 5px 7px;
	text-align: center;
}

.lp-badge--info {
	background: #dbeafe;
	color: #1d4ed8;
}

.lp-badge--success,
.lp-service-status.is-open {
	background: #dcfce7;
	color: #15803d;
}

.lp-badge--warning {
	background: #fef3c7;
	color: #b45309;
}

.lp-service-status.is-closed {
	background: #fee2e2;
	color: #b91c1c;
}

.lp-card {
	background: var(--lp-white);
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius);
	margin-bottom: 9px;
}

.lp-section-label {
	color: #9ca3af;
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.08em;
	margin: 10px 2px 6px;
	text-transform: uppercase;
}

.lp-stay-details {
	padding: 10px 12px;
}

.lp-stay-details .lp-section-label {
	margin: 0 0 7px;
}

.lp-stay-details dl {
	display: grid;
	font-size: 11px;
	gap: 5px 7px;
	grid-template-columns: 84px minmax(0, 1fr);
	margin: 0;
}

.lp-stay-details dt {
	color: #9ca3af;
	font-weight: 400;
	margin: 0;
}

.lp-stay-details dd {
	color: var(--lp-text);
	font-weight: 600;
	margin: 0;
}

.lp-notice {
	border: 1px solid;
	border-radius: var(--lp-radius);
	margin-bottom: 9px;
	padding: 10px;
}

.lp-notice--info {
	background: #eff6ff;
	border-color: #bfdbfe;
	color: #1d4ed8;
}

.lp-notice--success {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #15803d;
}

.lp-notice--warning {
	background: #fff7ed;
	border-color: #fcd34d;
	color: #b45309;
}

.lp-notice__heading {
	align-items: flex-start;
	display: flex;
	gap: 7px;
}

.lp-notice__heading .lp-icon {
	height: 17px;
	margin-top: 1px;
	width: 17px;
}

.lp-notice__heading span {
	display: flex;
	flex-direction: column;
}

.lp-notice__heading strong {
	font-size: 11px;
	font-weight: 600;
}

.lp-notice__heading small {
	font-size: 10px;
	line-height: 1.4;
	margin-top: 1px;
}

.lp-notice > p {
	font-size: 10px;
	line-height: 1.45;
	margin: 7px 0;
}

.lp-actions {
	display: grid;
	gap: 6px;
	margin-bottom: 9px;
}

.lp-actions--two {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lp-actions--three {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lp-button,
.lp-quick-card {
	align-items: center;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	display: inline-flex;
	font-size: 10px;
	font-weight: 600;
	gap: 5px;
	justify-content: center;
	line-height: 1.25;
	min-height: 34px;
	padding: 8px;
	text-align: center;
	text-decoration: none;
}

.lp-button .lp-icon {
	height: 15px;
	width: 15px;
}

.lp-button--block {
	width: 100%;
}

.lp-button--primary {
	background: #2563eb;
	color: #fff;
}

.lp-button--dark {
	background: var(--lp-green);
	color: #fff;
}

.lp-button--warning {
	background: #fff;
	border: 1px solid #fcd34d;
	color: #b45309;
}

.lp-button--soft {
	background: #fff;
	border: 1px solid var(--lp-border);
	color: var(--lp-text);
}

.lp-button--whatsapp {
	background: var(--lp-green-soft);
	border: 1px solid #bbe7ce;
	color: #15803d;
}

.lp-quick-card {
	background: var(--lp-white);
	border: 1px solid var(--lp-border);
	color: var(--lp-text);
	flex-direction: column;
	min-height: 62px;
}

.lp-quick-card .lp-icon {
	color: var(--lp-green);
	height: 20px;
	width: 20px;
}

.lp-attention {
	padding: 9px 11px;
}

.lp-attention .lp-section-label {
	margin: 0 0 6px;
}

.lp-attention > div {
	align-items: center;
	display: flex;
	gap: 7px;
}

.lp-attention .lp-icon {
	color: #16a34a;
}

.lp-attention span {
	display: flex;
	flex-direction: column;
}

.lp-attention strong {
	color: var(--lp-ink);
	font-size: 11px;
}

.lp-attention small {
	color: #9ca3af;
	font-size: 9px;
}

.lp-payment-note {
	color: var(--lp-muted);
	font-size: 10px;
	line-height: 1.45;
	padding: 9px 11px;
}

.lp-list-card {
	overflow: hidden;
}

.lp-product {
	border-bottom: 1px solid #f3f4f6;
	padding: 10px 11px;
}

.lp-product:last-child {
	border-bottom: 0;
}

.lp-product__heading {
	align-items: flex-start;
	display: flex;
	gap: 8px;
	justify-content: space-between;
}

.lp-product__heading strong {
	color: var(--lp-ink);
	font-size: 12px;
	font-weight: 600;
}

.lp-product__heading span {
	color: var(--lp-green);
	font-size: 11px;
	font-weight: 700;
	text-align: right;
}

.lp-product > small {
	color: #9ca3af;
	display: block;
	font-size: 9px;
	line-height: 1.4;
	margin: 3px 0 8px;
}

.lp-list-note {
	background: #fffbeb;
	color: #92400e;
	font-size: 9px;
	line-height: 1.45;
	margin: 0;
	padding: 8px 11px;
}

.lp-account-section-title {
	margin-top: 0;
}

.lp-account-section-heading {
	margin: 12px 0 7px;
}

.lp-account-section-heading .lp-section-label {
	margin: 0;
}

.lp-account-section-heading small {
	color: #8a98a5;
	display: block;
	font-size: 9px;
	line-height: 1.35;
	margin-top: 2px;
}

.lp-account-breakdown {
	overflow: hidden;
}

.lp-account-breakdown__title {
	background: #f8fafc;
	border-bottom: 1px solid var(--lp-border);
	color: var(--lp-ink);
	font-size: 12px;
	font-weight: 700;
	padding: 11px 12px;
	text-align: center;
}

.lp-account-table {
	display: block;
}

.lp-account-table__header,
.lp-account-table__row {
	align-items: center;
	display: grid;
	gap: 6px;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(62px, 0.75fr);
}

.lp-account-table--stay .lp-account-table__header,
.lp-account-table--stay .lp-account-table__row {
	grid-template-columns: minmax(0, 1fr) minmax(80px, auto);
}

.lp-account-table__header {
	background: #fbfcfd;
	border-bottom: 1px solid #eef1f4;
	color: #96a2ad;
	font-size: 8px;
	font-weight: 700;
	letter-spacing: 0.08em;
	padding: 8px 10px;
	text-transform: uppercase;
}

.lp-account-table__header span:last-child,
.lp-account-table__row strong {
	text-align: right;
}

.lp-account-table__row {
	background: #f2f8fc;
	border-bottom: 1px solid #e6eef4;
	color: #41505d;
	font-size: 10px;
	line-height: 1.35;
	min-height: 38px;
	padding: 8px 10px;
}

.lp-account-table__row:nth-child(odd) {
	background: #edf6fc;
}

.lp-account-table__row span:nth-child(2) {
	color: #38749a;
}

.lp-account-table__row strong {
	color: var(--lp-ink);
	font-size: 10px;
	font-weight: 700;
}

.lp-account-breakdown--extras .lp-account-table__row {
	background: #f8fafc;
}

.lp-account-breakdown--extras .lp-account-table__row span:nth-child(2) {
	color: #52616b;
}

.lp-account-breakdown__subtotal {
	align-items: center;
	background: #fff;
	color: #52616b;
	display: flex;
	font-size: 10px;
	gap: 10px;
	justify-content: space-between;
	padding: 11px 12px;
}

.lp-account-breakdown__subtotal strong {
	color: #164a60;
	font-size: 14px;
	font-weight: 700;
}

.lp-account-total {
	align-items: center;
	background: var(--lp-green);
	border-radius: var(--lp-radius);
	color: #fff;
	display: flex;
	justify-content: space-between;
	margin: 10px 0;
	padding: 13px 14px;
}

.lp-account-total > span {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.lp-account-total > strong {
	font-size: 23px;
	font-weight: 700;
}

.lp-account-total small {
	font-size: 10px;
	opacity: 0.72;
}

.lp-account-grid {
	display: grid;
	gap: 7px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-bottom: 9px;
}

.lp-account-grid > div {
	border: 1px solid;
	border-radius: var(--lp-radius);
	display: flex;
	flex-direction: column;
	padding: 10px;
	text-align: center;
}

.lp-account-grid span,
.lp-account-grid small {
	font-size: 9px;
	text-transform: uppercase;
}

.lp-account-grid strong {
	font-size: 19px;
	font-weight: 600;
}

.lp-account-paid {
	background: #eef7f2;
	border-color: #bbe7ce !important;
	color: #15803d;
}

.lp-account-due {
	background: #fff7ed;
	border-color: #fcd34d !important;
	color: #b45309;
}

.lp-transfer-review .lp-button {
	margin-top: 8px;
}

.lp-movements {
	overflow: hidden;
}

.lp-movements > div {
	align-items: center;
	border-bottom: 1px solid #f3f4f6;
	display: flex;
	justify-content: space-between;
	padding: 9px 11px;
}

.lp-movements > div[hidden] {
	display: none;
}

.lp-movements > div:last-child {
	border-bottom: 0;
}

.lp-movements span {
	display: flex;
	flex-direction: column;
}

.lp-movements strong,
.lp-movements b {
	color: var(--lp-ink);
	font-size: 10px;
	font-weight: 600;
}

.lp-movements small {
	color: #9ca3af;
	font-size: 9px;
}

.lp-wifi-card {
	background: var(--lp-wifi-card-color);
	border: 1px solid var(--lp-wifi-card-border-color);
	border-radius: var(--lp-radius);
	color: #111827;
	margin-bottom: 9px;
	padding: 11px;
}

.lp-wifi-card h3,
.lp-additional-info h3 {
	align-items: center;
	display: flex;
	font-size: 12px;
	font-weight: 600;
	gap: 6px;
	margin: 0 0 8px;
}

.lp-wifi-card h3,
.lp-wifi-card small,
.lp-wifi-card strong {
	color: #111827;
}

.lp-wifi-card h3 .lp-icon {
	color: var(--lp-gold);
}

.lp-wifi-card > div {
	display: grid;
	gap: 6px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lp-wifi-card > div > span {
	background: rgba(255, 255, 255, 0.42);
	border-radius: 7px;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 8px;
}

.lp-wifi-card small {
	font-size: 8px;
	opacity: 0.65;
}

.lp-wifi-card strong {
	font-size: 10px;
	overflow-wrap: anywhere;
}

.lp-hotel-services {
	overflow: hidden;
}

.lp-hotel-services__heading,
.lp-hotel-service {
	align-items: center;
	border-bottom: 1px solid #f3f4f6;
	display: flex;
	gap: 8px;
	justify-content: space-between;
	padding: 9px 11px;
}

.lp-hotel-service:last-child {
	border-bottom: 0;
}

.lp-hotel-services__heading > span,
.lp-hotel-service > span {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lp-hotel-services__heading strong,
.lp-hotel-service strong {
	color: var(--lp-ink);
	font-size: 10px;
	font-weight: 600;
}

.lp-hotel-services__heading small,
.lp-hotel-service small {
	color: #9ca3af;
	font-size: 8px;
	line-height: 1.35;
}

.lp-hotel-services__heading > b {
	background: #f3f4f6;
	border-radius: 999px;
	color: var(--lp-text);
	font-size: 8px;
	padding: 4px 7px;
}

.lp-policies {
	overflow: hidden;
	padding-top: 1px;
}

.lp-policies .lp-section-label {
	margin-left: 10px;
	margin-right: 10px;
}

.lp-policy-row {
	align-items: flex-start;
	display: flex;
	font-size: 9px;
	gap: 10px;
	justify-content: space-between;
	padding: 4px 10px;
}

.lp-policy-row span {
	color: var(--lp-muted);
}

.lp-policy-row strong {
	color: var(--lp-ink);
	font-weight: 600;
	max-width: 62%;
	text-align: right;
}

.lp-additional-info {
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: var(--lp-radius);
	color: #78350f;
	margin-bottom: 9px;
	padding: 10px 11px;
}

.lp-additional-info h3 {
	color: #92400e;
}

.lp-additional-info p {
	font-size: 9px;
	line-height: 1.5;
	margin: 0;
}

.lp-bottom-nav {
	background: var(--lp-navigation-surface);
	border-top: 1px solid var(--lp-border);
	display: grid;
	flex: 0 0 auto;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	padding: 7px 3px 9px;
}

.lp-tab-button {
	align-items: center;
	background: transparent;
	border: 0;
	color: var(--lp-bottom-nav-inactive-color);
	cursor: pointer;
	display: flex;
	flex-direction: column;
	font-size: 9px;
	gap: 2px;
	justify-content: center;
	padding: 0;
}

.lp-tab-button .lp-icon {
	height: 19px;
	width: 19px;
}

.lp-tab-button.is-active {
	color: var(--lp-bottom-nav-active-color);
	font-weight: 600;
}

.lp-tab-button.is-disabled,
.lp-tab-button:disabled {
	cursor: not-allowed;
	opacity: 0.42;
}

.lp-tab-button.is-disabled.is-active,
.lp-tab-button:disabled.is-active {
	color: var(--lp-bottom-nav-inactive-color);
	font-weight: 400;
}

.lp-whatsapp-overlay {
	align-items: flex-end;
	background: rgba(0, 0, 0, 0.48);
	border-radius: 35px;
	display: flex;
	inset: 0;
	overflow: hidden;
	position: absolute;
	z-index: 5;
}

.lp-whatsapp-sheet {
	background: var(--lp-canvas);
	border-radius: 18px 18px 0 0;
	padding: 15px 14px 12px;
	width: 100%;
}

.lp-whatsapp-sheet__contact {
	align-items: center;
	display: flex;
	gap: 8px;
	margin-bottom: 10px;
}

.lp-whatsapp-sheet__contact > span:first-child {
	align-items: center;
	background: #25d366;
	border-radius: 50%;
	color: #fff;
	display: flex;
	height: 32px;
	justify-content: center;
	width: 32px;
}

.lp-whatsapp-sheet__contact > span:last-child {
	display: flex;
	flex-direction: column;
}

.lp-whatsapp-sheet__contact strong {
	color: var(--lp-ink);
	font-size: 12px;
}

.lp-whatsapp-sheet__contact small {
	color: #9ca3af;
	font-size: 9px;
}

.lp-whatsapp-message {
	background: #fff;
	border: 1px solid var(--lp-border);
	border-radius: 11px 11px 11px 2px;
	color: var(--lp-text);
	font-size: 11px;
	line-height: 1.5;
	margin-bottom: 9px;
	padding: 10px 11px;
}

.lp-whatsapp-sheet > p {
	color: #9ca3af;
	font-size: 9px;
	line-height: 1.4;
	margin: 0 0 9px;
	text-align: center;
}

.lp-toast {
	align-items: center;
	background: #fff4c2;
	border: 1px solid #efd46d;
	border-radius: 12px;
	box-shadow: 0 10px 24px rgba(92, 69, 0, 0.18), 0 2px 6px rgba(92, 69, 0, 0.08);
	color: #5c4500;
	display: flex;
	font-size: 10px;
	gap: 9px;
	left: 50%;
	line-height: 1.4;
	max-width: calc(100% - 34px);
	min-width: min(300px, calc(100% - 34px));
	padding: 11px 13px;
	position: absolute;
	text-align: left;
	top: 50%;
	transform: translate(-50%, -50%);
	width: max-content;
	z-index: 8;
}

.lp-toast__icon {
	align-items: center;
	background: rgba(180, 130, 0, 0.13);
	border-radius: 50%;
	color: #8a6500;
	display: inline-flex;
	flex: 0 0 30px;
	height: 30px;
	justify-content: center;
	width: 30px;
}

.lp-toast__icon[hidden] {
	display: none;
}

.lp-toast__icon .lp-icon {
	height: 17px;
	width: 17px;
}

.lp-toast__message {
	flex: 1 1 auto;
	font-weight: 600;
}


/* Grouped typography controls from the plugin settings. */
.lp-scenario-button {
	font-size: var(--lp-font-scenarios-14);
}

.lp-statusbar {
	font-size: var(--lp-font-header-10);
}

.lp-phone-header__eyebrow {
	font-size: var(--lp-font-header-9);
}

.lp-phone-header__top strong {
	font-size: var(--lp-font-header-15);
}

.lp-access-code {
	font-size: var(--lp-font-header-10);
}

.lp-guest__avatar {
	font-size: var(--lp-font-header-12);
}

.lp-guest strong {
	font-size: var(--lp-font-header-13);
}

.lp-guest small {
	font-size: var(--lp-font-header-10);
}

.lp-state-heading h3 {
	font-size: var(--lp-font-headings-17);
}

.lp-notice__heading strong,
.lp-attention strong,
.lp-account-breakdown__heading {
	font-size: var(--lp-font-headings-11);
}

.lp-product__heading strong,
.lp-wifi-card h3,
.lp-additional-info h3,
.lp-whatsapp-sheet__contact strong {
	font-size: var(--lp-font-headings-12);
}

.lp-account-total > strong {
	font-size: var(--lp-font-headings-26);
}

.lp-account-grid strong {
	font-size: var(--lp-font-headings-19);
}

.lp-state-heading p,
.lp-stay-details dl,
.lp-product__heading span,
.lp-account-total small,
.lp-whatsapp-message {
	font-size: var(--lp-font-body-11);
}

.lp-notice__heading small,
.lp-notice > p,
.lp-payment-note,
.lp-account-charge strong,
.lp-account-charge b,
.lp-account-breakdown__subtotal,
.lp-account-breakdown__subtotal strong,
.lp-movements strong,
.lp-movements b,
.lp-wifi-card strong,
.lp-hotel-services__heading strong,
.lp-hotel-service strong,
.lp-toast {
	font-size: var(--lp-font-body-10);
}

.lp-badge,
.lp-service-status,
.lp-section-label,
.lp-attention small,
.lp-product > small,
.lp-list-note,
.lp-account-total > span,
.lp-account-grid span,
.lp-account-grid small,
.lp-account-charge small,
.lp-movements small,
.lp-policy-row,
.lp-additional-info p,
.lp-whatsapp-sheet__contact small,
.lp-whatsapp-sheet > p {
	font-size: var(--lp-font-small-9);
}

.lp-wifi-card small,
.lp-hotel-services__heading small,
.lp-hotel-service small,
.lp-hotel-services__heading > b {
	font-size: var(--lp-font-small-8);
}

.lp-button,
.lp-quick-card {
	font-size: var(--lp-font-buttons-10);
}

.lp-tab-button {
	font-size: var(--lp-font-bottom-nav-9);
}

@media (max-width: 767px) {
	.lobify-lobipass-demo-stage {
		width: min(100%, var(--lp-demo-mobile-max-width));
	}

	.lobify-lobipass-demo-stage > .lobify-lobipass-demo {
		width: min(var(--lp-demo-unscaled-width), 410px);
	}

	.lobify-lobipass-demo {
		width: min(100%, 410px);
	}
}

@media (max-width: 420px) {
	.lp-phone-shell:not(.has-frame) {
		border-radius: 36px;
		padding: 7px;
	}

	.lp-phone-shell:not(.has-frame) .lp-phone {
		border-radius: 30px;
		height: 660px;
	}

	.lp-whatsapp-overlay {
		border-radius: 30px;
	}

	.lp-phone-shell.has-frame .lp-whatsapp-overlay {
		border-radius: 4.5% / 2.8%;
	}

	.lp-scenario-button {
		font-size: var(--lp-font-scenarios-12);
		padding-inline: 7px;
	}

	.lp-scenario-button__icon {
		flex-basis: 21px;
		height: 21px;
		width: 21px;
	}

	.lp-scenario-button__icon .lp-icon {
		height: 12px;
		width: 12px;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.lp-whatsapp-sheet {
		animation: lobipass-sheet-in 180ms ease-out;
	}

	@keyframes lobipass-sheet-in {
		from {
			transform: translateY(18px);
		}

		to {
			transform: translateY(0);
		}
	}
}


/* Tipografía configurable para el desglose de cuenta v1.4.1. */
.lobify-lobipass-demo .lp-account-breakdown__title,
.lobify-lobipass-demo .lp-account-breakdown__subtotal strong {
	font-size: var(--lp-font-headings-12);
}

.lobify-lobipass-demo .lp-account-table__row,
.lobify-lobipass-demo .lp-account-table__row strong,
.lobify-lobipass-demo .lp-account-breakdown__subtotal,
.lobify-lobipass-demo .lp-account-total > span {
	font-size: var(--lp-font-body-10);
}

.lobify-lobipass-demo .lp-account-table__header,
.lobify-lobipass-demo .lp-account-section-heading small,
.lobify-lobipass-demo .lp-account-total small {
	font-size: var(--lp-font-small-9);
}

.lobify-lobipass-demo .lp-account-total > strong {
	font-size: var(--lp-font-headings-26);
}