/* CG Laboratori – calendario
   I colori arrivano dalle impostazioni (Laboratori → Impostazioni) come variabili sull'elemento .cglab.
   Si possono comunque sovrascrivere dal CSS del tema, es.:  .cglab--under18 { --cglab-lab: #eb5c4a; }  */

.cglab,
.cglab__dialog {
	--cglab-lab: #eb5c4a;      /* bordo e fascetta delle schede */
	--cglab-scheda: #cfdce5;   /* fondo delle schede */
	--cglab-ink: #232824;      /* testo */
	--cglab-info: #eb5c4a;     /* date e numero di lezioni */
	--cglab-popup: #cfdce5;    /* fondo della scheda aperta */
	--cglab-focus: #df65a1;    /* contorno da tastiera */
	--cglab-next: var(--cglab-ink);      /* fondo della prossima data nella scheda aperta */
	--cglab-next-fg: var(--cglab-popup);
	--cglab-hair: color-mix(in srgb, var(--cglab-ink) 22%, transparent);
	--cglab-stroke: 2px;       /* bordo delle schede */
	--cglab-band: 2px;         /* fascetta a sinistra delle schede */
	--cglab-radius: 4px;
	--cglab-gap: 4px;
	--cglab-shadow: 6px;       /* ombra e fascetta della scheda aperta */
	font-size: 16px;
}

.cglab {
	color: var(--cglab-ink);
	font-family: inherit;
	line-height: 1.35;
	margin: 0 0 2em;
	text-align: left;
	background: transparent;
}
.cglab *, .cglab *::before, .cglab *::after { box-sizing: border-box; }
.cglab [hidden] { display: none !important; }

/* reset minimo contro gli stili del tema */
.cglab button, .cglab__dialog button {
	font: inherit; color: inherit; letter-spacing: normal; text-transform: none;
	margin: 0; padding: 0; border: 0; background: none; box-shadow: none;
	width: auto; height: auto; min-height: 0; line-height: inherit; text-align: inherit;
	cursor: pointer; border-radius: 0;
}
.cglab a, .cglab__dialog a { color: inherit; text-decoration: none; box-shadow: none; }
.cglab :focus-visible, .cglab__dialog :focus-visible { outline: 2px solid var(--cglab-focus); outline-offset: 2px; }
.cglab ul, .cglab__dialog ul { list-style: none; margin: 0; padding: 0; }
.cglab li, .cglab__dialog li { margin: 0; padding: 0; }
.cglab li::before, .cglab__dialog li::before { content: none; }
.cglab p, .cglab__dialog p { margin: 0; }
.cglab h3, .cglab__dialog h3 { margin: 0; padding: 0; letter-spacing: normal; text-transform: none; font-family: inherit; }

/* età e simili */
.cglab .cglab__pill, .cglab__dialog .cglab__pill {
	display: inline-block; padding: 0 7px; border: 1px solid var(--cglab-ink); border-radius: 999px;
	font-size: .78em; font-weight: 500; line-height: 1.6; white-space: nowrap; vertical-align: middle;
}

/* ---------- testata ---------- */
.cglab__top {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
	gap: 14px 28px; margin-bottom: 24px;
}
.cglab__periodo { font-size: 1.6em; line-height: 1.1; font-weight: 400; }
.cglab__controls { display: none; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.cglab--js .cglab__controls { display: flex; }

.cglab__tabs { display: inline-flex; border: 1.5px solid var(--cglab-ink); }
.cglab .cglab__tab { padding: 8px 16px; font-size: .95em; white-space: nowrap; transition: background .15s, color .15s; }
.cglab .cglab__tab + .cglab__tab { border-left: 1.5px solid var(--cglab-ink); }
.cglab .cglab__tab:hover { background: var(--cglab-hair); }
.cglab .cglab__tab[aria-pressed="true"] { background: var(--cglab-ink); color: var(--cglab-scheda); font-weight: 700; }

.cglab__filtro { display: inline-flex; align-items: center; gap: 8px; font-size: .95em; margin: 0; }
.cglab__filtro select {
	font: inherit; color: var(--cglab-ink); background-color: transparent;
	border: 1.5px solid var(--cglab-ink); border-radius: 0;
	padding: 7px 32px 7px 12px; height: auto; margin: 0; min-width: 0; width: auto;
	appearance: none; -webkit-appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 17px) 52%, calc(100% - 12px) 52%;
	background-size: 5px 5px; background-repeat: no-repeat;
}

/* ---------- navigazione settimana ---------- */
.cglab__nav { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }
.cglab .cglab__arrow {
	width: 40px; height: 40px; border: 1.5px solid var(--cglab-ink);
	display: inline-grid; place-items: center; font-size: 18px; line-height: 1; transition: background .15s;
}
.cglab .cglab__arrow:hover:not([disabled]) { background: var(--cglab-hair); }
.cglab .cglab__arrow[disabled] { opacity: .25; cursor: default; }
.cglab__range { font-size: 1.15em; min-width: 11em; text-align: center; font-variant-numeric: tabular-nums; }
.cglab .cglab__oggi { margin-left: auto; font-size: .9em; text-decoration: underline; text-underline-offset: 3px; }
.cglab__avviso { padding: 10px 0; border-top: 1.5px solid var(--cglab-ink); border-bottom: 1.5px solid var(--cglab-ink); margin-bottom: 16px; }

/* ---------- griglia ---------- */
.cglab__grid { display: grid; grid-template-columns: repeat(var(--cols, 5), minmax(0, 1fr)); gap: var(--cglab-gap); }
.cglab__col { min-width: 0; border-top: 2px solid var(--cglab-ink); padding-top: 10px; }
.cglab__col-head { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; min-height: 34px; }
.cglab__dow { font-size: .95em; }
.cglab__num { font-size: 1.6em; line-height: 1; font-variant-numeric: tabular-nums; }
.cglab__mese { font-size: .85em; }
.cglab__col.is-today .cglab__num {
	background: var(--cglab-ink); color: var(--cglab-scheda);
	border-radius: 999px; padding: 4px 10px 3px; font-size: 1.35em;
}
.cglab__col-body { display: flex; flex-direction: column; gap: var(--cglab-gap); container-type: inline-size; }

/* scheda della settimana */
.cglab .cglab__card {
	display: block; width: 100%; padding: 8px 10px 10px 11px;
	background: var(--cglab-scheda); color: var(--cglab-ink);
	border: var(--cglab-stroke) solid var(--cglab-lab); border-left-width: var(--cglab-band); border-radius: var(--cglab-radius);
	transition: transform .12s ease, box-shadow .12s ease;
}
.cglab .cglab__card:hover { transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--cglab-lab); }
.cglab__card > span { display: block; }
.cglab__card-ora { font-size: .8em; font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.cglab__card-nome { font-weight: 700; line-height: 1.2; margin-top: 3px; overflow-wrap: break-word; hyphens: auto; }
.cglab .cglab__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 8px; }
.cglab__card-n { font-size: .78em; font-variant-numeric: tabular-nums; }
@container (min-width: 140px) { .cglab__card-n::before { content: "lezione "; } }

.cglab__vuoto { opacity: .6; padding: 2px 0; }

/* settimana tipo (attività fisse, senza date) */
.cglab__tipo { display: none; }
.cglab--tipo .cglab__tipo { display: block; }
.cglab--tipo .cglab__lista { display: none; }
.cglab__tipo .cglab__col-head { min-height: 30px; }
.cglab__tipo .cglab__col.is-today .cglab__dow { background: var(--cglab-ink); color: var(--cglab-scheda); border-radius: 999px; padding: 3px 10px; }
.cglab__tipo .cglab__dow { font-size: 1.05em; }
.cglab__card-f { font-size: .78em; }
.cglab__chiuso {
	padding: 14px 8px; text-align: center; border: 1.5px dashed var(--cglab-hair);
	background: repeating-linear-gradient(-45deg, var(--cglab-hair) 0 1px, transparent 1px 8px);
}
.cglab__vuoto-tutto { padding: 22px 0; border-top: 1.5px solid var(--cglab-ink); border-bottom: 1.5px solid var(--cglab-ink); }

/* ---------- elenco ---------- */
.cglab__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--cglab-gap); }
.cglab__item { display: flex; }
.cglab .cglab__item-btn {
	display: flex; flex-direction: column; width: 100%; padding: 12px 14px 14px 15px;
	background: var(--cglab-scheda); color: var(--cglab-ink);
	border: var(--cglab-stroke) solid var(--cglab-lab); border-left-width: var(--cglab-band); border-radius: var(--cglab-radius);
	transition: transform .12s ease, box-shadow .12s ease;
}
.cglab .cglab__item-btn:hover { transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--cglab-lab); }
.cglab__item-o { font-size: .82em; font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.cglab__item-t { font-size: 1.12em; font-weight: 700; line-height: 1.2; margin-top: 4px; }
.cglab__item-s { font-size: .9em; margin-top: 2px; }
.cglab__item-btn .cglab__meta { margin-top: auto; padding-top: 10px; align-items: flex-start; }
.cglab__item-i { color: var(--cglab-info); font-size: .88em; font-weight: 500; line-height: 1.3; flex: 1; min-width: 60%; }
.cglab__nota { font-size: .65em; margin-left: 2px; font-weight: 400; }
.cglab__note { margin-top: 22px; padding-top: 10px; border-top: 1px solid var(--cglab-ink); font-size: .88em; display: flex; flex-wrap: wrap; gap: 4px 24px; }
.cglab__note a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- scheda laboratorio ---------- */
html.cglab-noscroll { overflow: hidden; }
.cglab__dialog {
	width: min(560px, calc(100vw - 32px)); max-height: min(86vh, 900px);
	padding: 0; margin: auto; overflow: auto;
	color: var(--cglab-ink); background: var(--cglab-popup);
	border: 2px solid var(--cglab-ink); border-radius: var(--cglab-radius);
	box-shadow: var(--cglab-shadow) var(--cglab-shadow) 0 var(--cglab-ink);
	font-family: inherit; line-height: 1.45; text-align: left;
}
.cglab__dialog::backdrop { background: color-mix(in srgb, var(--cglab-ink) 35%, transparent); }
.cglab__dialog *, .cglab__dialog *::before { box-sizing: border-box; }
.cglab__dlg { position: relative; padding: 26px 26px 24px; border-left: var(--cglab-shadow) solid var(--cglab-lab); }
.cglab__dialog .cglab__close {
	position: absolute; top: 12px; right: 12px; z-index: 1;
	width: 38px; height: 38px; border: 1.5px solid var(--cglab-ink);
	display: grid; place-items: center; font-size: 24px; line-height: 1; background: var(--cglab-popup);
}
.cglab__dialog .cglab__close:hover { background: var(--cglab-ink); color: var(--cglab-popup); }
.cglab__dlg-img { margin: 0 46px 18px 0; }
.cglab__dlg-img img { max-width: 100%; max-height: 170px; width: auto; height: auto; display: block; }
.cglab__dialog .cglab__dlg-titolo { font-size: 1.55em; line-height: 1.15; font-weight: 700; padding-right: 46px; color: var(--cglab-ink); }
.cglab__dialog .cglab__dlg-titolo .cglab__pill { font-size: .5em; margin-left: 4px; }
.cglab__dlg-sotto { margin-top: 3px !important; font-size: 1.05em; }
.cglab__dlg-orario { margin-top: 12px !important; font-weight: 700; }
.cglab__dlg-info { color: var(--cglab-info); font-weight: 500; }
.cglab__desc { margin-top: 16px; }
.cglab__desc p { margin: 0 0 .7em !important; }
.cglab__desc p:last-child { margin-bottom: 0 !important; }
.cglab__conduce { margin-top: 12px !important; }
.cglab__dlg-nota { margin-top: 12px !important; font-size: .92em; }
.cglab__date { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--cglab-ink); }
.cglab__date-label { font-size: .9em; margin-bottom: 8px !important; }
.cglab__date ul { display: flex; flex-wrap: wrap; gap: 6px; }
.cglab__dialog .cglab__data { padding: 2px 10px; border: 1px solid var(--cglab-ink); border-radius: 999px; font-size: .88em; font-variant-numeric: tabular-nums; }
.cglab__dialog .cglab__data.is-past { text-decoration: line-through; opacity: .45; }
.cglab__dialog .cglab__data.is-next { background: var(--cglab-next); border-color: var(--cglab-next); color: var(--cglab-next-fg); font-weight: 700; }
.cglab__azioni { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 22px; }
.cglab__dialog .cglab__btn { font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.cglab__dialog .cglab__btn:hover { text-decoration-thickness: 3px; }

/* ---------- mobile ---------- */
@media (max-width: 760px) {
	.cglab__top { align-items: flex-start; flex-direction: column; }
	.cglab__controls { width: 100%; }
	.cglab__tabs { width: 100%; }
	.cglab .cglab__tab { flex: 1; text-align: center; padding: 10px 6px; font-size: .9em; }
	.cglab__grid { grid-template-columns: 1fr; gap: 0; }
	.cglab__col { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top-width: 1px; }
	.cglab__col-head { flex-direction: column; align-items: flex-start; gap: 3px; margin: 0; }
	.cglab__tipo .cglab__col { grid-template-columns: 92px minmax(0, 1fr); }
	.cglab__col.is-today .cglab__num { font-size: 1.25em; padding: 4px 9px 3px; }
	.cglab__chiuso { padding: 8px; text-align: left; }
	.cglab__range { min-width: 0; flex: 1; }
	.cglab .cglab__oggi { margin-left: 0; width: 100%; text-align: right; }
	.cglab__lista { grid-template-columns: 1fr; }
	.cglab__dialog { max-height: 88vh; }
	.cglab__dlg { padding: 22px 18px 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.cglab .cglab__card, .cglab .cglab__card:hover,
	.cglab .cglab__item-btn, .cglab .cglab__item-btn:hover { transition: none; transform: none; }
}
