.edg-openings {
	--edg-openings-color-border: oklch(0 0 0 / 10%);
	--edg-openings-color-cell-background-muted: oklch(0 0 0 / 2%);
	--edg-openings-color-today-number-background: oklch(.4928 .1867 263.74);
	--edg-openings-color-state-open: oklch(.98 .04 121.57);
	--edg-openings-color-state-soon: oklch(.97 .03 81.95);
	--edg-openings-color-state-closed: oklch(.95 .03 38.74);
	--edg-openings-color-state-restday: oklch(.96 .03 254.44);

	time {
		font-variant-numeric: tabular-nums;
	}
}

.edg-openings-today {
	padding: 1.125em var(--edg-wrapper-side-gap);
	background-color: var(--_edg-openings-today-background-color);
	border-width: 2px;
	border-color: oklch(from var(--_edg-openings-today-background-color) calc(l - .04) c h);
	font-style: italic;

	&,
	* {
		line-height: var(--edg-leading-sm);
	}

	&[data-edg-state="open"] {
		--_edg-openings-today-background-color: var(--edg-openings-color-state-open);
	}

	&[data-edg-state="soon"] {
		--_edg-openings-today-background-color: var(--edg-openings-color-state-soon);
	}

	&[data-edg-state="past"],
	&[data-edg-state="closed"] {
		--_edg-openings-today-background-color: var(--edg-openings-color-state-closed);
	}

	&[data-edg-state="restday"] {
		--_edg-openings-today-background-color: var(--edg-openings-color-state-restday);
	}

	> * {
		max-width: var(--edg-width-sm);
	}

	@media (width <= 991px) {
		margin-inline: calc(-1 * var(--edg-wrapper-side-gap));
		border-inline-width: 0;
	}

	@media (width > 991px) {
		max-width: var(--edg-width-sm);
		padding-inline: 1.625rem;
		border-radius: var(--edg-radius-md);
	}

	.edg-openings-today__main-line {
		color: var(--edg-color-text-emphasis);
		font-weight: 500;
	}

	.edg-openings-today__sub-line {
		margin-top: .5em;
		color: oklch(from var(--_edg-openings-today-background-color) calc(l - .5) c h);
		font-size: var(--edg-text-md);
	}
}

.edg-openings-next-7-days-wrap {
	container-type: inline-size;

	@media (width > 991px) {
		max-width: var(--edg-width-md);
	}

	.edg-openings-next-7-days {
		--_edg-openings-next-7-days-row-gap: 1rem;
		--_edg-openings-next-7-days-row-padding: var(--edg-card-padding-500);

		display: grid;
		gap: var(--_edg-openings-next-7-days-row-gap);
		padding: var(--_edg-openings-next-7-days-row-padding) 1.5rem;
		background-color: var(--edg-color-background-emphasis);

		@media (width <= 991px) {
			margin-inline: calc(-1 * var(--edg-wrapper-side-gap));
			padding-inline: 0;
		}

		@media (width > 991px) {
			border-radius: var(--edg-radius-lg);
			box-shadow: var(--edg-shadow-sm);
		}

		@container (width <= 600px) {
			--_edg-openings-next-7-days-row-gap: 1.375rem;
		}

		&,
		* {
			line-height: var(--edg-leading-sm);
		}

		.edg-openings-next-7-days__day-row {
			display: block;
			padding-inline: var(--_edg-openings-next-7-days-row-padding);

			@media (width <= 991px) {
				padding-inline: var(--edg-wrapper-side-gap);
			}

			&:not(:last-child) {
				border-bottom-width: 1px;
				border-style: dashed;
				border-color: var(--edg-color-border-emphasis);
				padding-bottom: var(--_edg-openings-next-7-days-row-gap);
			}

			&[data-edg-state="open"] {
				--_edg-openings-next-7-days-status-background-color: var(--edg-openings-color-state-open);
			}

			&[data-edg-state="closed"] {
				--_edg-openings-next-7-days-status-background-color: var(--edg-openings-color-state-closed);
			}

			&[data-edg-state="restday"] {
				--_edg-openings-next-7-days-status-background-color: var(--edg-openings-color-state-restday);
			}

			.edg-openings-next-7-days__day-row-wrap {
				> :first-child {
					font-style: italic;
				}

				@container (width > 600px) {
					display: grid;
					grid-template-columns: minmax(0, 1fr) auto;
					gap: 2.5rem;
					align-items: center;

					&:has(.edg-openings-next-7-days__day-row-meta) {
						align-items: start;
					}
				}

				.edg-openings-next-7-days__day-row-label {
					color: var(--edg-color-text-emphasis);
					font-weight: 500;
				}

				.edg-openings-next-7-days__day-row-status {
					color: oklch(from var(--_edg-openings-next-7-days-status-background-color) calc(l - .5) c h);
					background-color: var(--_edg-openings-next-7-days-status-background-color);
					font-size: var(--edg-text-sm);
					font-weight: 600;
					padding: .375em .75em;
					border-width: 1px;
					border-color: oklch(from var(--_edg-openings-next-7-days-status-background-color) calc(l - .04) c h);
					border-radius: 100vmax;

					@container (width <= 600px) {
						margin-top: .875em;
						border-radius: .5em;
					}
				}

				.edg-openings-next-7-days__day-row-meta {
					margin-top: .5em;
					color: var(--edg-color-text-muted);
					font-size: var(--edg-text-md);
				}
			}
		}
	}
}

.edg-openings-year-calendar {
	container-type: inline-size;
	display: grid;
	gap: 1.875rem;

	.edg-openings-year-calendar__month-block {
		--_edg-openings-year-calendar-month-block-radius: var(--edg-radius-lg);
		display: block;
		background-color: var(--edg-color-background-emphasis);
		border-radius: var(--_edg-openings-year-calendar-month-block-radius);
		border-width: 1px;
		border-color: var(--edg-openings-color-border);
		overflow: clip;

		.edg-openings-year-calendar__month-block-head {
			padding: 1.25rem clamp(1.5rem, .277vw + 1.4172rem, 1.625rem);
			border-bottom-width: 1px;
			border-color: var(--edg-openings-color-border);

			.edg-openings-year-calendar__month-block-title {
				max-width: var(--edg-width-md);
			}
		}

		.edg-openings-year-calendar__month-block-note {
			padding: clamp(1.375rem, .831vw + 1.1267rem, 1.75rem) clamp(1.5rem, 2.2161vw + .838rem, 2.5rem);
			color: var(--edg-color-text-emphasis);
			font-size: var(--edg-text-xs);
			font-weight: 500;
			font-style: italic;
			text-transform: uppercase;

			> p {
				max-width: var(--edg-width-sm);

				&,
				* {
					line-height: var(--edg-leading-sm);
				}

				&::before {
					content: "— ";
				}

				&::after {
					content: " —";
				}
			}
		}

		.edg-openings-year-calendar__month-block-calendar-wrap {
			max-width: 100cqw;
			overflow-x: auto;

			> div {
				min-width: 1000px;

				.edg-openings-year-calendar__month-block-calendar {
					&,
					* {
						line-height: var(--edg-leading-sm);
					}

					th {
						padding: .5rem;
						border-bottom-width: 1px;
						border-color: var(--edg-openings-color-border);
						color: var(--edg-color-text-muted);
						background-color: var(--edg-openings-color-cell-background-muted);
						text-align: center;
						font-size: .75rem;
						font-weight: 500;
						text-transform: uppercase;
						letter-spacing: -.02em;
					}

					td {
						--_edg-openings-year-calendar-month-block-day-cell-padding: .5rem;
						padding: var(--_edg-openings-year-calendar-month-block-day-cell-padding);
						border-right-width: 1px;
						border-bottom-width: 1px;
						border-color: var(--edg-openings-color-border);
						vertical-align: top;

						&:last-child {
							border-right-width: 0;
						}

						&[aria-hidden="true"] {
							background-color: var(--edg-openings-color-cell-background-muted);
						}

						.edg-openings-year-calendar__month-block-calendar-day-number {
							margin-inline: auto;
							width: 1.875rem;
							aspect-ratio: 1;
							border-radius: 50%;
							text-align: center;
							align-content: center;
							color: var(--edg-color-text-emphasis);
							font-size: .75rem;
							font-weight: 700;
							font-variant-numeric: tabular-nums;

							&,
							* {
								line-height: 1;
							}
						}

						&[data-edg-is-today] {
							.edg-openings-year-calendar__month-block-calendar-day-number {
								color: var(--edg-color-white);
								background-color: var(--edg-openings-color-today-number-background);
								color-scheme: dark;
							}
						}

						.edg-openings-year-calendar__month-block-calendar-day-status {
							margin-top: .5rem;
							padding: .375em .75em;
							border-width: 1px;
							border-color: oklch(from var(--_edg-openings-year-calendar-day-status-background-color) calc(l - .04) c h);
							border-radius: .5em;
							color: oklch(from var(--_edg-openings-year-calendar-day-status-background-color) calc(l - .5) c h);
							background-color: var(--_edg-openings-year-calendar-day-status-background-color);
							font-size: .8125rem;
							font-weight: 600;
						}

						&[data-edg-state="open"] {
							--_edg-openings-year-calendar-day-status-background-color: var(--edg-openings-color-state-open);
						}

						&[data-edg-state="closed"] {
							--_edg-openings-year-calendar-day-status-background-color: var(--edg-openings-color-state-closed);
						}

						&[data-edg-state="restday"] {
							--_edg-openings-year-calendar-day-status-background-color: var(--edg-openings-color-state-restday);
						}

						.edg-openings-year-calendar__month-block-calendar-day-note {
							margin-top: .375rem;
							color: var(--edg-color-text-muted);
							font-size: .8125rem;
						}
					}

					tr:last-child {
						td {
							border-bottom-width: 0;

							&:not(:has(.edg-openings-year-calendar__month-block-calendar-day-note)) {
								&:first-child {
									.edg-openings-year-calendar__month-block-calendar-day-status {
										border-bottom-left-radius: calc(var(--_edg-openings-year-calendar-month-block-radius) - var(--_edg-openings-year-calendar-month-block-day-cell-padding));
									}
								}

								&:last-child {
									.edg-openings-year-calendar__month-block-calendar-day-status {
										border-bottom-right-radius: calc(var(--_edg-openings-year-calendar-month-block-radius) - var(--_edg-openings-year-calendar-month-block-day-cell-padding));
									}
								}
							}
						}
					}
				}
			}
		}
	}
}