/* Lunatika Factory — archives.css (Fase 2B, archivi Il palco + Artiste).
   Registro da EventArchive.jsx; griglia artiste = interpretazione design system. */

.lf-archive { padding: 3rem 0; }

/* --- Hero archivio (valori da archive.css del demo, audit 12/06) --- */
.lf-archive__hero { margin-bottom: 2.5rem; }
.lf-archive__hero .lf-eyebrow { font-size: 10.5px; }
.lf-archive__hero .lf-eyebrow::before {
	content: "";
	display: inline-block;
	width: 32px;
	height: 1px;
	background: var(--lf-rame);
	margin-right: 12px;
	vertical-align: middle;
}
.lf-archive__title { font-size: clamp(3.5rem, 10vw, 8rem); font-weight: 400; margin: 0; line-height: .95; letter-spacing: -.025em; text-wrap: balance; }
.lf-archive__title em { font-style: italic; font-weight: 400; color: var(--lf-rame-light); }
.lf-archive__stand {
	font-family: var(--lf-font-display);
	font-style: italic;
	font-size: clamp(18px, 2vw, 22px);
	line-height: 1.4;
	color: rgba(var(--lf-fg-rgb), .62);
	margin: .8rem 0 0;
}
@media (min-width: 721px) {
	.lf-archive__hero {
		display: flex;
		align-items: end;
		justify-content: space-between;
		gap: 2.5rem;
	}
	.lf-archive__stand {
		margin: 0;
		max-width: 340px;
		padding-left: 18px;
		padding-bottom: 10px;
		border-left: 1px solid var(--lf-rame);
	}
}
.lf-archive__count {
	font-family: var(--lf-font-display);
	font-style: italic;
	color: var(--lf-muted);
	font-size: 16px;
	margin: 0 0 20px;
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.lf-archive__count strong {
	font-family: var(--lf-font-body);
	font-style: normal;
	font-weight: 600;
	color: var(--lf-avorio);
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
}

/* --- Gruppi mese (Il palco) --- */
.lf-arc-month { margin-bottom: clamp(32px, 4vw, 48px); }
.lf-arc-month__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	border-bottom: 1px solid var(--lf-divider);
	padding: 16px 0;
	margin-bottom: 8px;
}
.lf-arc-month__head h2 {
	font-size: clamp(28px, 3.5vw, 40px);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -.01em;
	margin: 0;
}
.lf-arc-month__head h2 em { font-style: italic; font-weight: 400; color: var(--lf-rame-light); }
.lf-arc-month__meta { color: var(--lf-muted); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }

/* --- Card evento orizzontale (valori da archive.css del demo, export 12/06) --- */
.lf-arc-list { display: grid; gap: 12px; }
.lf-evcard {
	display: flex;
	align-items: center;
	gap: 24px;
	background: var(--lf-card);
	border: 1px solid var(--lf-card-border);
	border-radius: 14px;
	padding: 18px 22px 18px 18px;
	color: var(--lf-avorio);
	transition: all var(--lf-t-base) var(--lf-ease);
}
.lf-evcard:hover {
	border-color: var(--lf-card-border-strong);
	transform: translateX(4px);
	box-shadow: var(--lf-shadow-2);
	color: var(--lf-avorio);
}
/* Passata: card temperata, pill data bronzo desaturato. NOTA: inverte la
   decisione del blocco archivi ("pill resta colorata") — il demo vince. */
.lf-evcard.is-past { opacity: .78; }
.lf-evcard.is-past:hover { opacity: 1; }
.lf-evcard.is-past .lf-evcard__date {
	background: linear-gradient(135deg, rgba(var(--lf-rame-rgb), .55), rgba(var(--lf-rame-rgb), .3));
	filter: saturate(.7);
}
/* Light: il bronzo attenuato composita CHIARO sulla carta — il bianco del demo
   non regge (regola contrasto del progetto > demo, deviazione dichiarata). */
[data-theme="light"] .lf-evcard.is-past .lf-evcard__date { color: rgba(var(--lf-fg-rgb), .92); }
[data-theme="light"] .lf-evcard.is-past .lf-evcard__mon { color: rgba(var(--lf-fg-rgb), .75); }
[data-theme="light"] .lf-evcard.is-past .lf-evcard__year { color: rgba(var(--lf-fg-rgb), .55); }
.lf-evcard.is-past .lf-evcard__eyebrow { color: var(--lf-muted); }
/* Card = <article> con link "stretched" sul titolo (eyebrow resta link a sé). */
.lf-evcard { position: relative; }
.lf-evcard__link { color: inherit; }
.lf-evcard__link::after { content: ""; position: absolute; inset: 0; }
.lf-evcard__link:hover { color: inherit; }
a.lf-evcard__eyebrow { position: relative; z-index: 1; }
a.lf-evcard__eyebrow:hover { color: var(--lf-rame-light); text-decoration: underline; }
.lf-evcard__date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	align-self: stretch;
	min-width: 92px;
	min-height: 84px;
	padding: 12px 8px 10px;
	border-radius: 12px;
	background: linear-gradient(135deg, var(--lf-borgogna), var(--lf-borgogna-deep));
	/* Pill sempre borgogna in entrambi i temi: bianchi letterali come da demo */
	color: #fff;
	line-height: 1.15;
	font-variant-numeric: tabular-nums;
}
.lf-evcard__date.is-finale { background: linear-gradient(135deg, var(--lf-rame-dim), var(--lf-rame)); }
.lf-evcard__day { font-family: var(--lf-font-display); font-size: 32px; font-weight: 700; letter-spacing: -.02em; line-height: 1; }
.lf-evcard__mon { font-size: 9.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .2em; color: rgba(255, 255, 255, .82); margin-top: 5px; }
.lf-evcard__year { font-family: var(--lf-font-display); font-style: italic; font-size: 11px; letter-spacing: .02em; color: rgba(255, 255, 255, .5); margin-top: 3px; }
.lf-evcard__body { flex: 1; min-width: 0; }
.lf-evcard__eyebrow { display: block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: var(--lf-rame); margin-bottom: 6px; }
.lf-evcard__title { display: block; font-family: var(--lf-font-display); font-size: 22px; font-weight: 600; line-height: 1.25; transition: color var(--lf-t-base) var(--lf-ease); }
.lf-evcard:hover .lf-evcard__title { color: var(--lf-rame-light); }
.lf-evcard__title svg { color: var(--lf-rame-light); vertical-align: -1px; margin-left: 8px; }
.lf-evcard__meta { display: flex; flex-wrap: wrap; gap: 14px; color: var(--lf-muted); font-size: 12.5px; margin-top: 8px; }
.lf-evcard__meta > span { display: inline-flex; align-items: center; gap: 6px; }
.lf-evcard__meta svg { color: var(--lf-rame); flex-shrink: 0; }
.lf-evcard__right { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex: none; }
/* SCOPRI hover-only (demo) + parità da tastiera (:focus-within = miglioria
   a11y dichiarata: il demo non la prevede). */
.lf-evcard__cta {
	color: var(--lf-rame);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	opacity: 0;
	transition: opacity var(--lf-t-base) var(--lf-ease);
}
.lf-evcard:hover .lf-evcard__cta,
.lf-evcard:focus-within .lf-evcard__cta { opacity: 1; }

.lf-evstatus {
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .12em;
	padding: .2rem .6rem;
	border-radius: 999px;
	white-space: nowrap;
}
/* Badge stato: valori arc-status del kit (free/sale = rame .14 + rame-light;
   soldout = fg .06 + muted). Il verde precedente non esiste nel design system. */
.lf-evstatus--free { background: rgba(var(--lf-rame-rgb), .14); color: var(--lf-rame-light); }
.lf-evstatus--sale { background: rgba(var(--lf-rame-rgb), .14); color: var(--lf-rame-light); }
/* Testo badge muted: rgba(fg,.62) anziché --lf-muted — il combo del kit misura
   2.84:1 in dark (sotto soglia); deviazione deliberata per leggibilità (regola Gian). */
.lf-evstatus--soldout { background: rgba(var(--lf-fg-rgb), .06); color: rgba(var(--lf-fg-rgb), .62); }
.lf-evstatus--past { background: rgba(var(--lf-fg-rgb), .08); color: rgba(var(--lf-fg-rgb), .62); }
/* PROSSIMO: pill borgogna piena con puntino pulsante (da arc-status.next del demo). */
.lf-evstatus--next { background: var(--lf-borgogna); color: var(--lf-on-accent); display: inline-flex; align-items: center; gap: 7px; }
.lf-evstatus--next::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: lf-blink 1.8s ease infinite; }
@keyframes lf-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .lf-evstatus--next::before { animation: none; } }

@media (max-width: 720px) {
	.lf-evcard { flex-wrap: wrap; gap: .8rem 1.1rem; }
	.lf-evcard__date { min-width: 72px; min-height: 72px; padding: 10px 6px; }
	.lf-evcard__day { font-size: 26px; }
	.lf-evcard__mon { font-size: 9px; }
	.lf-evcard__year { font-size: 10px; }
	.lf-evcard__title { font-size: 17px; }
	.lf-evcard__meta { font-size: 11.5px; gap: 10px; }
	.lf-evcard__right { flex-direction: row; align-items: center; width: 100%; justify-content: space-between; }
}

/* --- Griglia artiste --- */
.lf-artgrid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 1.6rem;
}
/* Scroll infinito (progressive reveal): sentinella + leva tastiera/SR. Senza JS
   resta hidden e tutte le card sono già visibili. */
.lf-artgrid__more { display: flex; flex-direction: column; align-items: center; gap: .6rem; padding: 2.4rem 0 0; }
.lf-artgrid__more[hidden] { display: none; }
.lf-artgrid__more-btn {
	font: inherit; font-size: .78rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
	color: var(--lf-rame); background: transparent;
	border: 1px solid var(--lf-card-border-strong); border-radius: 999px;
	padding: .7rem 1.7rem; cursor: pointer;
	transition: border-color var(--lf-t-base) var(--lf-ease), color var(--lf-t-base) var(--lf-ease);
}
.lf-artgrid__more-btn:hover { border-color: var(--lf-rame); color: var(--lf-rame-light); }
.lf-artgrid__more-btn:focus-visible { outline: 2px solid var(--lf-rame); outline-offset: 2px; }
.lf-artgrid__status { margin: 0; font-size: 12px; color: var(--lf-muted); font-variant-numeric: tabular-nums; }
.lf-artcard { display: block; color: var(--lf-avorio); }
.lf-artcard:hover { color: var(--lf-avorio); }
.lf-artcard__photo { display: block; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 10px; background: var(--lf-card); box-shadow: 0 12px 28px rgba(0, 0, 0, .4); }
/* Light: l'ombra scura della card pesa su carta → azzerata (in dark resta com'è). */
[data-theme="light"] .lf-artcard__photo { box-shadow: none; }
.lf-artcard__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: transform .25s ease; }
.lf-artcard:hover .lf-artcard__photo img { transform: scale(1.03); }
.lf-artcard__placeholder { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 2.4rem; color: var(--lf-muted); }
.lf-artcard__body { display: block; padding: .8rem .2rem 0; }
.lf-artcard__eyebrow { display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .16em; color: var(--lf-rame); margin-bottom: .15rem; }
.lf-artcard__name { display: block; font-family: var(--lf-font-display); font-size: 1.35rem; line-height: 1.15; }
.lf-artcard:hover .lf-artcard__name { color: var(--lf-rame); }
.lf-artcard__meta { display: block; color: var(--lf-muted); font-size: .85rem; margin-top: .1rem; }

@media (prefers-reduced-motion: reduce) {
	.lf-artcard__photo img { transition: none; }
	.lf-evcard, .lf-evcard__title, .lf-evcard__cta { transition: none; }
	.lf-evcard:hover { transform: none; }
}

/* --- Stato vuoto --- */
.lf-archive__empty { text-align: center; padding: 4rem 0; color: var(--lf-muted); }
.lf-archive__empty-glyph { display: block; font-size: 2.6rem; color: var(--lf-rame); margin-bottom: .8rem; }
.lf-archive__empty p { font-family: var(--lf-font-display); font-style: italic; font-size: 1.2rem; margin: 0; }

/* --- Paginazione --- */
.lf-pagination { margin-top: 2.5rem; }
.lf-pagination ul { list-style: none; display: flex; gap: .4rem; padding: 0; margin: 0; justify-content: center; }
.lf-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.2rem;
	height: 2.2rem;
	padding: 0 .6rem;
	border-radius: 8px;
	border: 1px solid rgba(var(--lf-fg-rgb), .12);
	color: var(--lf-avorio);
	font-size: .9rem;
}
.lf-pagination .page-numbers.current { background: var(--lf-borgogna); border-color: var(--lf-borgogna); color: var(--lf-on-accent); }
.lf-pagination a.page-numbers:hover { border-color: var(--lf-rame); color: var(--lf-rame); }

/* ============================================================
   FILTRI ARCHIVIO + CALENDARIO (da archive.css del demo, token WP)
   ============================================================ */

/* Barra filtri sticky: chip formato (sx) + segmenti quando/vista (dx) */
.lf-arc-filters {
	display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
	padding: 14px 0;
	margin-bottom: 1.6rem;
	border-top: 1px solid var(--lf-divider);
	border-bottom: 1px solid var(--lf-divider);
}
[data-theme="light"] .lf-arc-filters { border-top-color: rgba(var(--lf-rame-rgb), .18); border-bottom-color: rgba(var(--lf-rame-rgb), .18); }
.lf-arc-chips { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; flex: 1; min-width: 0; }
.lf-arc-tools { display: flex; gap: 10px; align-items: center; margin-left: auto; flex-wrap: wrap; }
.lf-arc-chip {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 9px 18px; border-radius: 100px;
	border: 1px solid rgba(var(--lf-borgogna-rgb), .28);
	background: transparent;
	font-family: var(--lf-font-body);
	font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
	color: rgba(var(--lf-fg-rgb), .78);
	white-space: nowrap; cursor: pointer;
	transition: all var(--lf-t-base) var(--lf-ease);
}
.lf-arc-chip:hover { border-color: var(--lf-borgogna); color: var(--lf-borgogna-light); transform: translateY(-1px); }
.lf-arc-chip.is-active { background: var(--lf-borgogna); border-color: var(--lf-borgogna); color: var(--lf-on-accent); box-shadow: 0 4px 18px rgba(var(--lf-borgogna-rgb), .28); }
.lf-arc-chip__n { font-weight: 400; font-size: 10.5px; letter-spacing: .06em; opacity: .6; font-family: var(--lf-font-display); font-style: italic; }
/* Light: chip attiva = borgogna-soft (= WP light borgogna) + bianco; shadow .2 (demo). */
[data-theme="light"] .lf-arc-chip.is-active { box-shadow: 0 4px 18px rgba(var(--lf-borgogna-rgb), .2); }

/* Segmenti (quando / vista) — icona + label (svg 14px da Icons.jsx) */
.lf-arc-seg { display: inline-flex; padding: 3px; border: 1px solid rgba(var(--lf-rame-rgb), .22); border-radius: 100px; background: rgba(var(--lf-rame-rgb), .05); }
.lf-arc-seg a {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 7px 14px; border-radius: 100px;
	font-family: var(--lf-font-body); font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
	color: rgba(var(--lf-fg-rgb), .65);
	transition: all var(--lf-t-base) var(--lf-ease);
}
.lf-arc-seg a svg { width: 14px; height: 14px; flex-shrink: 0; }
.lf-arc-seg a:hover { color: var(--lf-avorio); }
/* Status (quando): rame in dark; in LIGHT vira a borgogna-soft (demo). Il testo
   resta var(--lf-nero) theme-aware (scuro su rame in dark, chiaro su borgogna in light). */
.lf-arc-seg a.is-on { background: var(--lf-rame); color: var(--lf-nero); box-shadow: 0 2px 10px rgba(var(--lf-rame-rgb), .22); }
[data-theme="light"] .lf-arc-seg:not(.lf-arc-seg--view) a.is-on { background: var(--lf-borgogna); box-shadow: 0 2px 10px rgba(var(--lf-borgogna-rgb), .18); }
/* Vista: fg (avorio) in entrambi i temi — diverso dallo status. */
.lf-arc-seg--view a.is-on { background: var(--lf-avorio); color: var(--lf-nero); box-shadow: none; }

/* Layout main + sidebar */
.lf-arc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(36px, 5vw, 64px); align-items: start; }
.lf-arc-main { min-width: 0; }
/* Stack a 1024px come il demo: sotto, sidebar in riga (no colonna stretta che fa
   sforare il calendario). */
@media (max-width: 1024px) {
	.lf-arc-layout { grid-template-columns: 1fr; }
	.lf-arc-side { position: static; flex-direction: row; flex-wrap: wrap; gap: 20px; margin-top: 8px; }
	.lf-arc-side__block { flex: 1 1 280px; }
}

/* Sidebar */
.lf-arc-side { display: flex; flex-direction: column; gap: 22px; }
@media (min-width: 901px) { .lf-arc-side { position: sticky; top: 96px; } }
.lf-arc-side__block { background: var(--lf-card); border: 1px solid var(--lf-card-border); border-radius: 14px; padding: 1.2rem 1.3rem; }
.lf-arc-next { display: flex; flex-direction: column; gap: 0; margin-top: .6rem; }
.lf-arc-next__item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--lf-divider); color: var(--lf-avorio); transition: transform var(--lf-t-base) var(--lf-ease); }
.lf-arc-next__item:hover { transform: translateX(3px); color: var(--lf-avorio); }
.lf-arc-next__item:last-child { border-bottom: none; padding-bottom: 0; }
.lf-arc-next__date { background: linear-gradient(135deg, var(--lf-borgogna), var(--lf-borgogna-deep)); border-radius: 8px; padding: 8px 4px; text-align: center; }
.lf-arc-next__d { display: block; font-family: var(--lf-font-display); font-size: 18px; font-weight: 700; line-height: 1; color: #fff; }
.lf-arc-next__m { display: block; font-size: 9px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.8); margin-top: 3px; }
.lf-arc-next__info { min-width: 0; }
.lf-arc-next__eyebrow { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--lf-rame); margin-bottom: 3px; }
.lf-arc-next__name { display: block; font-family: var(--lf-font-display); font-size: 16px; line-height: 1.2; }
.lf-arc-side__news-text { color: var(--lf-muted); font-size: .92rem; margin: .4rem 0 1rem; }
.lf-arc-side__news-btn { display: inline-flex; }

/* ---- Calendario ---- */
.lf-cal { background: var(--lf-card); border: 1px solid var(--lf-card-border); border-radius: 20px; padding: clamp(20px, 3vw, 32px); }
.lf-cal__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--lf-divider); }
.lf-cal__head h2 { font-family: var(--lf-font-display); font-size: clamp(24px, 3.2vw, 34px); font-weight: 500; line-height: 1; letter-spacing: -.01em; margin: 0; }
.lf-cal__nav { display: flex; gap: 8px; align-items: center; }
.lf-cal__nav a { width: 38px; height: 38px; border-radius: 50%; background: rgba(var(--lf-rame-rgb), .08); border: 1px solid rgba(var(--lf-rame-rgb), .18); color: var(--lf-rame); display: inline-flex; align-items: center; justify-content: center; font-family: var(--lf-font-display); font-size: 18px; transition: all var(--lf-t-base) var(--lf-ease); }
.lf-cal__nav a:hover { background: var(--lf-borgogna); border-color: var(--lf-borgogna); color: var(--lf-on-accent); }
.lf-cal__nav a.lf-cal__today { width: auto; padding: 0 16px; font-family: var(--lf-font-body); font-size: 10.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; border-radius: 100px; }
.lf-cal__dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 8px; }
.lf-cal__dow span { text-align: center; font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--lf-muted); padding: 6px 0; }
.lf-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
/* NIENTE aspect-ratio: era la causa del bug — con min-height accoppiato derivava
   un floor di LARGHEZZA (~84px) che sforava il track 1fr su contenitori stretti.
   Larghezza = track fluido (minmax(0,1fr)), altezza = min-height: celle fluide,
   mai overflow. (Deviazione dichiarata dal demo, che usava aspect-ratio:1.) */
.lf-cal__cell { position: relative; min-width: 0; border-radius: 8px; border: 1px solid transparent; padding: 9px 10px 32px; min-height: 84px; display: flex; flex-direction: column; background: transparent; transition: all .15s var(--lf-ease); overflow: hidden; }
.lf-cal__cell.has-events { cursor: pointer; }
.lf-cal__cell.has-future { background: rgba(var(--lf-borgogna-rgb), .20); border-color: rgba(var(--lf-borgogna-rgb), .32); }
.lf-cal__cell.has-future .lf-cal__day { color: var(--lf-borgogna-light); font-weight: 600; }
.lf-cal__cell.has-future:hover { background: rgba(var(--lf-borgogna-rgb), .30); border-color: rgba(var(--lf-borgogna-rgb), .46); }
.lf-cal__cell.has-past { background: rgba(var(--lf-rame-rgb), .15); border-color: rgba(var(--lf-rame-rgb), .20); }
.lf-cal__cell.has-past .lf-cal__day { color: var(--lf-rame-light); font-weight: 500; }
.lf-cal__cell.has-past:hover { background: rgba(var(--lf-rame-rgb), .22); border-color: rgba(var(--lf-rame-rgb), .34); }
.lf-cal__cell.is-muted { opacity: .32; }
.lf-cal__cell.is-today { background: rgba(var(--lf-rame-rgb), .18); border-color: rgba(var(--lf-rame-rgb), .42); }
.lf-cal__cell.is-today .lf-cal__day { color: var(--lf-rame-light); font-weight: 700; }
.lf-cal__cell.is-selected { background: var(--lf-borgogna); border-color: var(--lf-borgogna); box-shadow: 0 6px 20px rgba(var(--lf-borgogna-rgb), .32); }
.lf-cal__cell.is-selected .lf-cal__day { color: #fff; font-weight: 600; }
.lf-cal__cell:focus-visible { outline: 2px solid var(--lf-rame); outline-offset: 2px; }
.lf-cal__day { font-family: var(--lf-font-display); font-size: 18px; font-weight: 500; line-height: 1; color: var(--lf-avorio); }
.lf-cal__markers { position: absolute; bottom: 10px; left: 0; right: 0; display: flex; gap: 5px; align-items: center; justify-content: center; }
.lf-cal__marker { width: 12px; height: 12px; border-radius: 50%; background: var(--lf-borgogna); box-shadow: 0 0 0 3px var(--lf-card); }
.lf-cal__marker.is-copper { background: var(--lf-rame); }
.lf-cal__legend { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--lf-divider); font-size: 11.5px; color: var(--lf-muted); align-items: center; }
.lf-cal__legend span { display: inline-flex; align-items: center; gap: 9px; }

/* Pannello dettaglio (eventi del mese; JS filtra per giorno, no-JS = lista completa) */
.lf-cal-detail { margin-top: 24px; }
.lf-cal-detail__title { font-family: var(--lf-font-display); font-size: 1.3rem; font-weight: 500; margin: 0 0 1rem; }
.lf-cal-detail__reset { font-style: italic; font-size: 1rem; color: var(--lf-rame); cursor: pointer; }
.lf-cal-detail__list { display: flex; flex-direction: column; gap: 10px; }
.lf-cal-detail__item { display: flex; align-items: center; gap: 16px; padding: 12px 14px; background: var(--lf-card); border: 1px solid var(--lf-divider); border-radius: 12px; color: var(--lf-avorio); transition: all var(--lf-t-base) var(--lf-ease); }
.lf-cal-detail__item:hover { border-color: var(--lf-borgogna); transform: translateX(3px); color: var(--lf-avorio); }
.lf-cal-detail__item.is-hidden { display: none; }
.lf-cal-detail__when { display: flex; flex-direction: column; align-items: center; min-width: 56px; }
.lf-cal-detail__d { font-family: var(--lf-font-display); font-size: 22px; font-weight: 700; line-height: 1; color: var(--lf-rame-light); }
.lf-cal-detail__t { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--lf-muted); margin-top: 3px; }
.lf-cal-detail__info { min-width: 0; }
.lf-cal-detail__eyebrow { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--lf-rame); margin-bottom: 3px; }
.lf-cal-detail__name { display: block; font-family: var(--lf-font-display); font-size: 15.5px; font-weight: 600; line-height: 1.25; }
.lf-cal-detail__venue { display: block; font-size: 11.5px; color: var(--lf-muted); margin-top: 3px; }

@media (prefers-reduced-motion: reduce) {
	.lf-arc-chip, .lf-arc-seg a, .lf-arc-next__item, .lf-cal__nav a, .lf-cal__cell, .lf-cal-detail__item { transition: none; }
	.lf-arc-chip:hover, .lf-arc-next__item:hover, .lf-cal-detail__item:hover { transform: none; }
}

/* ---- Responsive filtri + calendario (≤768px, da archive.css del demo) ---- */
@media (max-width: 768px) {
	/* Barra filtri: scroll orizzontale invece di andare a capo */
	.lf-arc-filters { gap: 10px; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.lf-arc-filters::-webkit-scrollbar { display: none; }
	.lf-arc-chips { flex: 0 0 auto; flex-wrap: nowrap; }
	.lf-arc-chip { flex-shrink: 0; padding: 8px 14px; }
	.lf-arc-tools { flex-shrink: 0; gap: 8px; margin-left: 0; }
	.lf-arc-seg a { padding: 6px 10px; font-size: 10px; }
	/* Su mobile resta la sola icona nei toggle vista (label nascosta, come demo) */
	.lf-arc-seg__lbl { display: none; }
	/* Calendario compatto */
	.lf-cal { padding: 18px 14px; }
	.lf-cal__head { margin-bottom: 16px; padding-bottom: 14px; }
	.lf-cal__head h2 { font-size: 22px; }
	.lf-cal__dow span { font-size: 9px; padding: 4px 0; }
	.lf-cal__cell { min-height: 62px; padding: 7px 5px 22px; }
	.lf-cal__day { font-size: 14px; }
	.lf-cal__marker { width: 8px; height: 8px; box-shadow: 0 0 0 2px var(--lf-card); }
	.lf-cal__markers { bottom: 6px; gap: 3px; }
	.lf-cal-detail__item { gap: 12px; padding: 10px 12px; }
	.lf-cal-detail__d { font-size: 18px; }
}

/* [DS-muted 16/07] eyebrow AA in LIGHT: il rame (--lf-rame #8f6240 in light)
   sul crema scende sotto AA (~4.35:1, pink Permette Signorina 2.13) su testo
   minuscolo maiuscolo. Convenzione del tema (già su HoF card/modal, chi-siamo,
   taccuino feature): in LIGHT l'occhiello passa a --lf-borgogna-soft (#6e1c41 =
   7.3–10:1 sui fondi chiari). Dark invariato (rame ~7.3:1). Hero FOTO (fondo
   scuro) esclusi via :not(). */
[data-theme="light"] .lf-artcard__eyebrow,
[data-theme="light"] .lf-evcard__eyebrow,
[data-theme="light"] .lf-arc-next__eyebrow,
[data-theme="light"] .lf-cal-detail__eyebrow { color: var(--lf-borgogna-soft); }