/**
 * Lobify Hotel Weather.
 */

.lobify-hotel-weather {
	background: var(--lobify-weather-bg, #173326);
	border-radius: var(--lobify-weather-radius, 14px);
	box-sizing: border-box;
	color: var(--lobify-weather-color, #fff);
	display: grid;
	font-size: var(--lobify-weather-text-size, 17px);
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-rows: 1fr auto;
	height: var(--lobify-weather-height, 104px);
	min-height: 0;
	overflow: hidden;
	padding: 8px 18px 6px;
	position: relative;
	width: 100%;
}

.lobify-hotel-weather__main,
.lobify-hotel-weather__condition {
	align-self: center;
	min-width: 0;
}

.lobify-hotel-weather__location {
	align-items: center;
	display: flex;
	font-size: 1em;
	font-weight: 600;
	gap: 7px;
	line-height: 1.2;
	margin-bottom: 3px;
	min-width: 0;
}

.lobify-hotel-weather__location span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.lobify-hotel-weather__pin {
	flex: 0 0 auto;
	height: 14px;
	width: 14px;
}

.lobify-hotel-weather__temperature {
	font-size: var(--lobify-weather-temp-size, 32px);
	font-weight: 750;
	letter-spacing: -0.035em;
	line-height: 1.05;
	white-space: nowrap;
}

.lobify-hotel-weather__temperature span {
	font-size: .64em;
	font-weight: 650;
	letter-spacing: 0;
	margin-left: 1px;
	vertical-align: .28em;
}

.lobify-hotel-weather__condition {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 22px;
	text-align: center;
}

.lobify-hotel-weather__condition-icon {
	color: var(--lobify-weather-icon-color, #fff);
	height: var(--lobify-weather-icon-size, 54px);
	line-height: 0;
	width: var(--lobify-weather-icon-size, 54px);
}

.lobify-hotel-weather__condition-svg {
	display: block;
	height: 100%;
	width: 100%;
}

.lobify-hotel-weather__condition-label {
	font-size: .92em;
	line-height: 1.15;
	margin-top: -1px;
	max-width: 150px;
}

.lobify-hotel-weather a.lobify-hotel-weather__attribution {
	bottom: 5px;
	color: currentColor !important;
	font-size: var(--lobify-weather-attribution-size, 6px) !important;
	font-weight: 500;
	left: 7px;
	letter-spacing: .01em;
	line-height: 1;
	opacity: .38;
	position: absolute;
	right: auto;
	text-decoration: none !important;
	z-index: 2;
}

.lobify-hotel-weather a.lobify-hotel-weather__attribution:hover,
.lobify-hotel-weather a.lobify-hotel-weather__attribution:focus {
	color: currentColor !important;
	opacity: .38;
	text-decoration: none !important;
}

/*
 * CSS-only motion keeps the widget light: no JavaScript and no animation
 * library. Motion changes subtly with the weather family.
 */
.lobify-hotel-weather__condition-icon--animated {
	animation: lobifyWeatherFloat 4.8s ease-in-out infinite;
	transform-origin: 50% 55%;
	will-change: transform;
}

.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--clear,
.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--fair {
	animation-name: lobifyWeatherGlow;
	animation-duration: 5.6s;
}

.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--fog {
	animation-name: lobifyWeatherDrift;
	animation-duration: 6.5s;
}

.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--rain,
.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--sleet,
.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--snow {
	animation-name: lobifyWeatherPrecipitation;
	animation-duration: 3.8s;
}

.lobify-hotel-weather__condition-icon--animated.lobify-hotel-weather__condition-icon--thunder {
	animation-name: lobifyWeatherThunder;
	animation-duration: 4.4s;
}

@keyframes lobifyWeatherFloat {
	0%, 100% { transform: translate3d(0, 0, 0); }
	50% { transform: translate3d(0, -3px, 0); }
}

@keyframes lobifyWeatherGlow {
	0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
	50% { transform: translate3d(0, -2px, 0) scale(1.045); }
}

@keyframes lobifyWeatherDrift {
	0%, 100% { transform: translate3d(-2px, 0, 0); }
	50% { transform: translate3d(3px, 0, 0); }
}

@keyframes lobifyWeatherPrecipitation {
	0%, 100% { transform: translate3d(0, -1px, 0); }
	50% { transform: translate3d(0, 2px, 0); }
}

@keyframes lobifyWeatherThunder {
	0%, 82%, 100% { transform: translate3d(0, 0, 0) scale(1); }
	88% { transform: translate3d(0, -1px, 0) scale(1.06); }
	93% { transform: translate3d(0, 0, 0) scale(.99); }
}

@media (prefers-reduced-motion: reduce) {
	.lobify-hotel-weather__condition-icon--animated {
		animation: none !important;
		transform: none !important;
	}
}

@media (max-width: 480px) {
	.lobify-hotel-weather {
		padding: 8px 15px 6px;
	}

	.lobify-hotel-weather__condition {
		padding-left: 14px;
	}

	.lobify-hotel-weather__condition-label {
		max-width: 115px;
	}
}


/* v1.3.24 — imágenes personalizadas para familias meteorológicas */
.lobify-hotel-weather__condition-custom {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.lobify-hotel-weather__pin--custom {
	display: block;
	object-fit: contain;
}
