/**
 * Rookie Experience Core · Hub de contacto nativo 0.19.17
 * Patrón funcional alineado con Gestia: botón circular + panel de acciones.
 */

.rit-contact-hub {
	--rit-contact-hub-navy: #0b3042;
	--rit-contact-hub-navy-dark: #071f2c;
	--rit-contact-hub-orange: #ea7a11;
	--rit-contact-hub-orange-dark: #cf6508;
	--rit-contact-hub-orange-soft: #fff3e7;
	--rit-contact-hub-text: #173747;
	--rit-contact-hub-muted: #6b7f89;
	--rit-contact-hub-line: rgba(11, 48, 66, 0.12);
	--rit-contact-hub-red: #d63638;
	--rit-contact-hub-bottom: 34px;
	position: fixed;
	right: 18px;
	bottom: var(--rit-contact-hub-bottom);
	z-index: 100000;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	font-family: Inter, "Helvetica Neue", Arial, sans-serif;
	pointer-events: none;
}

.rit-contact-hub,
.rit-contact-hub *,
.rit-contact-hub *::before,
.rit-contact-hub *::after {
	box-sizing: border-box;
}

.rit-contact-hub [hidden] {
	display: none !important;
}

.rit-contact-hub__panel {
	position: absolute;
	right: 0;
	bottom: 74px;
	width: min(360px, calc(100vw - 36px));
	overflow: hidden;
	border: 1px solid var(--rit-contact-hub-line);
	border-radius: 22px;
	background: #ffffff;
	box-shadow: 0 26px 70px rgba(7, 31, 44, 0.22), 0 6px 18px rgba(7, 31, 44, 0.08);
	pointer-events: auto;
	transform-origin: right bottom;
}

.rit-contact-hub.is-open .rit-contact-hub__panel {
	animation: rit-contact-hub-enter 180ms ease-out both;
}

.rit-contact-hub__header {
	position: relative;
	display: flex;
	min-height: 126px;
	align-items: flex-end;
	padding: 24px 62px 23px 24px;
	background:
		radial-gradient(circle at 92% 10%, rgba(234, 122, 17, 0.25), transparent 34%),
		linear-gradient(135deg, var(--rit-contact-hub-navy-dark), var(--rit-contact-hub-navy));
	color: #ffffff;
	text-align: left;
}

.rit-contact-hub__header-copy {
	display: grid;
	gap: 6px;
}

.rit-contact-hub__eyebrow {
	color: rgba(255, 255, 255, 0.65);
	font-size: 10px;
	font-weight: 850;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-transform: uppercase;
}

.rit-contact-hub__heading {
	color: #ffffff;
	font-size: 21px;
	font-weight: 820;
	letter-spacing: -0.025em;
	line-height: 1.22;
}

.rit-contact-hub__subheading {
	max-width: 260px;
	color: rgba(255, 255, 255, 0.74);
	font-size: 12px;
	font-weight: 560;
	line-height: 1.45;
}

.rit-contact-hub__close {
	position: absolute;
	top: 17px;
	right: 17px;
	display: grid;
	width: 38px;
	height: 38px;
	padding: 0;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.1);
	color: #ffffff;
	cursor: pointer;
	transition: background-color 160ms ease, transform 160ms ease;
}

.rit-contact-hub__close:hover {
	background: rgba(255, 255, 255, 0.18);
	transform: translateY(-1px);
}

.rit-contact-hub__close:focus-visible,
.rit-contact-hub__trigger:focus-visible,
.rit-contact-hub__action:focus-visible {
	outline: 3px solid rgba(234, 122, 17, 0.34);
	outline-offset: 3px;
}

.rit-contact-hub__close svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-width: 2;
}

.rit-contact-hub__actions {
	display: grid;
	gap: 10px;
	padding: 16px;
	background: #f7f9fa;
}

.rit-contact-hub__action {
	position: relative;
	display: grid;
	min-height: 72px;
	grid-template-columns: 45px minmax(0, 1fr) 30px;
	align-items: center;
	gap: 13px;
	padding: 12px 13px;
	border: 1px solid var(--rit-contact-hub-line);
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 7px 20px rgba(7, 31, 44, 0.05);
	color: var(--rit-contact-hub-text) !important;
	text-decoration: none !important;
	transition: border-color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
}

.rit-contact-hub__action:hover,
.rit-contact-hub__action:focus-visible {
	border-color: rgba(234, 122, 17, 0.46);
	box-shadow: 0 12px 28px rgba(7, 31, 44, 0.1);
	color: var(--rit-contact-hub-text) !important;
	transform: translateY(-2px);
}

.rit-contact-hub__action-icon {
	display: grid;
	width: 45px;
	height: 45px;
	place-items: center;
	border-radius: 14px;
	background: var(--rit-contact-hub-orange-soft);
	color: var(--rit-contact-hub-orange);
}

.rit-contact-hub__action--contact .rit-contact-hub__action-icon {
	background: #eaf8f0;
	color: #178a4b;
}

.rit-contact-hub__action-icon svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.rit-contact-hub__action--contact .rit-contact-hub__action-icon svg {
	width: 23px;
	height: 23px;
	fill: currentColor;
	stroke: none;
}

.rit-contact-hub__action-copy {
	display: grid;
	min-width: 0;
	gap: 3px;
	text-align: left;
}

.rit-contact-hub__action-copy strong {
	color: var(--rit-contact-hub-navy);
	font-size: 16px;
	font-weight: 840;
	letter-spacing: -0.015em;
	line-height: 1.2;
}

.rit-contact-hub__action-copy small {
	overflow: hidden;
	color: var(--rit-contact-hub-muted);
	font-size: 11px;
	font-weight: 570;
	line-height: 1.35;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rit-contact-hub__arrow {
	display: grid;
	width: 30px;
	height: 30px;
	place-items: center;
	border-radius: 50%;
	background: #f1f4f5;
	color: var(--rit-contact-hub-navy);
	font-size: 15px;
	font-weight: 850;
	transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.rit-contact-hub__action:hover .rit-contact-hub__arrow {
	background: var(--rit-contact-hub-orange);
	color: #ffffff;
	transform: translateX(1px);
}

.rit-contact-hub__trust {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 17px 16px;
	background: #f7f9fa;
	color: var(--rit-contact-hub-muted);
	font-size: 11px;
	font-weight: 560;
	line-height: 1.4;
}

.rit-contact-hub__trust svg {
	width: 17px;
	height: 17px;
	flex: 0 0 17px;
	fill: none;
	stroke: var(--rit-contact-hub-orange);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.rit-contact-hub__trigger {
	position: relative;
	display: inline-grid;
	width: 60px;
	height: 60px;
	min-width: 60px;
	min-height: 60px;
	padding: 0;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 50%;
	background: linear-gradient(135deg, var(--rit-contact-hub-navy-dark), var(--rit-contact-hub-navy));
	box-shadow: 0 16px 35px rgba(7, 31, 44, 0.27);
	color: #ffffff;
	font: inherit;
	cursor: pointer;
	pointer-events: auto;
	isolation: isolate;
	transition: box-shadow 170ms ease, transform 170ms ease, background-color 170ms ease;
}

.rit-contact-hub__trigger::after {
	position: absolute;
	inset: -6px;
	z-index: -1;
	border-radius: 50%;
	background: rgba(234, 122, 17, 0.2);
	content: "";
	animation: rit-contact-hub-pulse 2.2s ease-out infinite;
	pointer-events: none;
}

.rit-contact-hub__trigger:hover {
	box-shadow: 0 20px 42px rgba(7, 31, 44, 0.33);
	transform: translateY(-2px);
}

.rit-contact-hub__whatsapp,
.rit-contact-hub__mark {
	display: grid;
	width: 34px;
	height: 34px;
	place-items: center;
	border-radius: 50%;
	background: var(--rit-contact-hub-orange);
	color: #ffffff;
}

.rit-contact-hub__whatsapp svg,
.rit-contact-hub__mark svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.rit-contact-hub__trigger-label {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
}

.rit-contact-hub__badge {
	position: absolute;
	top: -7px;
	right: -7px;
	display: grid;
	min-width: 25px;
	height: 25px;
	padding: 0 5px;
	place-items: center;
	border: 3px solid #ffffff;
	border-radius: 999px;
	background: var(--rit-contact-hub-red);
	box-shadow: 0 5px 12px rgba(147, 20, 24, 0.3);
	color: #ffffff;
	font-size: 11px;
	font-weight: 900;
	line-height: 1;
	transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.rit-contact-hub__badge.is-hidden {
	opacity: 0;
	visibility: hidden;
	transform: scale(0.72);
}

@keyframes rit-contact-hub-enter {
	from {
		opacity: 0;
		transform: translateY(10px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes rit-contact-hub-pulse {
	0% {
		opacity: 0.8;
		transform: scale(0.88);
	}
	72%,
	100% {
		opacity: 0;
		transform: scale(1.32);
	}
}

@media (max-width: 640px) {
	.rit-contact-hub {
		right: 12px;
		--rit-contact-hub-bottom: 24px;
	}

	.rit-contact-hub__panel {
		bottom: 70px;
		width: min(348px, calc(100vw - 24px));
		border-radius: 20px;
	}

	.rit-contact-hub__header {
		min-height: 118px;
		padding: 21px 57px 20px 20px;
	}

	.rit-contact-hub__heading {
		font-size: 19px;
	}

	.rit-contact-hub__actions {
		padding: 14px;
	}

	.rit-contact-hub__action {
		min-height: 68px;
		grid-template-columns: 42px minmax(0, 1fr) 28px;
		gap: 11px;
		padding: 11px;
	}

	.rit-contact-hub__action-icon {
		width: 42px;
		height: 42px;
	}

	.rit-contact-hub__arrow {
		width: 28px;
		height: 28px;
	}

	.rit-contact-hub__trigger {
		width: 58px;
		height: 58px;
		min-width: 58px;
		min-height: 58px;
	}
}

@media (max-width: 360px) {
	.rit-contact-hub__action-copy small {
		font-size: 10px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rit-contact-hub,
	.rit-contact-hub *,
	.rit-contact-hub *::before,
	.rit-contact-hub *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}
