/* SCRF Menu Calendar - Frontend */

.scrf-mc-public {
	--scrf-mc-entree: #2c5f6a;
	--scrf-mc-protein: #c04a1e;
	--scrf-mc-side: #4a5d23;
	--scrf-mc-border: #d5d5d5;
	--scrf-mc-muted: #757575;
	--scrf-mc-text: #1d2327;
	--scrf-mc-bg: #ffffff;

	font-family: inherit;
	color: var(--scrf-mc-text);
	margin: 24px 0;
	position: relative;
}

.scrf-mc-public__toolbar {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}
.scrf-mc-public__title {
	margin: 0;
	flex: 1;
	font-size: 22px;
	font-weight: 700;
	text-align: center;
	min-width: 180px;
}
.scrf-mc-public__prev,
.scrf-mc-public__next {
	background: transparent;
	border: 1px solid var(--scrf-mc-border);
	border-radius: 4px;
	width: 36px;
	height: 36px;
	font-size: 16px;
	cursor: pointer;
	line-height: 1;
}
.scrf-mc-public__prev:hover,
.scrf-mc-public__next:hover { background: #f6f6f6; }

.scrf-mc-public__view-toggle {
	display: inline-flex;
	border: 1px solid var(--scrf-mc-border);
	border-radius: 4px;
	overflow: hidden;
}
.scrf-mc-public__view {
	background: #fff;
	border: 0;
	padding: 8px 14px;
	font-size: 13px;
	cursor: pointer;
	color: var(--scrf-mc-text);
}
.scrf-mc-public__view.is-active {
	background: var(--scrf-mc-text);
	color: #fff;
}

/* ===== Month grid ===== */
.scrf-mc-month {
	border: 1px solid var(--scrf-mc-border);
	background: var(--scrf-mc-bg);
}
.scrf-mc-month__dow {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	background: #fafafa;
	border-bottom: 1px solid var(--scrf-mc-border);
}
.scrf-mc-month__dow > div {
	padding: 10px 8px;
	text-align: center;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: var(--scrf-mc-muted);
}
.scrf-mc-week {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	grid-auto-rows: min-content;
	border-bottom: 1px solid var(--scrf-mc-border);
	position: relative;
	min-height: 100px;
	padding-bottom: 6px;
}
.scrf-mc-week:last-child { border-bottom: none; }

.scrf-mc-day-num {
	grid-row: 1;
	padding: 8px 10px 4px;
	font-size: 13px;
	color: var(--scrf-mc-text);
	border-right: 1px solid var(--scrf-mc-border);
	min-height: 32px;
}
.scrf-mc-day-num:last-child { border-right: none; }
.scrf-mc-day-num.is-other-month { color: #b8b8b8; }
.scrf-mc-day-num.is-past { color: #b0b0b0; }
.scrf-mc-day-num.is-today {
	font-weight: 700;
}
.scrf-mc-day-num.is-today > span {
	background: var(--scrf-mc-text);
	color: #fff;
	border-radius: 50%;
	width: 24px;
	height: 24px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.scrf-mc-strip {
	grid-row: auto;
	background: #888;
	color: #fff;
	font-size: 12px;
	font-weight: 500; /* unbold */
	padding: 3px 12px;
	margin: 2px 4px;
	border-radius: 999px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: default;
	line-height: 1.2;
	min-height: 22px;
	display: flex;
	align-items: center; /* vertical center */
	transition: filter .1s ease, opacity .15s ease;
}
.scrf-mc-strip:hover { filter: brightness(1.1); }
.scrf-mc-strip.is-past { opacity: .5; }
.scrf-mc-strip[data-category="entree"]  { background: var(--scrf-mc-entree); }
.scrf-mc-strip[data-category="protein"] { background: var(--scrf-mc-protein); }
.scrf-mc-strip[data-category="side"]    { background: var(--scrf-mc-side); }

/* ===== Agenda / list view ===== */
.scrf-mc-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.scrf-mc-list__day {
	border: 1px solid var(--scrf-mc-border);
	border-radius: 6px;
	padding: 16px;
	background: var(--scrf-mc-bg);
	transition: opacity .15s ease;
}
.scrf-mc-list__day.is-past { opacity: .6; }
.scrf-mc-list__day h4 {
	margin: 0 0 12px;
	font-size: 15px;
	color: var(--scrf-mc-muted);
	font-weight: 600;
	letter-spacing: .3px;
	text-transform: uppercase;
}
.scrf-mc-list__items {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.scrf-mc-list__item {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 10px;
	border-radius: 4px;
	background: #fafafa;
	text-decoration: none;
	color: var(--scrf-mc-text);
	transition: background .15s ease;
}
.scrf-mc-list__item:hover { background: #f0f0f0; }
.scrf-mc-list__thumb {
	width: 68px;
	height: 68px;
	flex: 0 0 68px;
	background: #ddd center/cover no-repeat;
	border-radius: 4px;
}
.scrf-mc-list__body { flex: 1; min-width: 0; }
.scrf-mc-list__cat {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .8px;
	color: #fff;
	padding: 2px 6px;
	border-radius: 2px;
	margin-bottom: 4px;
	background: #888;
}
.scrf-mc-list__cat[data-category="entree"]  { background: var(--scrf-mc-entree); }
.scrf-mc-list__cat[data-category="protein"] { background: var(--scrf-mc-protein); }
.scrf-mc-list__cat[data-category="side"]    { background: var(--scrf-mc-side); }
.scrf-mc-list__name {
	font-weight: 700;
	font-size: 15px;
	margin: 0 0 4px;
}
.scrf-mc-list__short {
	font-size: 13px;
	color: var(--scrf-mc-muted);
	line-height: 1.4;
}
.scrf-mc-list__run {
	font-size: 11px;
	color: var(--scrf-mc-muted);
	margin-top: 4px;
	text-transform: uppercase;
	letter-spacing: .4px;
}

/* List bottom navigation */
.scrf-mc-list__nav {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin-top: 8px;
}
.scrf-mc-list__nav button {
	background: transparent;
	border: 1px solid var(--scrf-mc-border);
	color: var(--scrf-mc-text);
	padding: 10px 16px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	transition: background .15s ease;
}
.scrf-mc-list__nav button:hover {
	background: #f6f6f6;
}

/* ===== Popover ===== */
.scrf-mc-public__popover {
	position: absolute;
	background: #fff;
	border: 1px solid var(--scrf-mc-border);
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(0,0,0,.15);
	padding: 14px;
	width: 280px;
	z-index: 100;
	pointer-events: auto;
}
.scrf-mc-public__popover[hidden] { display: none; }
.scrf-mc-public__popover .pop-thumb {
	width: 100%;
	height: 140px;
	background: #f0f0f0 center/cover no-repeat;
	border-radius: 4px;
	margin-bottom: 10px;
}
.scrf-mc-public__popover .pop-cat {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .8px;
	color: #fff;
	padding: 2px 6px;
	border-radius: 2px;
	background: #888;
}
.scrf-mc-public__popover .pop-cat[data-category="entree"]  { background: var(--scrf-mc-entree); }
.scrf-mc-public__popover .pop-cat[data-category="protein"] { background: var(--scrf-mc-protein); }
.scrf-mc-public__popover .pop-cat[data-category="side"]    { background: var(--scrf-mc-side); }
.scrf-mc-public__popover .pop-name {
	font-weight: 700;
	font-size: 16px;
	margin: 6px 0;
}
.scrf-mc-public__popover .pop-short {
	font-size: 13px;
	color: var(--scrf-mc-muted);
	line-height: 1.45;
}

.scrf-mc-public__stage p.scrf-mc-empty {
	text-align: center;
	color: var(--scrf-mc-muted);
	padding: 40px 20px;
	font-style: italic;
}

/* ===== Responsive: auto-switch below 768px ===== */
@media (max-width: 768px) {
	.scrf-mc-public[data-view-forced="month"] .scrf-mc-list,
	.scrf-mc-public[data-view-forced="list"]  .scrf-mc-month { display: none; }
	.scrf-mc-public__view-toggle { display: none; }
	.scrf-mc-strip { font-size: 10px; padding: 3px 8px; min-height: 20px; }
	.scrf-mc-day-num { padding: 6px 6px 2px; font-size: 12px; }
	.scrf-mc-week { min-height: 70px; }
	.scrf-mc-public__popover { width: calc(100vw - 40px); left: 20px !important; right: auto; }
}
