/* ============================================================
   TUTOR LMS — mokymosi sritis / pamokos ekranas (2 sluoksnis)
   Kraunasi tik pamokos/quiz/assignment puslapiuose, PO tutor-base.css.
   Šriftai: Syne (pagrindinis tekstas) ir Oswald (antraštės) — abu jau
   kraunami per Elementor Kit tipografiją, papildomo enqueue nereikia.
   Originaliai čia buvo Inter, bet gyvoje svetainėje Inter neįdiegtas
   (tik Syne + Oswald), tad pakeista į Syne — dėl (a) svetainės jau
   įprasto Syne+Oswald šriftų poros ir (b) kad neatsirastų trečias
   šriftas su nauju Google Fonts užklausimu vien dviem CSS taisyklėms.
   Spalvos: #4055A4 antraštės / #726AAF tekstas / #9691C6 antrinis
            #EDECF0 borderiai-hover / #F06365 aktyvu-CTA
            #F8A8A8 varnelės / #E16D68 hover
   ============================================================ */

.tutor-frontend .tutor-learning-area {
	font-family: "Syne", sans-serif;
}

/* ============================================================
   1. VIRŠUTINĖ JUOSTA
   ============================================================ */
.tutor-frontend .tutor-learning-header {
	background: #fff;
	border-bottom: 1px solid #EDECF0;
}
.tutor-frontend .tutor-learning-header-inner {
	height: 64px;
	padding: 0 24px;
	display: flex;
	align-items: center;
	gap: 18px;
}
.tutor-frontend .tutor-learning-header-content {
	display: flex;
	align-items: center;
	gap: 18px;
	min-width: 0;
}
/* „Atgal" — realybėje ne nuoroda, o a.tutor-btn-ghost DIV'e .tutor-learning-header-back */
.tutor-frontend .tutor-learning-header-back .tutor-btn {
	font-size: 14px;
	color: #726AAF !important;
	background: transparent !important;
	text-decoration: none;
}
.tutor-frontend .tutor-learning-header-back .tutor-btn:hover,
.tutor-frontend .tutor-learning-header-back .tutor-btn:focus {
	color: #F06365 !important;
	background: transparent !important;
}
.tutor-frontend .tutor-learning-header-title {
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 19px;
	color: #4055A4;
	letter-spacing: .01em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}

/* ============================================================
   2. SIDEBAR
   ============================================================ */
.tutor-frontend .tutor-learning-sidebar {
	background: #fff;
	border-right: 1px solid #EDECF0;
}
/* Fiksuotas plotis tik desktope — mobile Tutor pats verčia į drawer */
@media (min-width: 821px) {
	.tutor-frontend .tutor-learning-sidebar {
		width: 340px;
		flex: 0 0 340px;
	}
}

/* Progresas */
.tutor-frontend .tutor-learning-progress {
	padding: 22px 24px 20px;
	border-bottom: 1px solid #EDECF0;
}
.tutor-frontend .tutor-learning-progress-text {
	font-size: 13px;
	color: #726AAF;
}
/* Procentų skaičius — span viduje („<span>0%</span> Completed") */
.tutor-frontend .tutor-learning-progress-text span {
	color: #4055A4;
	font-weight: 600;
}

/* Temos */
.tutor-frontend .tutor-learning-nav-topic {
	border-bottom: 1px solid #EDECF0;
}
.tutor-frontend .tutor-learning-nav-topic:last-child {
	border-bottom: 0;
}
.tutor-frontend .tutor-learning-nav-header {
	padding: 16px 24px;
}
.tutor-frontend .tutor-learning-nav-header-title {
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 15px;
	color: #4055A4;
}
.tutor-frontend .tutor-learning-nav-header-summary {
	font-size: 12px;
	color: #9691C6;
}
.tutor-frontend .tutor-learning-nav-header-arrow {
	color: #9691C6;
}
/* Atidarytos temos rodyklė — Tutor būseną žymi .expanded (Alpine), ne .active */
.tutor-frontend .tutor-learning-nav-topic.expanded .tutor-learning-nav-header-arrow svg,
.tutor-frontend .tutor-learning-nav-topic.active .tutor-learning-nav-header-arrow svg {
	transform: rotate(90deg);
}

/* ============================================================
   3. PAMOKOS EILUTĖ
   ============================================================ */
.tutor-frontend .tutor-learning-nav-item {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	padding: 11px 24px 11px 21px;
	border-left: 3px solid transparent;
	text-decoration: none;
}
.tutor-frontend .tutor-learning-nav-item:hover {
	background: #EDECF0;
}
.tutor-frontend .tutor-learning-nav-item > svg {
	width: 17px;
	height: 17px;
	flex-shrink: 0;
	margin-top: 2px;
}
/* Pavadinimas ir trukmė struktūrinių klasių NETURI (šablone tik div > div),
   tad kabinamės už struktūros: pirmas div — pavadinimas, antras — tipas/trukmė */
.tutor-frontend .tutor-learning-nav-item > div > div:first-child {
	font-size: 14px;
	line-height: 1.45;
	color: #726AAF;
}
.tutor-frontend .tutor-learning-nav-item > div > div:first-child + div {
	font-size: 12px;
	color: #9691C6;
	margin-top: 3px;
}

/* Aktyvi pamoka */
.tutor-frontend .tutor-learning-nav-item.active {
	border-left-color: #F06365;
	background: rgba(248, 168, 168, 0.20);
}
.tutor-frontend .tutor-learning-nav-item.active > div > div:first-child {
	color: #4055A4;
	font-weight: 500;
}

/* Baigta pamoka. SVARBU: Tutor 4.0.4 pamokų eilutėms .completed klasės NEDEDA
   (status_class tuščias, keičiasi tik ikona) — todėl gaudome per :has() pagal
   baigtumo ikonos žalią apskritimą. .completed/.is-completed palikti quiz
   eilutėms ir ateities versijoms. */
.tutor-frontend .tutor-learning-nav-item.completed > div > div:first-child,
.tutor-frontend .tutor-learning-nav-item.is-completed > div > div:first-child,
.tutor-frontend .tutor-learning-nav-item:has(circle[fill='#0BB01B']) > div > div:first-child {
	color: #9691C6;
}

/* Baigtumo varnelė — inline SVG (completed-colorize.svg): žalias apskritimas
   #0BB01B + tamsžalis „šešėlio" brūkšnys #007E0C + balta varnelė.
   Prezentaciniai atributai silpnesni už CSS — perdažome BE !important. */
.tutor-frontend .tutor-learning-area svg circle[fill='#0BB01B'] {
	fill: #F8A8A8;
}
.tutor-frontend .tutor-learning-area svg path[stroke='#007E0C'] {
	stroke: #ffffff;
}

/* ============================================================
   4. TAB'AI (Overview / Priedai / Komentarai)
   Tarp video ir turinio: .tutor-tabs-nav > button.tutor-tabs-tab
   (+ .tutor-tabs-tab-active). TIKROJI PRIEŽASTIS (patikrinta gyvai
   nekenciumarketingo.lt): Elementor Kit'o bendra mygtukų taisyklė
   `.elementor-kit-612 button { color: var(--e-global-color-...) }`
   (balta) turi TOKĮ PATĮ specifiškumą (0,1,1) kaip Tutor paties
   `button.tutor-tabs-tab-active` ir laimi — Tutor kintamieji
   (--tutor-text-primary/--tutor-text-brand) patys savaime skaičiuojasi
   TEISINGAI (tamsūs), bet mygtuko galutinę spalvą vis tiek permuša
   Elementor. Vienintelis aktyvaus tab'o ikonos SVG liko matomas, nes
   Tutor jam turi atskirą, tikslesnę taisyklę (.tutor-tabs-tab-active svg).
   Tad einam tiesioginiu hex + !important VISOMS būsenoms (tekstui IR
   ikonoms atskirai — ikona nebūtinai paveldi iš mygtuko, jei Tutor pats
   turi jai skirtą taisyklę), kad nieko nepriklausytų nuo Elementor Kit
   ID ar Tutor versijos.
   Radius/pločio (flex:1, padding, 8px radius) Tutor numatytas nekeičiamas —
   pilio forma lieka.
   ============================================================ */
.tutor-frontend .tutor-tabs-nav {
	background: #fff !important;
	border-color: #EDECF0 !important;
}
.tutor-frontend .tutor-tabs-tab {
	color: #726AAF !important;
	background: transparent !important;
}
.tutor-frontend .tutor-tabs-tab svg {
	color: #726AAF !important;
}
.tutor-frontend .tutor-tabs-tab:disabled {
	color: #9691C6 !important;
}
.tutor-frontend .tutor-tabs-tab:disabled svg {
	color: #9691C6 !important;
}
/* Hover/focus — pastebimas, bet ramus atspalvis; tekstas jau matomas
   ir ramybės būsenoje, hover tik parodo, kad punktas paspaudžiamas */
.tutor-frontend .tutor-tabs-tab:hover:not(:disabled):not(.tutor-tabs-tab-active),
.tutor-frontend .tutor-tabs-tab:focus:not(:disabled):not(.tutor-tabs-tab-active) {
	color: #4055A4 !important;
	background: rgba(114, 106, 175, 0.09) !important;
}
.tutor-frontend .tutor-tabs-tab:hover:not(:disabled):not(.tutor-tabs-tab-active) svg,
.tutor-frontend .tutor-tabs-tab:focus:not(:disabled):not(.tutor-tabs-tab-active) svg {
	color: #4055A4 !important;
}
/* Aktyvus tab'as — #EDECF0 pilis (ta pati logika kaip dashboard'o
   nustatymų tab'uose ir pamokų sąrašo aktyvioje eilutėje) */
.tutor-frontend .tutor-tabs-tab-active,
.tutor-frontend .tutor-tabs-tab-active:hover,
.tutor-frontend .tutor-tabs-tab-active:focus {
	color: #4055A4 !important;
	background: #EDECF0 !important;
}
.tutor-frontend .tutor-tabs-tab-active svg,
.tutor-frontend .tutor-tabs-tab-active:hover svg,
.tutor-frontend .tutor-tabs-tab-active:focus svg {
	color: #4055A4 !important;
}

/* „Rašyti užrašą" (pieštuko ikona tab'ų eilutės dešinėje,
   #tutor-lesson-nav-take-note-btn, .tutor-btn-ghost-brand variantas) —
   TA PATI Elementor Kit'o `button{color}` liga, nepadengta tutor-base.css
   (ten yra tik -primary/-secondary/-ghost/-outline/-link, ne -ghost-brand).
   Specifinis šitai pamokos ekrano mygtukui, tad čia, ne tutor-base.css. */
.tutor-frontend .tutor-btn-ghost-brand {
	color: #726AAF !important;
	background: transparent !important;
}
.tutor-frontend .tutor-btn-ghost-brand svg {
	color: #726AAF !important;
}
.tutor-frontend .tutor-btn-ghost-brand:hover,
.tutor-frontend .tutor-btn-ghost-brand:focus {
	color: #4055A4 !important;
	background: rgba(114, 106, 175, 0.09) !important;
}
.tutor-frontend .tutor-btn-ghost-brand:hover svg,
.tutor-frontend .tutor-btn-ghost-brand:focus svg {
	color: #4055A4 !important;
}

/* ============================================================
   5. TURINIO ZONA
   ============================================================ */
.tutor-frontend .tutor-learning-area-content {
	background: #fff;
}
.tutor-frontend .tutor-learning-area-container {
	max-width: 860px;
	margin: 0 auto;
	padding: 32px 32px 56px;
}
.tutor-frontend .tutor-ratio-16x9 {
	border-radius: 15px;
	overflow: hidden;
	background: #4055A4;
}
.tutor-frontend .tutor-lesson-content h1 {
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 28px;
	line-height: 1.25;
	color: #4055A4;
}
.tutor-frontend .tutor-lesson-content h2 {
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	font-size: 20px;
	color: #4055A4;
	margin: 26px 0 10px;
}
.tutor-frontend .tutor-lesson-content p,
.tutor-frontend .tutor-lesson-content li {
	font-family: "Syne", sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #726AAF;
}
.tutor-frontend .tutor-lesson-content ul {
	margin: 0 0 14px 20px;
}
.tutor-frontend .tutor-lesson-content li {
	margin-bottom: 6px;
}

/* ============================================================
   6. PRIEDAI (exercise files / PDF)
   Realus blokas: .tutor-lesson-exercise-files su .tutor-attachment-card
   ============================================================ */
.tutor-frontend .tutor-lesson-exercise-files .tutor-attachment-card {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 15px 18px;
	border: 1px solid #EDECF0;
	border-radius: 15px;
	transition: border-color .2s ease;
}
.tutor-frontend .tutor-lesson-exercise-files .tutor-attachment-card:hover {
	border-color: #F8A8A8;
}
.tutor-frontend .tutor-lesson-exercise-files .tutor-attachment-card-icon {
	width: 38px;
	height: 38px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 11px;
	background: #EDECF0;
	font-family: "Oswald", sans-serif;
	font-size: 11px;
	color: #4055A4;
}
.tutor-frontend .tutor-lesson-exercise-files .tutor-attachment-card-title {
	font-size: 14px;
	font-weight: 500;
	color: #4055A4;
}
.tutor-frontend .tutor-lesson-exercise-files .tutor-attachment-card-meta {
	font-size: 12px;
	color: #9691C6;
}

/* ============================================================
   7. APATINĖ JUOSTA
   Tvarka DOM'e: a(Ankstesnė, ghost) → form(Pažymėti) → a(Kita, ghost)
   → button.tutor-expand-btn. „Kita" ghost'ą verčiame primary per CSS.
   ============================================================ */
.tutor-frontend .tutor-learning-area-footer {
	background: #fff;
	padding: 14px 24px;
	border-top: 1px solid #EDECF0;
	/* PASTABA: struktūra ir spalvos čia jau buvo teisingos (patikrinta
	   per getComputedStyle — flex/border/background veikia), bet 1px
	   #EDECF0 borderis ant balto puslapio fono beveik nesimato, o kai
	   Ankstesnė/Kita paslėpti (vienintelė pamoka kurse), juosta atrodo
	   kaip laisvai kabantis mygtukas. Papildomas šešėlis stiprina ribą
	   nekeičiant spalvų paletės. */
	box-shadow: 0 -1px 0 #EDECF0, 0 -4px 12px rgba(64, 85, 164, 0.05);
	display: flex;
	align-items: center;
	gap: 12px;
}
/* „Ankstesnė" kairėje — tarpiklis po jos nustumia likusius dešinėn */
.tutor-frontend .tutor-learning-area-footer > a.tutor-btn:first-of-type {
	margin-right: auto;
}
/* „Pažymėti kaip baigtą" — outline (perrašo tutor-base primary užpildą) */
.tutor-frontend .tutor-learning-area-footer .tutor-mark-as-complete-button {
	background: transparent !important;
	border: 1px solid #F06365 !important;
	color: #F06365 !important;
}
.tutor-frontend .tutor-learning-area-footer .tutor-mark-as-complete-button:hover,
.tutor-frontend .tutor-learning-area-footer .tutor-mark-as-complete-button:focus {
	background: #F06365 !important;
	color: #EDECF0 !important;
}
.tutor-frontend .tutor-learning-area-footer .tutor-mark-as-complete-button.completed,
.tutor-frontend .tutor-learning-area-footer .tutor-mark-as-complete-button:disabled {
	background: #EDECF0 !important;
	border-color: #EDECF0 !important;
	color: #9691C6 !important;
}
/* „Kita" dešinėje — primary išvaizda */
.tutor-frontend .tutor-learning-area-footer > a.tutor-btn:last-of-type {
	background: #F06365 !important;
	color: #EDECF0 !important;
}
.tutor-frontend .tutor-learning-area-footer > a.tutor-btn:last-of-type:hover,
.tutor-frontend .tutor-learning-area-footer > a.tutor-btn:last-of-type:focus {
	background: #E16D68 !important;
	color: #EDECF0 !important;
}

/* ============================================================
   8. „MORE" BLOKAS
   Čia Tutor pranešimų / atsiliepimų / Q&A nuorodų blokas sidebar'o
   apačioje (.tutor-learning-sidebar-pages) — klientės mokiniams jo
   rodyti nereikia. Norint grąžinti — ištrink arba užkomentuok šią
   taisyklę.
   ============================================================ */
.tutor-frontend .tutor-learning-sidebar-pages {
	display: none !important;
}

/* ============================================================
   9. MOBILE (≤820px)
   Drawer'io logiką Tutor tvarko pats (toggle mygtukas + savo
   breakpoint'ai) — čia tik spalvos ir tarpai.
   ============================================================ */
@media (max-width: 820px) {
	.tutor-frontend .tutor-learning-area-container {
		padding: 20px 20px 40px;
	}
	.tutor-frontend .tutor-learning-header-inner {
		padding: 0 16px;
	}
	.tutor-frontend .tutor-learning-header-toggle-mobile .tutor-btn {
		color: #4055A4 !important;
	}
}
