/* =========================================================
 * Hyper Custom Hours — aviso de horário especial próximo
 *
 * Cores da marca:
 *   - Verde Hyper (#6ECEB2) — box do single store (acolhedor,
 *     sem competir com os destaques vermelhos da página).
 *   - Vermelho Hyper (#E5554F) — pill do listing/info window
 *     do mapa (alta visibilidade no card lotado de info).
 *
 * Variantes:
 *   .hch-notice          — box detalhado (single store page) — VERDE
 *   .hch-pill            — pill compacta (listing card)      — VERMELHO
 *   .hch-pill--iw        — pill ainda mais enxuta (info window) — VERMELHO
 * ========================================================= */

:root {
	--hch-coral:       #DD5942;
	--hch-coral-soft:  #FBF0ED;
	--hch-coral-line:  rgba(221, 89, 66, 0.30);
	--hch-ink:         #231F20;
	--hch-red:         #DD5942;
	--hch-red-dark:    #b8472f;
}

/* BOX COMPACTO — CORAL Kingdom (single store page) -------- */
.hch-notice {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 12px;
	margin: 0 0 12px;
	background: var(--hch-coral-soft);
	border: 1px solid var(--hch-coral-line);
	border-radius: 6px;
	color: var(--hch-ink);
	font-size: 12.5px;
	line-height: 1.4;
	font-family: inherit;
	max-width: 100%;
}

.hch-notice__icon {
	flex-shrink: 0;
	color: var(--hch-coral);
}

.hch-notice__text {
	min-width: 0;
}

.hch-notice__text strong {
	font-weight: 700;
	color: var(--hch-ink);
}

.hch-notice__sep {
	opacity: 0.45;
	margin: 0 1px;
}

/* PILL — VERMELHO + BRANCO (listing card) ----------------- */
.hch-pill {
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 5px;
	padding: 3px 9px 3px 7px;
	margin: 6px 0 8px;
	border-radius: 999px;
	background: var(--hch-red);
	color: #ffffff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.3;
	border: 1px solid var(--hch-red-dark);
	white-space: nowrap;
	cursor: default;
	width: max-content;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hch-pill svg {
	flex-shrink: 0;
	color: #ffffff;
	display: inline-block;
}

/* PILL AINDA MAIS ENXUTA (info window do mapa) ------------ */
.hch-pill--iw {
	margin-top: 4px;
	padding: 2px 8px 2px 6px;
	font-size: 10.5px;
}

/* RESPONSIVO ----------------------------------------------- */
@media (max-width: 480px) {
	.hch-notice {
		display: flex;
		padding: 5px 8px;
		font-size: 12px;
	}
}