/* Shared global styles and components */

/* Breakpoint contract (documental, reutilizado en template-parts):
 * desktop-xl: >= 1920
 * desktop-lg: 1700-1919
 * desktop-md: 1540-1699
 * desktop-sm: 1280-1539
 * tablet: 768-1279
 * tablet-sm: 501-767
 * mobile: <= 767
 * mobile-sm: <= 500
 */

.site-wrap {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0;
}

main {
	padding: 0 0 100px;
}

body {
	font-family: var(--font-body);
	font-size: var(--type-body-size);
	font-weight: var(--type-body-weight);
	line-height: var(--line-height-base);
}

h1,
.h1 {
	font-size: var(--type-h1-size);
	font-weight: var(--type-h1-weight);
	line-height: 1.1;
}

h2,
.h2 {
	font-size: var(--type-h2-size);
	font-weight: var(--type-h2-weight);
	line-height: 1.15;
}

h3,
.h3 {
	font-size: var(--type-h3-size);
	font-weight: var(--type-h3-weight);
	line-height: 1.2;
}

h4,
.h4 {
	font-size: var(--type-h4-size);
	font-weight: var(--type-h4-weight);
	line-height: 1.25;
}

a,
a:visited,
.link-like {
	font-size: var(--type-link-size);
	font-weight: var(--type-link-weight);
}

small,
.text-aux,
.aux-text {
	font-size: var(--type-aux-size);
	font-weight: var(--type-aux-weight);
	line-height: 1.35;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
select,
textarea,
.select2-selection,
.yith-wcbk-booking-field {
	border-radius: var(--field-radius);
}

.xplora-btn {
	--btn-bg: var(--color-brand-dark);
	--btn-bg-hover: var(--btn-bg);
	--btn-border: var(--btn-bg);
	--btn-text: var(--color-white);
	--btn-height: 30px;
	--btn-padding-inline: 24px;
	--btn-radius: 999px;
	--btn-icon-size: 12px;
	--btn-icon-gap: 8px;
	--btn-font-size: var(--type-link-size);
	--btn-font-weight: var(--type-link-weight);
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: var(--btn-icon-gap);
	min-height: var(--btn-height);
	padding-inline: var(--btn-padding-inline);
	border: 1px solid var(--btn-border);
	border-radius: var(--btn-radius);
	background: var(--btn-bg);
	color: var(--btn-text);
	font-family: var(--font-ui);
	font-size: var(--btn-font-size);
	font-weight: var(--btn-font-weight);
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.xplora-btn:hover,
.xplora-btn:focus-visible {
	background: var(--btn-bg-hover);
	border-color: var(--btn-bg-hover);
	color: var(--btn-text);
	text-decoration: none;
}

.xplora-btn--with-icon {
	padding-left: 24px;
	padding-right: 12px;
}

.xplora-btn--with-icon.xplora-btn--icon-left {
	padding-left: 16px;
	padding-right: 24px;
}

.xplora-btn__label {
	display: inline-flex;
	align-items: center;
}

.xplora-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.xplora-btn__icon-svg {
	width: var(--btn-icon-size);
	height: var(--btn-icon-size);
}

.xplora-btn--icon-split .xplora-btn__icon {
	padding-left: 0;
	margin-left: 0;
}

.xplora-btn--outline {
	--btn-bg: transparent;
	--btn-bg-hover: transparent;
}

.xplora-btn--text {
	--btn-bg: transparent;
	--btn-bg-hover: transparent;
	--btn-border: transparent;
	padding-inline: 0;
	border: 0;
	border-radius: 0;
}

.xplora-btn--brand {
	--btn-bg: var(--color-brand-dark);
	--btn-border: var(--color-brand-dark);
	--btn-text: var(--color-white);
}

.xplora-btn--accent {
	--btn-bg: var(--color-accent);
	--btn-border: var(--color-accent);
	--btn-text: var(--color-white);
}

.xplora-btn--dark {
	--btn-bg: var(--color-black);
	--btn-border: var(--color-black);
	--btn-text: var(--color-white);
}

.xplora-btn--light {
	--btn-bg: var(--color-white);
	--btn-border: var(--color-white);
	--btn-text: var(--color-dark);
}

.xplora-btn--danger {
	--btn-bg: var(--color-danger);
	--btn-border: var(--color-danger);
	--btn-text: var(--color-white);
}

.xplora-btn--success {
	--btn-bg: var(--color-success);
	--btn-border: var(--color-success);
	--btn-text: var(--color-white);
}

.xplora-btn--info {
	--btn-bg: var(--color-info);
	--btn-border: var(--color-info);
	--btn-text: var(--color-white);
}

.xplora-btn--solid.xplora-btn--brand {
	--btn-bg: var(--color-brand-dark);
	--btn-bg-hover: var(--color-brand);
	--btn-border: var(--color-brand-dark);
}

.xplora-btn--solid.xplora-btn--accent {
	--btn-bg: var(--color-accent);
	--btn-bg-hover: var(--color-accent-dark);
	--btn-border: var(--color-accent);
}

.xplora-btn--solid.xplora-btn--dark {
	--btn-bg: var(--color-black);
	--btn-bg-hover: var(--color-black);
	--btn-border: var(--color-black);
}

.xplora-btn--solid.xplora-btn--light {
	--btn-bg: var(--color-white);
	--btn-bg-hover: var(--color-light);
	--btn-border: var(--color-white);
	--btn-text: var(--color-dark);
}

.xplora-btn--solid.xplora-btn--danger {
	--btn-bg: var(--color-danger);
	--btn-bg-hover: var(--color-danger);
	--btn-border: var(--color-danger);
}

.xplora-btn--solid.xplora-btn--success {
	--btn-bg: var(--color-success);
	--btn-bg-hover: var(--color-success);
	--btn-border: var(--color-success);
}

.xplora-btn--solid.xplora-btn--info {
	--btn-bg: var(--color-info);
	--btn-bg-hover: var(--color-info);
	--btn-border: var(--color-info);
}

.xplora-btn--outline.xplora-btn--brand,
.xplora-btn--text.xplora-btn--brand {
	--btn-bg: transparent;
	--btn-border: var(--color-brand-dark);
	--btn-text: var(--color-brand-dark);
}

.xplora-btn--outline.xplora-btn--accent,
.xplora-btn--text.xplora-btn--accent {
	--btn-bg: transparent;
	--btn-border: var(--color-accent);
	--btn-text: var(--color-accent);
}

.xplora-btn--outline.xplora-btn--dark,
.xplora-btn--text.xplora-btn--dark {
	--btn-bg: transparent;
	--btn-border: var(--color-black);
	--btn-text: var(--color-black);
}

.xplora-btn--outline.xplora-btn--light,
.xplora-btn--text.xplora-btn--light {
	--btn-bg: transparent;
	--btn-border: var(--color-white);
	--btn-text: var(--color-white);
}

.xplora-btn--outline.xplora-btn--danger,
.xplora-btn--text.xplora-btn--danger {
	--btn-bg: transparent;
	--btn-border: var(--color-danger);
	--btn-text: var(--color-danger);
}

.xplora-btn--outline.xplora-btn--success,
.xplora-btn--text.xplora-btn--success {
	--btn-bg: transparent;
	--btn-border: var(--color-success);
	--btn-text: var(--color-success);
}

.xplora-btn--outline.xplora-btn--info,
.xplora-btn--text.xplora-btn--info {
	--btn-bg: transparent;
	--btn-border: var(--color-info);
	--btn-text: var(--color-info);
}

.xplora-btn--md {
	--btn-height: 30px;
	--btn-padding-inline: 24px;
}

.xplora-btn--lg {
	--btn-height: 36px;
	--btn-padding-inline: 24px;
}

.xplora-bg--brand-dark,
.xplora-surface--brand-dark {
	background-color: var(--color-brand-dark);
	color: var(--color-white);
}

.xplora-bg--accent,
.xplora-surface--accent {
	background-color: var(--color-accent);
	color: var(--color-white);
}

.xplora-bg--dark,
.xplora-surface--dark {
	background-color: var(--color-black);
	color: var(--color-white);
}

.xplora-bg--light,
.xplora-surface--light {
	background-color: var(--color-white);
	color: var(--color-dark);
}

.xplora-bg--danger,
.xplora-surface--danger {
	background-color: var(--color-danger);
	color: var(--color-white);
}

.xplora-bg--success,
.xplora-surface--success {
	background-color: var(--color-success);
	color: var(--color-white);
}

.xplora-bg--info,
.xplora-surface--info {
	background-color: var(--color-info);
	color: var(--color-white);
}

.xplora-detail {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 4px;
	color: var(--color-brand-dark);
	font-family: var(--font-ui);
	font-size: var(--type-aux-size);
	font-weight: var(--type-aux-weight);
	line-height: 1.2;
}

.xplora-detail__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.xplora-detail__icon-svg {
	width: var(--icon-size-sm);
	height: var(--icon-size-sm);
}

.xplora-detail__label {
	display: inline-flex;
	align-items: center;
}

.xplora-select,
.xplora-ui-select-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 32px;
}

.xplora-select::after,
.xplora-ui-select-wrap::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 9px;
	width: 7px;
	height: 7px;
	border-right: 1px solid var(--color-dark);
	border-bottom: 1px solid var(--color-dark);
	transform: translateY(-58%) rotate(45deg);
	pointer-events: none;
}

.xplora-select__field,
.xplora-ui-select {
	display: block;
	min-width: 92px;
	padding: 8px 20px 8px 10px;
	border: 0;
	border-radius: var(--field-radius);
	background: var(--color-white);
	color: var(--color-dark);
	font-family: var(--font-ui);
	font-size: var(--type-body-size);
	font-weight: var(--type-body-weight);
	line-height: 1.2;
	appearance: none;
	-webkit-appearance: none;
}

.xplora-select__field:focus-visible,
.xplora-ui-select:focus-visible {
	outline: 1px solid var(--color-dark);
}

.xplora-select__icon {
	position: absolute;
	top: 50%;
	left: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transform: translateY(-50%);
	color: var(--color-dark);
	pointer-events: none;
}

.xplora-select__icon-svg,
.xplora-select__icon .sprite-icons {
	width: 12px;
	height: 12px;
}

.xplora-select--with-icon .xplora-select__field {
	padding-left: 30px;
}

@media (max-width: 1400px) {
	.site-wrap {
		padding-inline: var(--page-gutter);
	}
}

@media (max-width: 767px) {
	.site-wrap {
		padding-inline: var(--page-gutter);
	}
}