/**
 * RMD Opening Hours – front-end styles.
 *
 * Override the custom properties in your theme to restyle without touching
 * selectors, e.g. `.rmd-oh { --rmd-oh-today-bg: #fff3cd; }`.
 *
 * Elements:
 *   .rmd-oh                      wrapper (.rmd-oh--table | --list | --compact)
 *   .rmd-oh__title               optional set name
 *   .rmd-oh__row                 one row (.is-today, .is-closed, .is-exception, .is-holiday, .is-period)
 *   .rmd-oh__day / __hours / __slot / __closed / __note
 *   .rmd-oh-status               open-now indicator (.is-open | .is-closed), __dot, __text
 *   .rmd-oh-notices              notice container (.has-visible)
 *   .rmd-oh-notice               one notice (.rmd-oh-notice--closed | --daily | --weekly, .is-running); unstyled by default,
 *                                add the block style "Box" (.is-style-box on the container) for a highlighted box
 *   .rmd-oh-notice__name / __start / __end / __hours / __note / __set   placeholder values inside the text
 */

.rmd-oh,
.rmd-oh-status,
.rmd-oh-notices {
	--rmd-oh-gap: 0.25em 1em;
	--rmd-oh-row-padding: 0.35em 0.75em;
	--rmd-oh-border: 1px solid rgba(0, 0, 0, 0.1);
	--rmd-oh-today-bg: rgba(0, 0, 0, 0.05);
	--rmd-oh-today-weight: 700;
	--rmd-oh-closed-opacity: 0.7;
	--rmd-oh-note-size: 0.85em;
	--rmd-oh-note-opacity: 0.75;
	--rmd-oh-exception-color: inherit;
	--rmd-oh-open-color: #1e7e34;
	--rmd-oh-closed-color: #b02a37;
	--rmd-oh-notice-bg: #fff8e1;
	--rmd-oh-notice-color: inherit;
	--rmd-oh-notice-border: 1px solid #f0d78c;
	--rmd-oh-notice-radius: 4px;
	--rmd-oh-notice-padding: 0.75em 2.5em 0.75em 1em;
}

/* Table layout */
.rmd-oh__table {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}

.rmd-oh__table th,
.rmd-oh__table td {
	padding: var(--rmd-oh-row-padding);
	border: 0;
	border-bottom: var(--rmd-oh-border);
	text-align: left;
	vertical-align: top;
	font-weight: inherit;
}

.rmd-oh__table tr:last-child th,
.rmd-oh__table tr:last-child td {
	border-bottom: 0;
}

.rmd-oh__table .rmd-oh__day {
	white-space: nowrap;
	padding-right: 1.5em;
}

.rmd-oh--table .rmd-oh__slot {
	display: block;
}

/* List layout */
.rmd-oh__list {
	margin: 0;
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: var(--rmd-oh-gap);
}

.rmd-oh__list .rmd-oh__row {
	display: contents;
}

.rmd-oh__list dt,
.rmd-oh__list dd {
	margin: 0;
}

.rmd-oh--list .rmd-oh__slot {
	display: block;
}

/* Compact layout */
.rmd-oh__compact {
	margin: 0;
}

.rmd-oh__compact .rmd-oh__day {
	font-weight: 600;
}

/* Shared row states */
.rmd-oh__row.is-today,
.rmd-oh__list .rmd-oh__row.is-today > * {
	background: var(--rmd-oh-today-bg);
	font-weight: var(--rmd-oh-today-weight);
}

.rmd-oh__row.is-exception .rmd-oh__hours {
	color: var(--rmd-oh-exception-color);
}

.rmd-oh__closed {
	opacity: var(--rmd-oh-closed-opacity);
}

.rmd-oh__note {
	display: block;
	font-size: var(--rmd-oh-note-size);
	opacity: var(--rmd-oh-note-opacity);
}

.rmd-oh--compact .rmd-oh__note {
	display: inline;
}

.rmd-oh__title {
	margin: 0 0 0.5em;
	font-weight: 700;
}

.rmd-oh--missing {
	padding: 0.5em 1em;
	border: 1px dashed currentcolor;
	opacity: 0.7;
}

/* Open-now status */
.rmd-oh-status {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	line-height: 1.4;
}

.rmd-oh-status__dot {
	width: 0.7em;
	height: 0.7em;
	border-radius: 50%;
	background: currentcolor;
	flex: 0 0 auto;
}

.rmd-oh-status.is-open .rmd-oh-status__dot {
	background: var(--rmd-oh-open-color);
	box-shadow: 0 0 0 0.2em color-mix(in srgb, var(--rmd-oh-open-color) 20%, transparent);
}

.rmd-oh-status.is-closed .rmd-oh-status__dot {
	background: var(--rmd-oh-closed-color);
}

/* Notices */
.rmd-oh-notices:empty,
.rmd-oh-notices:not(.has-visible):not(:has(.rmd-oh-notice:not([hidden]))) {
	display: none;
}

.rmd-oh-notice {
	position: relative;
	margin: 0 0 0.75em;
}

/* Optional "Box" block style (class is-style-box on the block or shortcode class="is-style-box") */
.is-style-box .rmd-oh-notice {
	padding: var(--rmd-oh-notice-padding);
	background: var(--rmd-oh-notice-bg);
	color: var(--rmd-oh-notice-color);
	border: var(--rmd-oh-notice-border);
	border-radius: var(--rmd-oh-notice-radius);
}

.rmd-oh-notice[hidden] {
	display: none;
}

.rmd-oh-notice:last-child {
	margin-bottom: 0;
}

.rmd-oh-notice__text > :last-child {
	margin-bottom: 0;
}

.rmd-oh-notice__dismiss {
	position: absolute;
	top: 0.35em;
	right: 0.5em;
	padding: 0 0.3em;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	font-size: 1.4em;
	line-height: 1;
	cursor: pointer;
	opacity: 0.6;
}

.rmd-oh-notice__dismiss:hover,
.rmd-oh-notice__dismiss:focus-visible {
	opacity: 1;
}

@media (prefers-reduced-motion: no-preference) {

	.rmd-oh-status.is-open .rmd-oh-status__dot {
		animation: rmd-oh-pulse 2.4s ease-in-out infinite;
	}

	@keyframes rmd-oh-pulse {

		50% {
			box-shadow: 0 0 0 0.35em color-mix(in srgb, var(--rmd-oh-open-color) 10%, transparent);
		}
	}
}