/* Artaxnet Booking Engine — estilos del widget
   Paleta: tinta verde-noche #1E2B28, arena cálida #EDE6D6, dorado apagado #B8925A, terracota #A0503F
   Tipografía: Fraunces (títulos) + Inter (cuerpo) */

.artaxnet-be {
	--ab-ink: #1e2b28;
	--ab-sand: #ede6d6;
	--ab-gold: #b8925a;
	--ab-rust: #a0503f;
	--ab-white: #faf8f3;
	--ab-line: #d9d0ba;
	--ab-error: #a0503f;

	max-width: 760px;
	margin: 2.5rem auto;
	background: var(--ab-white);
	border: 1px solid var(--ab-line);
	border-radius: 4px;
	padding: 2.25rem;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	color: var(--ab-ink);
}

.artaxnet-be__title {
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 600;
	font-size: 1.65rem;
	margin: 0 0 1.5rem;
	color: var(--ab-ink);
	letter-spacing: -0.01em;
}

.artaxnet-be__form {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 0.9rem;
	align-items: flex-end;
}

.artaxnet-be__form--stacked {
	flex-direction: column;
	align-items: stretch;
}

.artaxnet-be__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	flex: 1 1 150px;
}

.artaxnet-be__field--small {
	flex: 0 1 90px;
}

.artaxnet-be__field--full {
	flex-basis: 100%;
}

.artaxnet-be__field--kids-ages {
	flex-basis: 100%;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.6rem;
}

.artaxnet-be__field--kids-ages .artaxnet-be__field {
	flex: 0 1 100px;
}

.artaxnet-be label {
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--ab-ink);
	opacity: 0.75;
}

.artaxnet-be input,
.artaxnet-be select,
.artaxnet-be textarea {
	font-family: inherit;
	font-size: 0.95rem;
	padding: 0.65rem 0.7rem;
	border: 1px solid var(--ab-line);
	border-radius: 3px;
	background: #fff;
	color: var(--ab-ink);
}

.artaxnet-be input:focus,
.artaxnet-be select:focus,
.artaxnet-be textarea:focus {
	outline: 2px solid var(--ab-gold);
	outline-offset: 1px;
	border-color: var(--ab-gold);
}

.artaxnet-be__button {
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	font-size: 0.9rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	background: var(--ab-ink);
	color: var(--ab-white);
	border: none;
	border-radius: 3px;
	padding: 0.85rem 1.6rem;
	cursor: pointer;
	transition: background-color 0.15s ease;
	white-space: nowrap;
}

.artaxnet-be__button:hover {
	background: var(--ab-rust);
}

.artaxnet-be__button:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.artaxnet-be__back {
	background: none;
	border: none;
	color: var(--ab-gold);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	padding: 0 0 1rem;
}

.artaxnet-be__back:hover {
	color: var(--ab-rust);
}

.artaxnet-be__feedback {
	margin-top: 1rem;
	font-size: 0.9rem;
}

.artaxnet-be__feedback--error {
	color: var(--ab-error);
}

.artaxnet-be__feedback--loading {
	color: var(--ab-ink);
	opacity: 0.7;
}

.artaxnet-be__rooms {
	margin-top: 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
}

.artaxnet-be__room {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	background: var(--ab-sand);
	border-radius: 3px;
	padding: 1rem 1.2rem;
	flex-wrap: wrap;
}

.artaxnet-be__room-name {
	font-family: 'Fraunces', serif;
	font-weight: 600;
	font-size: 1.05rem;
}

.artaxnet-be__room-meta {
	font-size: 0.82rem;
	opacity: 0.75;
	margin-top: 0.2rem;
}

.artaxnet-be__room-price {
	font-weight: 600;
	font-size: 1.1rem;
	color: var(--ab-rust);
}

.artaxnet-be__selected-room,
.artaxnet-be__summary {
	background: var(--ab-sand);
	border-radius: 3px;
	padding: 1rem 1.2rem;
	margin-bottom: 1.5rem;
	font-size: 0.9rem;
}

.artaxnet-be__step--done {
	text-align: center;
	padding: 1.5rem 0;
}

.artaxnet-be__done-icon {
	width: 56px;
	height: 56px;
	line-height: 56px;
	border-radius: 50%;
	background: var(--ab-ink);
	color: var(--ab-white);
	font-size: 1.6rem;
	margin: 0 auto 1rem;
}

.artaxnet-be-notice {
	background: #fdf1ef;
	border: 1px solid var(--ab-rust);
	color: var(--ab-rust);
	padding: 1rem;
	border-radius: 3px;
}

@media (max-width: 560px) {
	.artaxnet-be {
		padding: 1.5rem 1.1rem;
		margin: 1.25rem 0.5rem;
	}

	.artaxnet-be__room {
		flex-direction: column;
		align-items: flex-start;
	}
}
