/* LMS Theme — panel kursanta, widok nauki, koszyk i formularze Tutor LMS
   Tutor LMS 4 rysuje te widoki z wlasnych tokenow (--tutor-*). Zamiast nadpisywac
   pojedyncze selektory, ustawiamy tu tokeny na palete motywu: kolor marki, kroj
   pisma, promienie i neutralne tla. Dzieki temu aktualizacje Tutora nie psuja wygladu.
   Tryb ciemny Tutora (wybierany w ustawieniach konta) zachowuje swoje tla i teksty -
   zmieniamy w nim tylko kolor marki, kroj i ksztalty. */

:root {
	/* Skala koloru marki zbudowana wokol #833AB4 (pozycja 600). */
	--tutor-brand-50: #fbf7fd;
	--tutor-brand-100: #f7f0fb;
	--tutor-brand-200: #efe1f8;
	--tutor-brand-300: #e2c9f1;
	--tutor-brand-400: #c79be4;
	--tutor-brand-450: #b47dd9;
	--tutor-brand-500: #a05fcb;
	--tutor-brand-600: #833ab4;
	--tutor-brand-700: #6d2f97;
	--tutor-brand-800: #59287a;
	--tutor-brand-900: #462060;
	--tutor-brand-950: #2c123f;

	--tutor-font-family-body: "Plus Jakarta Sans";
	--tutor-font-family-heading: "Plus Jakarta Sans";

	--tutor-button-radius: 12px;
	--tutor-input-radius: 12px;
	--tutor-modal-radius: 20px;
	--tutor-popover-radius: 16px;
	--tutor-tab-radius: 12px;
	--tutor-tab-radius-sm: 10px;
}

:root:not([data-tutor-theme="dark"]) {
	--tutor-surface-base: #fcfafd;
	--tutor-surface-l1-hover: #f8f5fa;
	--tutor-surface-l2: #f1edf4;
	--tutor-surface-l3: #f8f5fa;
	--tutor-surface-sidebar-l1: #ffffff;
	--tutor-text-primary: #17151a;
	--tutor-text-secondary: #4d4852;
	--tutor-text-subdued: #736e79;
	--tutor-icon-idle: #4d4852;
	--tutor-icon-hover: #17151a;
	--tutor-icon-secondary: #736e79;
	--tutor-border-idle: #e8e5ea;
	--tutor-border-idle2: #e8e5ea;
	--tutor-border-hover: #d9d4dd;
	--tutor-button-secondary: #f1edf4;
	--tutor-button-secondary-hover: #e8e5ea;
	--tutor-button-outline-hover: #f8f5fa;
	--tutor-button-ghost-hover: #f1edf4;
	--tutor-tab-sidebar-l2: #ffffff;
	--tutor-tab-sidebar-l2-hover: #f8f5fa;
	--tutor-tab-sidebar-l4-hover: #f8f5fa;
	--tutor-actions-gray-empty: #f8f5fa;
	--tutor-actions-gray-secondary: #f1edf4;
	--tutor-actions-gray-tertiary: #e8e5ea;
	--tutor-shadow-sm: 0 8px 30px rgba(23, 21, 26, 0.06);
}

.tutor-wrap,
.tutor-wrap-parent,
.tutor-modal,
.tutor-dashboard-layout,
.tutor-account-page-wrapper,
.tutor-learning-page,
.tutor-login-form-wrapper {
	font-family: var(--lms-font);
}

/* ---------- Przyciski ---------- */

.tutor-btn {
	border-radius: var(--lms-radius-control);
	font-family: var(--lms-font);
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

/* Glowna akcja w gradiencie marki, jak na reszcie witryny. */
.tutor-btn.tutor-btn-primary:not(:disabled):not(.tutor-btn-loading) {
	border-color: transparent;
	background: var(--lms-gradient);
	color: #fff;
}

.tutor-btn.tutor-btn-primary:not(:disabled):not(.tutor-btn-loading):hover,
.tutor-btn.tutor-btn-primary:not(:disabled):not(.tutor-btn-loading):focus {
	border-color: transparent;
	background: var(--lms-gradient);
	color: #fff;
	filter: brightness(1.05);
}

.tutor-btn.tutor-btn-outline-primary {
	border-color: var(--lms-purple);
	color: var(--lms-purple);
}

.tutor-btn.tutor-btn-outline-primary:hover,
.tutor-btn.tutor-btn-outline-primary:focus {
	border-color: var(--lms-purple);
	background: var(--lms-purple);
	color: #fff;
}

/* Motyw nadrzedny koloruje kazdy <button> na rozowo po najechaniu - w widokach Tutora wylaczamy to. */
.tutor-dashboard-layout button:not(.tutor-btn):not(.lms-btn):hover,
.tutor-dashboard-layout button:not(.tutor-btn):not(.lms-btn):focus,
.tutor-account-page-wrapper button:not(.tutor-btn):not(.lms-btn):hover,
.tutor-account-page-wrapper button:not(.tutor-btn):not(.lms-btn):focus,
.tutor-learning-page button:not(.tutor-btn):not(.lms-btn):hover,
.tutor-learning-page button:not(.tutor-btn):not(.lms-btn):focus {
	color: inherit;
}

/* ---------- Pola ---------- */

.tutor-form-control,
.tutor-form-select,
.tutor-input {
	font-family: var(--lms-font);
}

.tutor-form-control:focus,
.tutor-form-select:focus,
.tutor-input:focus {
	border-color: var(--lms-purple);
	box-shadow: var(--lms-focus);
}

/* ---------- Karty i okna ---------- */

.tutor-card {
	border-radius: var(--lms-radius-md);
}

.tutor-modal .tutor-modal-content {
	border-radius: var(--lms-radius-card);
}

/* ---------- Panel kursanta: uklad witryny ----------
   Panel dziala w siatce witryny: naglowek i stopka serwisu, tresc w kontenerze 1280 px,
   menu panelu jako karta po lewej. Wymaga wlaczonego naglowka witryny w panelu
   (Tutor LMS > Ustawienia > Wyglad; ustawia to narzedzie importu motywu) - bez niego
   Tutor rysuje panel po swojemu, na cala szerokosc. */

body.tutor-screen-frontend-dashboard {
	background: var(--tutor-surface-base, var(--lms-bg));
}

.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-header-left > .tutor-h5 {
	font-weight: 800;
	letter-spacing: -0.02em;
}

.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-page-card {
	border-radius: var(--lms-radius-card);
	overflow: hidden;
}

@media (min-width: 769px) {
	.tutor-dashboard-layout.tutor-has-site-shell {
		grid-template-columns: 272px minmax(0, 1fr);
		column-gap: 32px;
		align-items: start;
		max-width: calc(var(--lms-container) + var(--lms-gutter) * 2);
		margin-inline: auto;
		padding: calc(var(--tutor-site-header-overlay-offset) + 32px) var(--lms-gutter) 72px;
		background: transparent;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar,
	body:has(#wpadminbar) .tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar {
		top: calc(var(--tutor-site-header-offset) + 24px);
		min-height: 0;
		border: 1px solid var(--tutor-border-idle);
		border-radius: var(--lms-radius-card);
		box-shadow: var(--lms-shadow-card);
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav {
		padding: 16px 12px;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a {
		padding: 10px 14px;
		border-radius: var(--lms-radius-control);
		font-weight: 600;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a.active {
		background: var(--tutor-brand-100);
		color: var(--tutor-brand-600);
	}

	/* Link "Przegladaj kursy" Tutor przypina do dolu wysokiego paska; w karcie idzie pod menu. */
	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-see-all-courses {
		position: static;
		width: auto;
		margin: 0 12px 16px;
		padding: 12px 14px 4px;
		border-top: 1px solid var(--tutor-border-idle);
		border-radius: 0;
		font-weight: 600;
		color: var(--tutor-brand-600);
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-see-all-courses:hover,
	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-sidebar .tutor-see-all-courses:focus {
		background: transparent;
		color: var(--lms-pink);
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-header,
	body:has(#wpadminbar) .tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-header {
		position: relative;
		top: auto;
		height: auto;
		min-height: 48px;
		padding: 0 0 20px;
		border-bottom: 0;
		background: transparent;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-header-inner,
	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-page {
		max-width: none;
		padding-inline: 0;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-page {
		padding-top: 0;
		padding-bottom: 0;
	}

	.tutor-dashboard-layout.tutor-has-site-shell .tutor-dashboard-header-left > .tutor-h5 {
		font-size: 28px;
		line-height: 1.25;
	}
}

/* Telefon: ze stopka witryny dolne menu panelu jest przyklejone do konca tresci.
   Wiersz tresci bierze cala wolna wysokosc, zeby menu nie rozciagalo sie przy krotkich stronach. */
@media (max-width: 768px) {
	.tutor-dashboard-layout.tutor-has-site-footer {
		grid-template-rows: minmax(0, 1fr) auto;
	}
}

/* ---------- Widok nauki: uklad witryny ----------
   Lekcja w kontenerze 1280 px: pasek kursu i spis tresci jako karty, tresc obok.
   Tryb pelnoekranowy Tutora (przycisk zwijania spisu tresci) zostaje bez zmian. */

@media (min-width: 992px) {
	.tutor-learning-area.tutor-has-site-shell {
		--tutor-learning-header-height: 80px;
		--lms-learning-pad: max(var(--lms-gutter), calc((100% - var(--lms-container)) / 2));
	}

	.tutor-learning-area.tutor-has-site-shell .tutor-learning-header {
		padding: 16px var(--lms-learning-pad) 8px;
	}

	.tutor-learning-area.tutor-has-site-shell .tutor-learning-header-inner {
		min-height: 56px;
		padding-inline: 4px 16px;
		border: 1px solid var(--tutor-border-idle);
		border-radius: var(--lms-radius-md);
		box-shadow: var(--lms-shadow-card);
	}

	.tutor-learning-area.tutor-has-site-shell:not(.is-fullscreen) .tutor-learning-area-body {
		grid-template-columns: 320px minmax(0, 1fr);
		column-gap: 24px;
		padding-inline: var(--lms-learning-pad);
	}

	.tutor-learning-area.tutor-has-site-shell.is-fullscreen .tutor-learning-area-body {
		padding-inline: var(--lms-learning-pad);
	}

	.tutor-learning-area.tutor-has-site-shell:not(.is-fullscreen) .tutor-learning-sidebar {
		padding: 8px 0 56px;
	}

	.tutor-learning-area.tutor-has-site-shell:not(.is-fullscreen) .tutor-learning-area-content,
	.tutor-learning-area.tutor-has-site-shell.is-fullscreen .tutor-learning-area-content {
		padding-inline: 0;
		padding-top: 8px;
	}

	.tutor-learning-area.tutor-has-site-shell .tutor-learning-area-container {
		max-width: none;
	}

	.tutor-learning-area.tutor-has-site-shell .tutor-learning-sidebar .tutor-learning-sidebar-curriculum,
	.tutor-learning-area.tutor-has-site-shell .tutor-learning-sidebar .tutor-learning-sidebar-pages {
		border: 1px solid var(--tutor-border-idle);
		border-radius: var(--lms-radius-md);
	}

	.tutor-learning-area.tutor-has-site-shell .tutor-learning-sidebar .tutor-learning-sidebar-curriculum {
		box-shadow: var(--lms-shadow-card);
	}
}

.tutor-learning-area .tutor-learning-header-title {
	font-weight: 700;
	letter-spacing: -0.01em;
}

/* ---------- Panel kursanta: Obserwowane firmy (tutor/dashboard/obserwowane.php) ---------- */

.lms-followed__head {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 20px;
}

.lms-followed__count {
	font-size: 14px;
	color: var(--tutor-text-subdued, var(--lms-muted));
}

.lms-followed__list {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lms-followed__item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	border: 1px solid var(--tutor-border-idle, var(--lms-border));
	border-radius: var(--lms-radius-md);
	background: var(--tutor-surface-l1, var(--lms-surface));
}

.lms-followed__body {
	flex: 1;
	min-width: 0;
}

.lms-followed__name {
	margin: 0 0 2px;
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: 0;
}

.lms-followed__name a {
	color: var(--tutor-text-primary, var(--lms-text));
}

.lms-followed__name a:hover {
	color: var(--lms-purple);
}

.lms-followed__tagline {
	margin: 0 0 4px;
	font-size: 14px;
	color: var(--tutor-text-secondary, var(--lms-text-2));
}

.lms-followed__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--tutor-text-subdued, var(--lms-muted));
}

.lms-followed__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.lms-followed__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 48px 24px;
	border: 1px dashed var(--tutor-border-hover, var(--lms-border-strong));
	border-radius: var(--lms-radius-card);
	background: var(--tutor-surface-l1, var(--lms-surface));
	text-align: center;
	color: var(--lms-purple);
}

.lms-followed__empty h5 {
	margin: 8px 0 0;
	font-size: 18px;
}

.lms-followed__empty p {
	max-width: 440px;
	margin: 0 0 12px;
	font-size: 14px;
	color: var(--tutor-text-secondary, var(--lms-text-2));
}

@media (max-width: 767px) {
	.lms-followed__item {
		flex-wrap: wrap;
	}

	.lms-followed__actions {
		width: 100%;
	}

	.lms-followed__actions .lms-btn {
		flex: 1;
	}
}