/*
Theme Name: Brossard
Style for: Snow info
*/

.snow-info-box {
	display: inline-block;
	color: #fff;
	font-weight: 300;
	max-width: 25rem;
	width: auto;
	padding: 0.75rem 1rem;
	border-radius: 0.5rem 0 0 0.5rem;
	transition: all 0.3s ease-in-out;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
}

/* État réduit - montre seulement l'icône */
.snow-info-box.scrolled-down {
	padding: 0.75rem;
	max-width: 3.5rem;
	width: 3.5rem;
	min-width: 3.5rem;
}

.snow-info-box.scrolled-down .snow-info-title {
	opacity: 0;
	width: 0;
	overflow: hidden;
	padding: 0;
	margin: 0;
	max-width: 0;
}

.snow-info-box.scrolled-down .snow-info-heading {
	justify-content: center;
}

.snow-info-box.scrolled-down .snow-info-heading svg {
	margin: 0;
	top: 0;
}

.snow-info-box.scrolled-down .snow-info-heading span {
	padding-left: 0;
	max-width: 0;
}

.snow-info-box p {
	margin-bottom: 1rem;
}

.snow-info-box.closed {
	cursor: pointer;
}

.snow-info-box.closed .snow-info-title,
.snow-info-box.closed .snow-info-close,
.snow-info-box.closed .snow-info-content,
.snow-info-box.closed .snow-info-link,
.snow-info-box.closed .snow-info-date {
	display: none;
}

.snow-info-box.closed .snow-info-title-gen {
	display: inline-block;
}
.snow-info-box:not(.closed) .snow-info-title-gen {
	display: none;
}

.snow-info-box .snow-info-close {
	cursor: pointer;
	float: right;
}

.snow-info-box .snow-info-heading {
	display: flex;
	align-items: center;
	font-size: 1.125rem;
	font-weight: 500;
	margin: 0;
	padding: 0;
	line-height: 1.5;
}
.snow-info-box.closed .snow-info-heading,
.snow-info-box .snow-info-date {
	margin-bottom: 0;
}
.snow-info-box .snow-info-heading svg {
	position: relative;
	top: -0.125rem;
}
.snow-info-box .snow-info-heading span {
	padding-left: 0.5rem;
}

.snow-info-box a {
	color: #fff;
	font-weight: 500;
	text-decoration: underline;
}

.snow-info-box.parking-allowed {
	background: #2f9820;
}

.snow-info-box.parking-prohibited {
	background: #d42a34;
}

/* Comportement mobile */
@media (max-width: 991.98px) {
	.snow-info-box {
		position: fixed !important;
		right: 0px !important;
		left: auto !important;
		bottom: auto !important;
		z-index: 9999 !important;
		margin: 0 !important;
		transform: none !important;
	}

	/* État par défaut en mobile : réduit (icône seulement) */
	.snow-info-box {
		padding: 0.75rem;
		max-width: 3.5rem;
		width: 3.5rem;
		min-width: 3.5rem;
		cursor: pointer;
	}

	.snow-info-box .snow-info-title {
		opacity: 0;
		width: 0;
		overflow: hidden;
		padding: 0;
		margin: 0;
		max-width: 0;
		transition: opacity 0.3s ease-in-out, width 0.3s ease-in-out;
	}

	.snow-info-box .snow-info-heading {
		justify-content: center;
	}

	.snow-info-box .snow-info-heading svg {
		margin: 0;
		top: 0;
	}

	.snow-info-box .snow-info-heading span {
		padding-left: 0;
		max-width: 0;
	}

	/* État ouvert en mobile (quand les bannières sont visibles) */
	.snow-info-box.mobile-open {
		max-width: 25rem;
		width: auto;
		padding: 0.75rem 1rem;
	}

	.snow-info-box.mobile-open .snow-info-title {
		opacity: 1;
		width: auto;
		overflow: visible;
		padding: 0;
		margin: 0;
		max-width: none;
	}

	.snow-info-box.mobile-open .snow-info-heading {
		justify-content: flex-start;
	}

	.snow-info-box.mobile-open .snow-info-heading svg {
		margin-right: 0.5rem;
		top: -0.125rem;
	}

	.snow-info-box.mobile-open .snow-info-heading span {
		padding-left: 0.5rem;
		max-width: none;
	}

	/* État réduit en mobile (quand les bannières ne sont plus visibles) */
	.snow-info-box.scrolled-down {
		padding: 0.75rem;
		max-width: 3.5rem;
		width: 3.5rem;
		min-width: 3.5rem;
	}

	.snow-info-box.scrolled-down .snow-info-title {
		opacity: 0;
		width: 0;
		overflow: hidden;
		padding: 0;
		margin: 0;
		max-width: 0;
	}

	.snow-info-box.scrolled-down .snow-info-heading {
		justify-content: center;
	}

	.snow-info-box.scrolled-down .snow-info-heading svg {
		margin: 0;
		top: 0;
	}

	.snow-info-box.scrolled-down .snow-info-heading span {
		padding-left: 0;
		max-width: 0;
	}
}

/* Comportement mobile : fermé par défaut (affiche seulement l'icône P) */
@media (max-width: 991.98px) {
	.snow-info-box {
		position: fixed !important;
		right: 0px !important;
		z-index: 9999 !important;
		left: auto !important;
		bottom: auto !important;
		margin: 0 !important;
		padding: 0.75rem;
		max-width: 3.5rem;
		width: 3.5rem;
		min-width: 3.5rem;
		cursor: pointer;
	}

	.snow-info-box .snow-info-title {
		opacity: 0;
		width: 0;
		overflow: hidden;
		padding: 0;
		margin: 0;
		max-width: 0;
		transition: opacity 0.3s ease-in-out, width 0.3s ease-in-out;
	}

	.snow-info-box .snow-info-heading {
		justify-content: center;
	}

	.snow-info-box .snow-info-heading svg {
		margin: 0;
		top: 0;
	}

	.snow-info-box .snow-info-heading span {
		padding-left: 0;
		max-width: 0;
	}

	/* État ouvert en mobile */
	.snow-info-box.mobile-open {
		max-width: 25rem;
		width: auto;
		padding: 0.75rem 1rem;
	}

	.snow-info-box.mobile-open .snow-info-title {
		opacity: 1;
		width: auto;
		overflow: visible;
		padding: 0;
		margin: 0;
		max-width: none;
	}

	.snow-info-box.mobile-open .snow-info-heading {
		justify-content: flex-start;
	}

	.snow-info-box.mobile-open .snow-info-heading svg {
		margin-right: 0.5rem;
		top: -0.125rem;
	}

	.snow-info-box.mobile-open .snow-info-heading span {
		padding-left: 0.5rem;
		max-width: none;
	}
}