/* Kalendarz z wydarzeniami - nowy */

.cal-events {
	--kal-tekst: #1c1c1c;
	--kal-tekst-slaby: #6d6d6d;
	--kal-linia: #e3e3e3;
	--kal-linia-mocna: #cfcfcf;
	--kal-tlo-naglowka: #f5f5f5;
	--kal-tlo-hover: #fafafa;
	--kal-akcent: #35dccb; /* turkus dnia dzisiejszego */
	--kal-akcent-ciemny: #0f8f83;

	font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
	color: var(--kal-tekst);
}

/* --- Nagłówek sekcji ------------------------------------------------------ */

.cal-events h2 {
	font-size: 1.85rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 0 0 1.5rem;
	letter-spacing: -0.01em;
}

/* --- Siatka (lista dni ułożona w 7 kolumn) ------------------------------- */

.cal-events .cal-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	background: #fff;
}

/* --- Pasek miesiąca ze strzałkami (nav nad tabelą) ------------------------- */

.cal-events .cal-nav {
	background: var(--kal-tlo-naglowka);
	border-top: 1px solid var(--kal-linia-mocna);
	border-bottom: 1px solid var(--kal-linia);
}

.cal-events .pager h2.cal-month {
	margin: 0;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	letter-spacing: normal;
	text-transform: capitalize;
}

.cal-events .pager {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cal-events .pager > li {
	flex: 0 0 3.5rem;
	display: flex;
}

.cal-events ul.pager li::before {
	display: none;
}

/* środkowy element: nazwa aktualnego miesiąca */
.cal-events .pager > li:not(.previous):not(.next) {
	flex: 1 1 auto;
	justify-content: center;
	font-size: 1.125rem;
	font-weight: 400;
	padding: 0.9rem 0;
	text-transform: capitalize;
}

.cal-events .pager > li.next {
	justify-content: flex-end;
}

/* Tekst linków chowamy — zostają same strzałki. */
.cal-events .pager a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	font-size: 0;
	color: var(--kal-tekst);
	text-decoration: none;
	border-radius: 999px;
	transition: background-color 0.15s ease;
}

.cal-events .pager a::before {
	font-size: 3rem;
	line-height: 1;
	font-weight: 300;
	position: relative;
	top: -7px;
}

.cal-events .pager .previous a::before {
	content: "\2039"; /* ‹ */
}

.cal-events .pager .next a::before {
	content: "\203A"; /* › */
}

.cal-events .pager a:hover,
.cal-events .pager a:focus-visible {
	background: #e8e8e8;
}

.cal-events .pager a:focus-visible {
	outline: 2px solid var(--kal-akcent-ciemny);
	outline-offset: 2px;
}

/* --- Wiersz z dniami tygodnia (tylko wizualny, aria-hidden) --------------- */

.cal-events .cal-weekdays {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	border-bottom: 1px solid var(--kal-linia);
	background: #fff;
}

.cal-events .cal-weekday {
	padding: 0.85rem 0.25rem;
	font-size: 1rem;
	font-weight: 400;
	color: var(--kal-tekst-slaby);
	text-align: center;
	text-transform: capitalize;
}

.cal-events .dzien-skrot {
	display: none;
}

/* nazwa dnia ("wtorek, 1 września"): na desktopie tylko dla czytników, na telefonie widoczny nagłówek dnia */
.cal-events .cal-day-label {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- Komórki dni ---------------------------------------------------------- */

.cal-events .cal-grid > li {
	min-width: 0;
	padding: 0.5rem 0.35rem 0.6rem;
	border-bottom: 1px solid var(--kal-linia);
	text-align: center;
	font-size: 0.9375rem;
	list-style: none;
	transition: background-color 0.15s ease;
}

/* wylaczenie strzalki-bulletu z globalnego stylu .content ul li::before */
.cal-events .cal-grid > li::before {
	content: none;
	display: none;
}

.cal-events .cal-grid > li.curmonth:hover {
	background: var(--kal-tlo-hover);
}

/* numer dnia (przycisk rozwijający lub zwykły numer w dniach bez wydarzeń) */
.cal-events .cal-grid > li > strong {
	display: block;
	font-weight: 400;
	margin-bottom: 0.35rem;
}

.cal-events .cal-day-toggle {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.25rem;
	width: 100%;
	margin: 0 0 0.35rem;
	padding: 0;
	font: inherit;
	color: inherit;
	background: none;
	border: 0;
	cursor: pointer;
}

.cal-events .cal-day-toggle:focus-visible {
	outline: 3px solid #000;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #fff;
}

.cal-events .cal-day-toggle:hover .numer-dnia {
	background: #ececec;
}

.cal-events .cal-day-toggle[aria-expanded="true"] .numer-dnia {
	box-shadow: inset 0 0 0 2px var(--kal-akcent-ciemny);
}

/* kwadracik pod dniem: "1 wydarzenie", "2 wydarzenia", "5 wydarzeń" */
.cal-events .cal-count {
	padding: 0.15rem 0.4rem;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	white-space: nowrap;
	color: #fff;
	background: #0b6b62;
	border-radius: 3px;
}

.cal-events .numer-dnia {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding: 0 0.35rem;
	border-radius: 999px;
	color: var(--kal-tekst);
}

/* dni spoza bieżącego miesiąca */
.cal-events .cal-grid > li.othermonth {
	color: #1c1c1c;
	background: #fcfcfc;
}

/* dzisiaj — turkusowe kółko */
.cal-events .cal-grid > li.today .numer-dnia {
	background: var(--kal-akcent);
	color: #0a2f2b;
	font-weight: 600;
}

/* --- Kafelki wydarzeń (lista <ul> w komórce dnia) -------------------------- */

.cal-events .cal-day-events {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cal-events .cal-day-events li {
	margin: 0 0 0.25rem;
	padding: 0.3rem 0.4rem;
	border-left: 3px solid var(--kal-akcent);
	border-radius: 0 3px 3px 0;
	background: #f4fbfa;
	text-align: left;
	list-style: none;
	transition: background-color 0.15s ease;
}

/* wylaczenie strzalki-bulletu z globalnego stylu .content ul li::before */
.cal-events .cal-day-events li::before {
	content: none;
	display: none;
}

.cal-events .cal-day-events li:last-child {
	margin-bottom: 0;
}

.cal-events .cal-day-events li:hover {
	background: #e6f7f5;
}

.cal-events .cal-day-events a {
	display: block;
	font-size: 0.85rem;
	line-height: 1.3;
	color: #24534e;
	text-decoration: underline;
	overflow-wrap: anywhere;
}

.cal-events .cal-day-events a:hover {
	text-decoration-thickness: 2px;
}

.cal-events .cal-day-events a:focus-visible {
	outline: 3px solid #000;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #fff;
}

/* --- Widok mobilny --------------------------------------------------------- */

@media (max-width: 48rem) {
	.cal-events h2 {
		font-size: 1.5rem;
	}

	/* telefon: widok agendy - dni z wydarzeniami jeden pod drugim; nagłówek dnia rozwija listę */
	.cal-events .cal-weekdays {
		display: none;
	}

	.cal-events .cal-grid {
		display: block;
		background: transparent;
	}

	.cal-events .cal-grid > li {
		display: none;
		padding: 0;
		margin: 0 0 0.5rem;
		border: 0;
		font-size: 1rem;
		text-align: left;
		background: transparent;
	}

	.cal-events .cal-grid > li.hasevents.curmonth {
		display: block;
	}

	.cal-events .cal-grid > li.hasevents:hover {
		background: transparent;
	}

	.cal-events .cal-day-toggle {
		flex-direction: row;
		justify-content: flex-start;
		gap: 0.75rem;
		margin: 0;
		padding: 0.6rem 0.75rem;
		text-align: left;
		background: var(--kal-tlo-naglowka);
		border-bottom: 1px solid var(--kal-linia-mocna);
	}

	/* numer dnia zastąpiony pełną nazwą dnia */
	.cal-events .cal-day-toggle .numer-dnia {
		display: none;
	}

	.cal-events .cal-day-label {
		position: static;
		display: block;
		flex: 1 1 auto;
		width: auto;
		height: auto;
		margin: 0;
		padding: 0;
		overflow: visible;
		clip: auto;
		white-space: normal;
		font-size: 1rem;
		font-weight: 600;
		color: #1c1c1c;
		text-transform: capitalize;
	}

	/* strzałka rozwijania */
	.cal-events .cal-day-toggle::after {
		content: "";
		flex: 0 0 auto;
		width: 0.55rem;
		height: 0.55rem;
		border-right: 2px solid #1c1c1c;
		border-bottom: 2px solid #1c1c1c;
		transform: rotate(45deg);
		transition: transform 0.15s ease;
	}

	.cal-events .cal-day-toggle[aria-expanded="true"]::after {
		transform: rotate(-135deg);
	}

	.cal-events .cal-grid > li.today .cal-day-toggle {
		background: var(--kal-akcent);
	}

	.cal-events .cal-grid > li.today .cal-day-label {
		color: #0a2f2b;
	}

	.cal-events .cal-day-events {
		margin-top: 0.35rem;
	}

	.cal-events .cal-day-events li {
		margin-bottom: 0.35rem;
		padding: 0.5rem 0.75rem;
		border-left-width: 4px;
	}

	.cal-events .cal-day-events a {
		font-size: 1rem;
		line-height: 1.35;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cal-events * {
		transition: none !important;
	}
}