/**
 * 営業カレンダー（[picico_calendar] / [picico_calendar_days]）
 *
 * 2026 年 9 月のお知らせ（手書きの HTML）と同じ形にしてある:
 * 7 列・曜日の帯・日付の下に小さく状態・臨時休業は下線つき・凡例は 4 種。
 * 色はテーマの tokens.css から取る（無いときの値は tokens.css と同じ）。
 * テーマの本文の表（:where(.entry-content) table）は specificity 0 なので、ここで上書きできる。
 */

.pc-calendar {
	margin: var(--picico-space-xl, 2rem) 0 var(--picico-space-sm, 0.75rem);
}

.pc-calendar__title {
	margin: 0 0 var(--picico-space-sm, 0.75rem);
	color: var(--picico-color-text, #1c2529);
	font-size: var(--picico-font-size-lg, 1.125rem);
	font-weight: 700;
}

/* 凡例 */
.pc-calendar__legend {
	display: flex;
	flex-wrap: wrap;
	gap: var(--picico-space-xs, 0.5rem) var(--picico-space-md, 1rem);
	margin: 0 0 var(--picico-space-md, 1rem);
	padding: 0;
	list-style: none;
	color: var(--picico-color-text, #1c2529);
	font-size: var(--picico-font-size-xs, 0.75rem);
}

.pc-calendar__legend-item {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	margin: 0;
}

.pc-calendar__legend-item::before {
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 1.5px solid var(--picico-color-support, #1f6b58);
	border-radius: 3px;
	background: var(--picico-color-support-pale, #e4f0eb);
}

.pc-calendar__legend-item--closed::before {
	border-color: var(--picico-color-accent, #e8703a);
	background: var(--picico-color-accent-pale, #fdeee9);
}

.pc-calendar__legend-item--holiday::before {
	border: 1px solid var(--picico-color-line, #c9dce2);
	background: var(--picico-color-surface-alt, #eef5f7);
}

/* 本体 */
.pc-calendar .pc-calendar__table {
	display: table;
	width: 100%;
	max-width: 100%;
	margin: 0;
	overflow: hidden;
	border: 1.5px solid var(--picico-color-line, #c9dce2);
	border-radius: var(--picico-radius-md, 12px);
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
	box-shadow: 0 4px 16px rgb(28 37 41 / 7%);
	font-size: inherit;
}

.pc-calendar .pc-calendar__wd {
	min-width: 0;
	padding: 8px 2px;
	border: 0;
	background: var(--picico-color-support, #1f6b58);
	color: var(--picico-color-surface, #fff);
	font-size: var(--picico-font-size-xs, 0.75rem);
	font-weight: 700;
	text-align: center;
}

.pc-calendar .pc-calendar__wd--weekend {
	color: rgb(255 255 255 / 78%);
}

.pc-calendar .pc-calendar__day {
	height: 52px;
	min-width: 0;
	padding: 8px 2px;
	border: 0;
	border-top: 1px solid var(--picico-color-line, #c9dce2);
	border-right: 1px solid var(--picico-color-line, #c9dce2);
	background: var(--picico-color-support-pale, #e4f0eb);
	text-align: center;
	vertical-align: top;
}

.pc-calendar .pc-calendar__day:last-child {
	border-right: 0;
}

/* 本文の表の縞模様（tbody tr:nth-child(even)）を消す */
.pc-calendar .pc-calendar__table tbody tr {
	background: none;
}

.pc-calendar__num {
	display: block;
	color: var(--picico-color-text, #1c2529);
	font-size: 0.9rem;
	font-weight: 700;
	line-height: 1.4;
	font-variant-numeric: tabular-nums;
}

.pc-calendar__label {
	display: block;
	margin-top: 2px;
	color: var(--picico-color-support, #1f6b58);
	font-size: 0.6rem;
	font-weight: 700;
	line-height: 1.25;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.pc-calendar .pc-calendar__day--closed {
	border-bottom: 2px solid var(--picico-color-accent, #e8703a);
	background: var(--picico-color-accent-pale, #fdeee9);
}

.pc-calendar__day--closed .pc-calendar__num,
.pc-calendar__day--closed .pc-calendar__label {
	color: var(--picico-color-accent-dark, #c2551f);
}

.pc-calendar__day--open .pc-calendar__label {
	color: var(--picico-color-support-dark, #154c3f);
}

.pc-calendar .pc-calendar__day--holiday {
	background: var(--picico-color-surface-alt, #eef5f7);
}

.pc-calendar__day--holiday .pc-calendar__num,
.pc-calendar__day--holiday .pc-calendar__label {
	color: var(--picico-color-text-muted, #4f5d61);
	font-weight: 400;
}

.pc-calendar .pc-calendar__day--blank {
	background: var(--picico-color-surface, #fff);
}

.pc-calendar__note {
	margin: var(--picico-space-sm, 0.75rem) 0 0;
	color: var(--picico-color-text-muted, #4f5d61);
	font-size: var(--picico-font-size-xs, 0.75rem);
	line-height: 1.7;
}

/* 「最新の空き状況を確認する」の箱 */
.pc-calendar__notice {
	margin: var(--picico-space-lg, 1.5rem) 0 0;
	padding: var(--picico-space-lg, 1.5rem) var(--picico-space-md, 1rem);
	border: 1.5px solid var(--picico-color-support, #1f6b58);
	border-radius: var(--picico-radius-md, 12px);
	background: var(--picico-color-support-pale, #e4f0eb);
	text-align: center;
}

.pc-calendar__notice-title {
	margin: 0 0 var(--picico-space-xs, 0.5rem);
	color: var(--picico-color-support-dark, #154c3f);
	font-size: var(--picico-font-size-md, 1rem);
	font-weight: 700;
}

.pc-calendar__notice-text {
	margin: 0 0 var(--picico-space-md, 1rem);
	color: var(--picico-color-text, #1c2529);
	font-size: var(--picico-font-size-sm, 0.875rem);
	line-height: 1.85;
	text-align: start;
}

.pc-calendar .pc-calendar__notice-btn {
	width: 100%;
	max-width: 22rem;
	justify-content: center;
}

/* [picico_calendar_days format="table"] の札 */
.pc-calendar-badge {
	display: inline-block;
	padding: 2px 12px;
	border: 1.5px solid var(--picico-color-support, #1f6b58);
	border-radius: 100px;
	background: var(--picico-color-support-pale, #e4f0eb);
	color: var(--picico-color-support-dark, #154c3f);
	font-size: var(--picico-font-size-xs, 0.75rem);
	font-weight: 700;
	white-space: nowrap;
}

.pc-calendar-badge--closed {
	border-color: var(--picico-color-accent, #e8703a);
	background: var(--picico-color-accent-pale, #fdeee9);
	color: var(--picico-color-accent-dark, #c2551f);
}

/* [picico_calendar_days format="list"] */
.pc-calendar-days {
	display: flex;
	flex-wrap: wrap;
	gap: var(--picico-space-xs, 0.5rem);
	margin: var(--picico-space-sm, 0.75rem) 0;
	padding: 0;
	list-style: none;
}

.pc-calendar-days__item {
	margin: 0;
	padding: 4px 14px;
	border: 1.5px solid var(--picico-color-support, #1f6b58);
	border-radius: 100px;
	background: var(--picico-color-support-pale, #e4f0eb);
	color: var(--picico-color-support-dark, #154c3f);
	font-size: var(--picico-font-size-sm, 0.875rem);
	font-weight: 700;
}

.pc-calendar-days__item--closed {
	border-color: var(--picico-color-accent, #e8703a);
	background: var(--picico-color-accent-pale, #fdeee9);
	color: var(--picico-color-accent-dark, #c2551f);
}

/* 幅 400px 未満: 1 マスは 40px 前後。「臨時休業」を 1 行に収め、★は上の行に分ける。 */
@media (max-width: 24.99rem) {
	.pc-calendar__label {
		font-size: 0.55rem;
		letter-spacing: -0.04em;
		white-space: nowrap;
	}

	.pc-calendar__star {
		display: block;
	}
}

@media (min-width: 48rem) {
	.pc-calendar .pc-calendar__day {
		height: 64px;
	}

	.pc-calendar__num {
		font-size: 1rem;
	}

	.pc-calendar__label {
		font-size: 0.68rem;
	}
}
