.sai-calendars {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	--sai-cal-border: rgba(0,0,0,0.10);
	--sai-cal-muted: rgba(0,0,0,0.65);
	--sai-cal-surface: rgba(0,0,0,0.03);
	--sai-cal-header-accent: var(--wp--preset--color--orange, var(--wp--preset--color--accent, currentColor));
}
.sai-calendars * { box-sizing: inherit; }

/* When used inside block themes that support full/wide alignments */
.sai-calendars.alignfull,
.sai-calendars.alignwide {
	max-width: none;
}

.sai-calendars__bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 12px;
	align-items: center;
	margin: 12px 0;
	padding: 12px;
	border: 1px solid var(--sai-cal-border);
	border-radius: 10px;
	background: rgba(0,0,0,0.02);
	background: color-mix(in srgb, var(--sai-cal-header-accent) 14%, transparent);
}
.sai-calendars__bar-left { justify-self: start; }
.sai-calendars__nav { justify-self: center; display: flex; gap: 8px; flex-wrap: wrap; }
.sai-calendars__bar-right { justify-self: end; }
.sai-calendars__controls { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.sai-calendars__label select { margin-left: 6px; }

.sai-calendars__title { font-size: 18px; font-weight: 700; margin: 10px 0 14px; }

.sai-calendars__table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
	border: 1px solid var(--sai-cal-border);
	border-radius: 12px;
	overflow: hidden;
}
.sai-calendars__table th,
.sai-calendars__table td {
	border-right: 1px solid var(--sai-cal-border);
	border-bottom: 1px solid var(--sai-cal-border);
	vertical-align: top;
	padding: 10px;
}
.sai-calendars__table th:last-child,
.sai-calendars__table td:last-child { border-right: 0; }
.sai-calendars__table tr:last-child td { border-bottom: 0; }

.sai-calendars__table thead th {
	font-weight: 700;
	background: rgba(0,0,0,0.02);
	background: color-mix(in srgb, var(--sai-cal-header-accent) 18%, transparent);
}

.sai-calendars__cell { padding: 10px; }

/* Square day boxes (month/week) */
.sai-calendars__cell-inner {
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: auto;
	padding: 8px;
	border-radius: 10px;
	background: var(--sai-cal-surface);
}

.sai-calendars__cell-inner.is-today {
	border: 2px solid rgba(0,0,0,0.35);
	border: 2px solid color-mix(in srgb, var(--sai-cal-header-accent) 70%, rgba(0,0,0,0.35));
	border-radius: 6px;
	background: rgba(0,0,0,0.06);
	background: color-mix(in srgb, var(--sai-cal-header-accent) 10%, transparent);
}

.sai-calendars__day { font-weight: 700; margin-bottom: 8px; }

.sai-calendars__event {
	margin: 4px 0;
	padding: 4px 6px;
	border-radius: 4px;
	background: rgba(0,0,0,0.04);
	border-left: 4px solid var(--sai-cal-color, rgba(0,0,0,0.18));
}
.sai-calendars__event {
	background: color-mix(in srgb, var(--sai-cal-color, rgba(0,0,0,0.14)) 12%, transparent);
}
.sai-calendars__event-time { font-weight: 600; }

.sai-calendars__empty { color: var(--sai-cal-muted); font-size: 12px; padding: 6px 0; }

.sai-calendars__list-day { border: 1px solid var(--sai-cal-border); border-radius: 10px; padding: 12px; margin: 12px 0; background: var(--sai-cal-surface); }
.sai-calendars__list-day-title { font-weight: 600; margin-bottom: 8px; }

.sai-calendars__legend { margin: 10px 0 0; padding: 10px 12px; border: 1px solid var(--sai-cal-border); border-radius: 10px; background: rgba(0,0,0,0.02); }
.sai-calendars__legend-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.sai-calendars__legend-title { font-weight: 700; margin: 0; }
.sai-calendars__legend-items { display: flex; flex-wrap: wrap; gap: 10px; }
.sai-calendars__legend-item { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.sai-calendars__legend-checkbox { margin: 0; }
.sai-calendars__legend-swatch { width: 10px; height: 10px; background: var(--sai-cal-color, rgba(0,0,0,0.18)); border-radius: 2px; display: inline-block; }
.sai-calendars__legend-label { line-height: 1.2; }
.sai-calendars__legend-cat { opacity: 0.7; font-size: 12px; }

.sai-calendars__subscribe-button { white-space: nowrap; }
.sai-calendars__subscribe-webcal { font-weight: 600; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }

.sai-calendars__subscribe { position: relative; display: inline-flex; align-items: center; }
.sai-calendars__subscribe-menu {
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	min-width: 220px;
	border: 1px solid var(--sai-cal-border);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0,0,0,0.12);
	padding: 6px;
	z-index: 9999;
}
.sai-calendars__subscribe-item {
	display: block;
	padding: 8px 10px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 600;
}
.sai-calendars__subscribe-item:hover,
.sai-calendars__subscribe-item:focus {
	background: rgba(0,0,0,0.06);
	outline: none;
}

@media (max-width: 700px) {
	.sai-calendars__bar {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.sai-calendars__bar-left,
	.sai-calendars__bar-right { width: 100%; }
	.sai-calendars__bar-right { display: flex; justify-content: center; }
}