/* Sticky app bar: keep the navbar anchored to the top while scrolling.
 *
 * We use `position: fixed` (viewport-relative) instead of `sticky`
 * because the theme sets `.site-container { overflow: hidden }` which
 * silently promotes site-container into a scroll container — sticky
 * then attaches to it (which doesn't actually scroll) instead of the
 * window, and the header scrolls away with the page. Fixed ignores
 * scroll containers entirely and stays pinned to the viewport. The
 * body gets a matching top padding so content isn't hidden under it. */
body { padding-top: var(--tsx-navbar-h, 64px); }
.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}
.site-header > .header-navbar {
	position: relative;
	z-index: 1;
}
@media (max-width: 900px) {
	body { padding-top: var(--tsx-navbar-h-sm, 56px); }
}

/* Header menu (navbar + burger): navy text, orange hover, no top line. */

.header-navbar__menu ul li a,
.header-navbar__burger ul li a {
	color: rgb(20, 68, 92);
}

.header-navbar__menu ul li a:hover,
.header-navbar__menu ul li.active > a,
.header-navbar__menu ul li.current-menu-item:not(.menu-item-home) > a,
.header-navbar__burger ul li a:hover,
.header-navbar__burger ul li.active > a,
.header-navbar__burger ul li.current-menu-item:not(.menu-item-home) > a {
	color: #ffc107;
}

.header-navbar__menu > ul > li.current-menu-item::before {
	display: none;
}

/* On the landing home (page-inicio) all top-level menu items point to the
 * current page, so none is highlighted: keep them navy (hover stays orange).
 * Must come before the scoped hover rules below to resolve specificity. */
body.page-inicio .header-navbar__menu ul li.active > a,
body.page-inicio .header-navbar__menu ul li.current-menu-item > a,
body.page-inicio .header-navbar__burger ul li.active > a,
body.page-inicio .header-navbar__burger ul li.current-menu-item > a {
	color: rgb(20, 68, 92);
}

body.page-inicio .header-navbar__menu ul li a:hover,
body.page-inicio .header-navbar__burger ul li a:hover {
	color: #ffc107;
}

/* Partner profile editor: full Tsorbix form on /mi-perfil/. */
.tsx-profile-notice {
	border-left: 4px solid var(--tsx-navy, #14445C);
	background: #eaf4f7;
	padding: 14px 18px;
	margin: 0 0 24px;
	border-radius: 6px;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 15px;
}
.tsx-profile-notice--error {
	border-left-color: #b3261e;
	background: #fdecea;
}

.tsx-profile-form {
	max-width: 720px;
	margin: 24px auto;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	color: var(--tsx-black, #000);
}
.tsx-profile-form {
	display: flex;
	flex-direction: column;
}
.tsx-profile-form__intro { margin-bottom: 16px; }
.tsx-profile-form__lead  { margin: 0; color: var(--tsx-navy, #14445C); font-size: 15px; }
.tsx-profile-form__section { margin: 24px 0; }
.tsx-profile-form__heading {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-weight: 800;
	color: var(--tsx-navy, #14445C);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-size: 18px;
	margin: 0 0 12px;
}
.tsx-profile-form__field { display: flex; flex-direction: column; width: 100%; margin: 0 0 14px; }
.tsx-profile-form__field > label {
	display: block;
	font-weight: 600;
	font-size: 14px;
	margin: 0 0 4px;
	color: var(--tsx-navy, #14445C);
}
.tsx-profile-form__field .tsx-required { color: #b3261e; }
.tsx-profile-form__field .tsx-input {
	width: 100%;
	padding: 10px 12px;
	font: inherit;
	border: 1px solid #ccd0d4;
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
}
.tsx-profile-form__field .tsx-input:focus {
	outline: none;
	border-color: var(--tsx-navy, #14445C);
	box-shadow: 0 0 0 2px rgba(20, 68, 92, 0.15);
}

/* Static readonly chip used to display the elected actor on the editor
 * ("Tipo de Actor Turístico" is not user-editable once registered). */
.tsx-profile-form__value-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--tsx-navy, #14445C);
	color: #fff;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.02em;
	align-self: flex-start;
}

/* Fields stack one below the other; selects / radios / checkboxes span
 * the full available width. Flex column, no grid/block so nothing
 * collapses into side-by-side columns (even on small screens). */
.tsx-profile-form__section {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.tsx-profile-form__grid {
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Radios / checkboxes. The container is a flex row; the label text is
 * a <span> (inline by default, blockified by flex) that takes the
 * leftover width and wraps naturally; the <input> pins to the right.
 * align-items: flex-start keeps the control at the top of the row when
 * the text spans multiple lines. */
.tsx-profile-form__option {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
	margin: 0 0 12px;
	padding: 0;
	color: var(--tsx-black, #000);
	font-weight: 400;
	font-size: 14px;
	line-height: 1.5;
	box-sizing: border-box;
}
.tsx-profile-form__option:last-child { margin-bottom: 0; }
.tsx-profile-form__option-text {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
}
.tsx-profile-form__option input {
	flex: 0 0 auto;
	margin: 4px 0 0;
}
.tsx-profile-form__option a { color: var(--tsx-navy, #14445C); text-decoration: underline; }
.tsx-profile-form__readonly dl {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 6px 16px;
	margin: 0;
	font-size: 14px;
}
.tsx-profile-form__readonly dt { font-weight: 700; }
.tsx-profile-form__readonly dd { margin: 0; }
.tsx-profile-form__readonly code { background: #eaf4f7; padding: 1px 6px; border-radius: 3px; }
.tsx-profile-form__actions {
	margin-top: 24px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}
.tsx-profile-form__actions--top {
	margin-top: 0;
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eef2f6;
}
.tsx-profile-form__actions--top .tsx-button { flex: 0 0 auto; }
.tsx-button {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 12px 18px;
	border-radius: 8px;
	border: 0;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
}
.tsx-button--primary { background: var(--tsx-navy, #14445C); color: #fff; }
.tsx-button--primary:hover { background: #0f3344; }
.tsx-button--secondary { background: transparent; color: var(--tsx-navy, #14445C); border: 1px solid #b9cdd6; }
.tsx-button--secondary:hover { background: #eaf4f7; border-color: var(--tsx-navy, #14445C); }
.tsx-button--ghost { background: transparent; color: var(--tsx-navy, #14445C); }
.tsx-button--ghost:hover { background: rgba(20, 68, 92, 0.08); }

/* Offer action buttons: view-profile + send-message, applied to every offer
 * (not only to accepted offers). */
.hp-offer__action--tsx-profile,
.hp-offer__action--tsx-message {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--tsx-navy, #14445C);
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-weight: 600;
	text-decoration: none;
}
.hp-offer__action--tsx-profile:hover,
.hp-offer__action--tsx-message:hover {
	color: #0f3344;
}

/* Partner directory (/directorio-partners/) and public partner profile
 * (/partner/{username}/): networking pages for the partner network. */

.tsx-dir-notice {
	border-left: 4px solid var(--tsx-navy, #14445C);
	background: #eaf4f7;
	padding: 14px 18px;
	margin: 0 0 24px;
	border-radius: 6px;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	line-height: 1.6;
}
.tsx-dir-notice--error {
	border-left-color: #d9534f;
	background: #fdf0ef;
	color: #a02a26;
}
.tsx-dir-notice a { font-weight: 700; }

.tsx-dir-head { margin: 8px 0 20px; }
.tsx-dir-title {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-size: 2rem;
	color: var(--tsx-navy, #14445C);
	margin: 0 0 8px;
}
.tsx-dir-lead {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	color: #5a6b75;
	margin: 0;
	max-width: 640px;
	line-height: 1.6;
}

.tsx-dir-filters {
	background: #f6f9fa;
	border: 1px solid #e4ebee;
	border-radius: 10px;
	padding: 16px;
	margin: 0 0 12px;
}
.tsx-dir-filters__row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}
.tsx-dir-filter--search { flex: 1 1 240px; }
.tsx-dir-filter--search .tsx-input { width: 100%; }
.tsx-dir-filter select.tsx-input { min-width: 190px; }
.tsx-dir-filter--actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.tsx-dir-filter--actions .tsx-button { padding: 10px 16px; }

.tsx-dir-count {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.9rem;
	color: #5a6b75;
	margin: 0 0 16px;
}

.tsx-dir-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 18px;
	margin: 0 0 24px;
}
.tsx-dir-card {
	background: #fff;
	border: 1px solid #e4ebee;
	border-radius: 10px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	box-shadow: 0 1px 3px rgba(20, 68, 92, 0.06);
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.tsx-dir-card:hover {
	box-shadow: 0 4px 12px rgba(20, 68, 92, 0.12);
	transform: translateY(-2px);
}
.tsx-dir-card__avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	overflow: hidden;
	background: #eaf4f7;
	flex: 0 0 64px;
}
.tsx-dir-card__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tsx-dir-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 8px;
}
.tsx-dir-card__title {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-size: 1.15rem;
	color: var(--tsx-navy, #14445C);
	margin: 0;
}
.tsx-dir-card__sub {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.9rem;
	color: #5a6b75;
	margin: 0;
}
.tsx-dir-card__meta {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.85rem;
	color: #5a6b75;
	margin: 0;
}
.tsx-dir-card__actions {
	display: flex;
	flex-wrap: nowrap;
	gap: 6px;
	margin-top: auto;
	justify-content: flex-end;
	align-items: stretch;
}
.tsx-dir-card__actions .tsx-button {
	padding: 8px 10px;
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
	min-width: 0;
}
.tsx-dir-card__actions .tsx-button { flex: 1 1 0; text-align: center; }
/* Give the third ("Sitio web") button the same subtle outline as the
 * secondary one so all three actions in a card share a visual weight
 * when lined up side-by-side. Scoped to the directory card actions so
 * the global ghost button (used elsewhere, e.g. "Volver", "Limpiar")
 * keeps its borderless look. */
.tsx-dir-card__actions .tsx-button--ghost {
    border: 1px solid #b9cdd6;
}
.tsx-dir-card__actions .tsx-button--ghost:hover {
    border-color: var(--tsx-navy, #14445C);
    background: #eaf4f7;
}
/* On narrow viewports shrink the three action buttons so the longest
 * label ("EXPERIENCIAS") fits on one line without overflowing. */
@media (max-width: 640px) {
    .tsx-dir-card__actions { gap: 4px; }
    .tsx-dir-card__actions .tsx-button {
        padding: 7px 6px;
        font-size: 0.68rem;
        letter-spacing: 0.02em;
    }
}

.tsx-dir-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	margin: 0 0 24px;
}
.tsx-dir-pagination__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 12px;
	border: 1px solid #d5e0e5;
	border-radius: 6px;
	background: #fff;
	color: var(--tsx-navy, #14445C);
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-weight: 700;
	text-decoration: none;
}
.tsx-dir-pagination__link:hover { background: #eaf4f7; }
.tsx-dir-pagination__link--current {
	background: var(--tsx-navy, #14445C);
	color: #fff;
	border-color: var(--tsx-navy, #14445C);
}

/* Partner experiences (/directorio-partners/experiencias/?uid=NN): the
 * list of one partner's published experiences. */

.tsx-exp-head { margin: 8px 0 20px; }
.tsx-exp-back {
	display: inline-block;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--tsx-navy, #14445C);
	text-decoration: none;
	margin-bottom: 16px;
}
.tsx-exp-back:hover { text-decoration: underline; }

.tsx-exp-owner {
	display: flex;
	align-items: center;
	gap: 16px;
}
.tsx-exp-owner__avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	overflow: hidden;
	background: #eaf4f7;
	flex: 0 0 72px;
}
.tsx-exp-owner__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tsx-exp-title {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-size: 1.6rem;
	color: var(--tsx-navy, #14445C);
	margin: 0 0 4px;
}
.tsx-exp-loc {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	color: #5a6b75;
	margin: 0;
}

.tsx-exp-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 18px;
	margin: 0 0 24px;
}
.tsx-exp-card {
	background: #fff;
	border: 1px solid #e4ebee;
	border-radius: 10px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 1px 3px rgba(20, 68, 92, 0.06);
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.tsx-exp-card:hover {
	box-shadow: 0 4px 12px rgba(20, 68, 92, 0.12);
	transform: translateY(-2px);
}
.tsx-exp-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: #eaf4f7;
	overflow: hidden;
}
.tsx-exp-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tsx-exp-card__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.85rem;
	color: #8ba0ab;
}
.tsx-exp-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 8px;
	padding: 16px;
}
.tsx-exp-card__title {
	font-family: var(--tsx-font-display, 'Baloo 2'), sans-serif;
	font-size: 1.05rem;
	color: var(--tsx-navy, #14445C);
	margin: 0;
	line-height: 1.35;
}
.tsx-exp-card__title a { color: inherit; text-decoration: none; }
.tsx-exp-card__title a:hover { text-decoration: underline; }
.tsx-exp-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}
.tsx-exp-card__country {
	background: #fff7e0;
	color: #8a6d1a;
	border: 1px solid #f0dfa8;
	border-radius: 999px;
	padding: 2px 10px;
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.75rem;
	font-weight: 700;
}
.tsx-exp-card__cat {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 0.8rem;
	color: #5a6b75;
}
.tsx-exp-card__price {
	font-family: var(--tsx-font-body, 'Nunito Sans'), sans-serif;
	font-size: 1rem;
	font-weight: 700;
	color: var(--tsx-navy, #14445C);
	margin: 0;
}
.tsx-exp-card__actions {
	display: flex;
	justify-content: flex-end;
	margin-top: auto;
}
.tsx-exp-card__actions .tsx-button { padding: 9px 14px; font-size: 0.85rem; }


/* ==========================================================================
   Account-setup snackbar (persistent, no dismiss) + inline checklist
   on /mi-perfil/. Wired in includes/class-account-setup.php and
   templates/partner-profile.php. The snackbar also carries a small
   inline <style> block in render_snackbar() so it works even on
   pages where the parent stylesheet hasn't been enqueued.
   ========================================================================== */

.ts-account-setup-tile {
	box-sizing: border-box;
}
.ts-account-setup-tile *,
.ts-account-setup-tile *::before,
.ts-account-setup-tile *::after {
	box-sizing: border-box;
}

.tsx-profile-setup {
	/* Match the profile form's own container (max-width: 720px,
	   centered) so the checklist doesn't span the full page
	   column while the form below it is narrower. */
	max-width: 720px;
	margin: 24px auto;
	padding: 20px 22px;
	background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 14px;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
}
.tsx-profile-setup__head { margin-bottom: 12px; }
.tsx-profile-setup__title {
	margin: 0 0 4px 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--tsx-navy, #14445C);
}
.tsx-profile-setup__lead {
	margin: 0 0 12px 0;
	color: #475569;
	font-size: 0.92rem;
	line-height: 1.5;
}
.tsx-profile-setup__progress {
	height: 6px;
	background: #e2e8f0;
	border-radius: 999px;
	overflow: hidden;
}
.tsx-profile-setup__progress-bar {
	height: 100%;
	background: linear-gradient(90deg, #15cd72 0%, #0f9d57 100%);
	transition: width 0.4s ease;
}
.tsx-profile-setup__list {
	list-style: none;
	margin: 16px 0 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 8px 16px;
}
.tsx-profile-setup__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	background: #ffffff;
	border: 1px solid rgba(15, 23, 42, 0.06);
	border-radius: 8px;
}
.tsx-profile-setup__bullet {
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: #f59e0b;
	flex: 0 0 auto;
}
.tsx-profile-setup__name {
	flex: 1 1 auto;
	font-size: 0.9rem;
	color: #0f172a;
}
.tsx-profile-setup__jump {
	flex: 0 0 auto;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--tsx-navy, #14445C);
	text-decoration: none;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(20, 68, 92, 0.08);
}
.tsx-profile-setup__jump:hover { background: rgba(20, 68, 92, 0.16); }

/* Mobile: compact single-ROW bar. Copy left, button right, and the
   progress collapses into a thin 3px strip along the bottom edge of
   the tile (mirrors the inline styles in class-account-setup.php). */
@media (max-width: 600px) {
	.ts-account-setup-tile { left: 8px; right: 8px; bottom: 8px; }
	.ts-account-setup-tile__inner { position: relative; gap: 10px; padding: 10px 12px 15px 12px; }
	.ts-account-setup-tile__copy { flex: 1 1 auto; }
	.ts-account-setup-tile__title { font-size: 13px; }
	.ts-account-setup-tile__subtitle { font-size: 11.5px; }
	.ts-account-setup-tile__progress { position: absolute; left: 12px; right: 12px; bottom: 6px; height: 3px; flex: none; }
	.ts-account-setup-tile__cta { padding: 7px 12px; font-size: 12.5px; }
}
