/*
 * PRIMECUT OpenStatus — compact inline status line.
 * Namespaced under .primecut-os to avoid collisions with theme/page-builder CSS.
 * No background, border, padding, or fixed width by default: this is designed
 * to sit as a subordinate second line beneath a phone number or heading.
 */

.primecut-os {
	--primecut-os-dot-size: 7px;
	--primecut-os-gap: 6px;
	--primecut-os-color-open: #2e9e5b;
	--primecut-os-color-closing-soon: #d69e2e;
	--primecut-os-color-closed: #c53030;
	--primecut-os-color-unavailable: #9aa0a6;

	display: inline-flex;
	align-items: center;
	gap: var(--primecut-os-gap);
	max-width: 100%;
	font: inherit;
	color: inherit;
	line-height: inherit;
	vertical-align: middle;
}

.primecut-os--stacked {
	flex-direction: column;
	align-items: flex-start;
	gap: calc(var(--primecut-os-gap) / 2);
}

.primecut-os--align-center {
	justify-content: center;
	text-align: center;
}

.primecut-os--align-center.primecut-os--stacked {
	align-items: center;
}

.primecut-os--align-right {
	justify-content: flex-end;
	text-align: right;
}

.primecut-os--align-right.primecut-os--stacked {
	align-items: flex-end;
}

.primecut-os__dot {
	flex: 0 0 auto;
	width: var(--primecut-os-dot-size);
	height: var(--primecut-os-dot-size);
	border-radius: 50%;
	background: var(--primecut-os-color-unavailable);
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	transition: background-color 0.3s ease;
}

.primecut-os[data-state="open"] .primecut-os__dot {
	background: var(--primecut-os-color-open);
}

.primecut-os[data-state="closing_soon"] .primecut-os__dot {
	background: var(--primecut-os-color-closing-soon);
}

.primecut-os[data-state="closed"] .primecut-os__dot {
	background: var(--primecut-os-color-closed);
}

.primecut-os[data-state="unavailable"] .primecut-os__dot {
	background: var(--primecut-os-color-unavailable);
}

.primecut-os__message {
	min-width: 0;
	overflow-wrap: anywhere;
}

/* Restrained glow + pulse, opt-in via --pulse modifier, open state only. */
.primecut-os--pulse[data-state="open"] .primecut-os__dot {
	box-shadow: 0 0 0 0 rgba(46, 158, 91, 0.55);
	animation: primecut-os-pulse 2.4s ease-out infinite;
}

.primecut-os--pulse[data-state="open"] .primecut-os__dot {
	box-shadow: 0 0 0 0 color-mix(in srgb, var(--primecut-os-color-open) 55%, transparent);
}

@keyframes primecut-os-pulse {
	0% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--primecut-os-color-open) 45%, transparent);
	}
	70% {
		box-shadow: 0 0 0 6px color-mix(in srgb, var(--primecut-os-color-open) 0%, transparent);
	}
	100% {
		box-shadow: 0 0 0 0 color-mix(in srgb, var(--primecut-os-color-open) 0%, transparent);
	}
}

@media (prefers-reduced-motion: reduce) {
	.primecut-os--pulse .primecut-os__dot {
		animation: none !important;
		box-shadow: none !important;
	}
	.primecut-os__dot {
		transition: none;
	}
}