/**
 * =============================================================================
 * CCTRL365 – TUTOR.CSS
 * =============================================================================
 * Scope: INSIDAN. Endast Tutor LMS-komponenter.
 * Kräver: global.css → app.css → tutor.css (i den ordningen).
 *
 * MÅL
 * - Gör Tutor-korten visuellt identiska med övriga kort (cctrl-card-basen).
 * - Håll klass-specifika regler snäva så uppdateringar i Tutor inte sabbar public.
 *
 * OBS
 * Tutor byter ibland klassnamn mellan större versioner. Vi matchar primära
 * strukturer (.tutor-course-card / .tutor-card / .tutor-course-thumbnail osv.)
 * utan att använda extrema kombinationer.
 * =============================================================================
 */

/* ============================================================================
   0) KURSARKIV – inget tomt utrymme till vänster (tema-sidebar döljs); Tutor-filter visas.
   OBS: Gäller INTE BuddyBoss (Gemenskap) – där ska sidofält/widgets synas. Undantag: .app-header-buddyboss
   ========================================================================== */
body.app-shell-header:not(.app-header-buddyboss) #secondary,
body.app-shell-header:not(.app-header-buddyboss) .widget-area {
	display: none !important;
}
body.app-shell-header:not(.app-header-buddyboss) .site-content .container {
	max-width: none !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
body.app-shell-header:not(.app-header-buddyboss) .site-content-grid.bb-grid {
	display: block !important;
}
body.app-shell-header:not(.app-header-buddyboss) .site-content-grid.bb-grid > * {
	width: 100% !important;
	max-width: 100% !important;
}
body.app-shell-header:not(.app-header-buddyboss) #content {
	margin-left: 0 !important;
	padding-left: 0 !important;
}
/* Tutor-pluginens .tutor-container begränsar bredd och centrerar – gör full bredd på app-shell */
body.app-shell-header .course-archive-page.tutor-container,
body.app-shell-header .tutor-wrap-parent.tutor-container {
	max-width: none !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: clamp(16px, 4vw, 24px) !important;
	padding-right: clamp(16px, 4vw, 24px) !important;
	box-sizing: border-box;
}

/* Kursarkiv: ge filter/sortering tydlig luft under app-bandet */
body.app-shell-header .course-archive-page .tutor-course-filter-container,
body.app-shell-header .course-archive-page .tutor-course-filter[tutor-course-filter] {
  margin-top: clamp(10px, 1.6vw, 16px);
}

/* ============================================================================
   0b) AKADEMI NAVBAR – nav-raden (.akademi-nav*) styras av KANONISK
   .app-band:has(.akademi-nav) i app-shell.css (delad). Endast breadcrumb här.
   ========================================================================== */
.akademi-breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2px 0;
	font-size: 0.875rem;
	color: var(--muted);
}
.akademi-breadcrumb-link {
	color: var(--text);
	text-decoration: none;
}
.akademi-breadcrumb-link:hover {
	text-decoration: underline;
}
.akademi-breadcrumb-sep {
	user-select: none;
	margin: 0 2px;
}
.akademi-breadcrumb-current {
	color: var(--color-text, #111);
	font-weight: 500;
}

/* ============================================================================
   1) LISTGRID – samma rutnät som appens “card grid”
   ========================================================================== */
body:not(.is-public) .tutor-courses-loop,
body:not(.is-public) .tutor-courses,
body:not(.is-public) .tutor-course-list,
body:not(.is-public) .tutor-course-archive {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 1023px) {
  body:not(.is-public) .tutor-courses-loop,
  body:not(.is-public) .tutor-courses,
  body:not(.is-public) .tutor-course-list,
  body:not(.is-public) .tutor-course-archive {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  body:not(.is-public) .tutor-courses-loop,
  body:not(.is-public) .tutor-courses,
  body:not(.is-public) .tutor-course-list,
  body:not(.is-public) .tutor-course-archive {
    grid-template-columns: 1fr;
  }
}

/* ============================================================================
   2) KORT – harmoniserade med cctrl-card
   ========================================================================== */
/* Yttre kortcontainer */
body:not(.is-public) .tutor-course-card,
body:not(.is-public) .tutor-card,
body:not(.is-public) .tutor-course {
  background: #fff;
  border-radius: var(--card-radius);
  box-shadow: var(--shadow-sm);
  border: 1px solid color-mix(in srgb, var(--text) 8%, transparent);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
body:not(.is-public) .tutor-course-card:hover,
body:not(.is-public) .tutor-card:hover,
body:not(.is-public) .tutor-course:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

/* Bildyta/top thumbnail */
body:not(.is-public) .tutor-course-card .tutor-card-image,
body:not(.is-public) .tutor-card .tutor-card-image,
body:not(.is-public) .tutor-course-card .tutor-course-thumbnail,
body:not(.is-public) .tutor-course .tutor-course-thumbnail {
  position: relative;
  aspect-ratio: var(--card-aspect);
  background: var(--lav-100);
  overflow: hidden;
}
body:not(.is-public) .tutor-course-card .tutor-card-image img,
body:not(.is-public) .tutor-card .tutor-card-image img,
body:not(.is-public) .tutor-course-card .tutor-course-thumbnail img,
body:not(.is-public) .tutor-course .tutor-course-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Badge längst upp (t.ex. svårighetsgrad) – vänster */
body:not(.is-public) .tutor-course-card .tutor-course-level,
body:not(.is-public) .tutor-card .tutor-course-level,
body:not(.is-public) .tutor-course .tutor-course-level {
  position: absolute;
  top: var(--space-3);
  left: var(--space-3);
  z-index: var(--z-dropdown);
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-pill);
  font-size: var(--text-tiny);
  font-weight: var(--weight-bold);
  line-height: 1;
  background: var(--lav-100);
  color: var(--lav-900);
  backdrop-filter: blur(8px);
}

/* Bookmark-ikon – höger */
body:not(.is-public) .tutor-course-card .tutor-course-wishlist,
body:not(.is-public) .tutor-card .tutor-course-wishlist,
body:not(.is-public) .tutor-course .tutor-course-wishlist {
  position: absolute;
  top: var(--space-3);
  right: var(--space-3);
  z-index: var(--z-dropdown);
}

/* Innehållsdel */
body:not(.is-public) .tutor-course-card .tutor-card-body,
body:not(.is-public) .tutor-card .tutor-card-body,
body:not(.is-public) .tutor-course-card .tutor-card-content,
body:not(.is-public) .tutor-course .tutor-card-content {
  display: flex;
  flex-direction: column;
  gap: var(--card-gap);
  padding: var(--card-padding);
  flex: 1;
}

/* Rubrik (H3) – Source Sans Pro, inte Cooper Hewitt (endast H1/H2) */
body:not(.is-public) .tutor-course-card .tutor-course-name a,
body:not(.is-public) .tutor-card .tutor-course-name a,
body:not(.is-public) .tutor-course .tutor-course-name a,
body:not(.is-public) .tutor-course-card .tutor-course-title a,
body:not(.is-public) .tutor-card .tutor-course-title a,
body:not(.is-public) .tutor-course .tutor-course-title a {
  font-family: var(--font-body);
  font-size: var(--text-h3);
  font-weight: var(--weight-h3);
  color: var(--lav-900);
  line-height: var(--line-h3);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: var(--card-title-lines);
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Excerpt/ingress */
body:not(.is-public) .tutor-course-card .tutor-course-content,
body:not(.is-public) .tutor-card .tutor-course-content,
body:not(.is-public) .tutor-course .tutor-course-content {
  font-family: var(--font-body);
  font-size: var(--text-small);
  line-height: var(--line-small);
  color: var(--text);
  margin: 0;
  opacity: .9;
  display: -webkit-box;
  -webkit-line-clamp: var(--card-excerpt-lines);
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Dölj "By [author] In [category]" på kurskort – inte prioriterat för användaren */
body.app-shell-header .tutor-course-card .tutor-meta-course-by-cat,
body.app-shell-header .tutor-card .tutor-meta-course-by-cat {
  display: none !important;
}

/* Meta (t.ex. lessons, duration, rating) – ner mot botten */
body:not(.is-public) .tutor-course-card .tutor-meta,
body:not(.is-public) .tutor-card .tutor-meta,
body:not(.is-public) .tutor-course .tutor-meta {
  margin-top: auto;
  display: flex;
  gap: var(--space-3);
  font-size: var(--text-tiny);
  opacity: .7;
  padding-top: var(--space-1);
  flex-wrap: wrap;
}

/* Footer med CTA */
body:not(.is-public) .tutor-course-card .tutor-card-footer,
body:not(.is-public) .tutor-card .tutor-card-footer,
body:not(.is-public) .tutor-course .tutor-card-footer {
  margin-top: var(--space-2);
  padding: var(--space-3) var(--card-padding);
  border-top: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
}
body:not(.is-public) .tutor-course-card .tutor-card-footer .tutor-btn,
body:not(.is-public) .tutor-card .tutor-card-footer .tutor-btn,
body:not(.is-public) .tutor-course .tutor-card-footer .tutor-btn {
  border-radius: var(--radius-pill);
  background: var(--lav-900, #3d3e66);
  color: #fff;
  border: none;
  padding: var(--space-2) var(--space-4);
  font-weight: var(--weight-bold);
  text-decoration: none;
}
body:not(.is-public) .tutor-course-card .tutor-card-footer .tutor-btn:hover,
body:not(.is-public) .tutor-card .tutor-card-footer .tutor-btn:hover,
body:not(.is-public) .tutor-course .tutor-card-footer .tutor-btn:hover {
  background: var(--terracotta-500);
  color: #fff;
  text-decoration: none;
}

/* ============================================================================
   3) PAGINATION – prev/next RUNDA (samma som aktuell sida), container rundade hörn
   INGEN RAM. Hover = mörkaste lila. Utan !important (tema laddar efter plugin).
   ========================================================================== */
/* Wrapper runt paginering – ingen ram (Tutor/BuddyBoss lägger ibland ram här) */
body:not(.is-public) .tutor-pagination-wrapper,
body:not(.is-public) .tutor-admin-page-pagination-wrapper {
  border: none;
  box-shadow: none;
  background: transparent;
}

body:not(.is-public) .tutor-pagination,
body:not(.is-public) .tutor-pagination-wrap,
body:not(.is-public) .tutor-nav-links {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
  margin-top: var(--space-4);
  border: none;
  box-shadow: none;
}

/* Dölj "Page 2 of 4" – innehållet finns kvar i DOM för skärmläsare */
body:not(.is-public) .tutor-pagination .tutor-pagination-hints {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Container för sidnumren – rundade hörn (pill). Ingen background-clip så att hela ytan får rundning. Bredare. */
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers,
body:not(.is-public) .tutor-pagination-wrap .tutor-pagination-numbers {
  display: flex;
  align-items: center;
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 6px 24px;
  padding-left: 56px;
  padding-right: 56px;
  background: #fff;
  border-radius: 9999px;
  border: none;
  box-shadow: none;
  overflow: hidden;
}

/* Siffror – alltid cirkelform (samma som current/hover, så ingen flimmer när hover lämnar). */
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > *,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  border: none;
  color: var(--lav-800, #3d3e66);
  font-size: var(--text-small);
  font-weight: 500;
  transition: background 0.15s ease, color 0.15s ease;
  box-shadow: none;
  flex-shrink: 0;
  overflow: hidden;
}

body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a:hover {
  background: var(--lav-900, #3d3e66);
  color: #fff;
  border: none;
  border-radius: 50%;
}

/* Aktuell sida: mörklila, vit text, CIRKEL runt siffran */
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .current,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .page-numbers.current,
body:not(.is-public) .tutor-nav-links .current {
  background: var(--lav-600, #55578f);
  color: #fff;
  border: none;
  border-radius: 50%;
  box-shadow: none;
}

/* Prev/next – RUNDA. Dra ut utanför den vita pillen (negativ margin = padding på containern). */
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.prev,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.next,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.prev,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next {
  position: relative;
  min-width: 40px;
  width: 40px;
  max-width: 40px;
  height: 40px;
  padding: 0;
  margin-left: -56px;
  margin-right: 0;
  border-radius: 50%;
  background: #fff;
  border: none;
  box-shadow: none;
  flex-shrink: 0;
  overflow: hidden;
}

body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.next,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next {
  margin-left: 0;
  margin-right: -56px;
}

body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.prev:hover,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.next:hover {
  background: var(--lav-900, #3d3e66);
  color: #fff;
  border: none;
}

/* Inaktiv Föregående på sida 1 / inaktiv Nästa på sista sidan (infogas via JS om saknas) */
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.prev.disabled,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next.disabled {
  cursor: default;
  opacity: 0.6;
  background: var(--lav-100, #f3f4fb);
  color: var(--lav-600, #55578f);
}

body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.prev.disabled:hover,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next.disabled:hover {
  background: var(--lav-100, #f3f4fb);
  color: var(--lav-600, #55578f);
}

body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .dots,
body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .page-numbers.dots {
  background: transparent;
  border: none;
  cursor: default;
}

body:not(.is-public) nav.tutor-pagination .tutor-icon-angle-left,
body:not(.is-public) nav.tutor-pagination .tutor-icon-angle-right {
  font-size: 1.25rem;
  width: 1em;
  height: 1em;
}

/* ============================================================================
   4) MINDRE FIXAR (säker men diskret normalisering)
   ========================================================================== */
/* Ta bort onödiga inner-margins som spräcker kortets rytm */
body:not(.is-public) .tutor-card-body > .elementor-widget-spacer:first-child,
body:not(.is-public) .tutor-card-body > .elementor-widget-divider:first-child {
  display: none;
}

/* Säkra att bilder inte “hoppar” i grid när de saknas */
body:not(.is-public) .tutor-course-card .tutor-course-thumbnail img[width],
body:not(.is-public) .tutor-course-card .tutor-course-thumbnail img[height] {
  height: 100% !important;
  width: 100% !important;
}

/* Tooltip/rating-ikoner får inte bryta layouten */
body:not(.is-public) .tutor-meta i,
body:not(.is-public) .tutor-meta svg { transform: translateY(1px); }

/* ============================================================================
   5) SINGLE LESSON/QUIZ (APP-SHELL) – inget BuddyBoss-utrymme, course topic kvar i wrapper
   BuddyBoss-temat sätter .tutor-course-single-sidebar-wrapper left: 230px vid
   buddypanel-open och .site-content padding-top: 76px. Här: endast app-styling.
   ========================================================================== */
/* Sidopanelen (Course Content) ska börja vid vänster kant – ingen tom zon för buddypanel */
body.app-shell-header .tutor-course-single-sidebar-wrapper {
	left: 0 !important;
}
/* Ingen luft under app-band – innehållet ska börja direkt under bandet */
body.app-shell-header .site-content,
body.app-shell-header #content {
	padding-top: 0 !important;
}
/* Wrapper: behåll layout så att course topic sitter kvar i course single wrapper */
body.app-shell-header .tutor-course-single-content-wrapper {
	display: flex !important;
	flex-wrap: nowrap !important;
	width: 100% !important;
	max-width: 100% !important;
}
body.app-shell-header .tutor-course-single-sidebar-wrapper.tutor-lesson-sidebar {
	flex-shrink: 0 !important;
}
body.app-shell-header #tutor-single-entry-content {
	flex: 1 !important;
	min-width: 0 !important;
}

/* ============================================================================
   6) DARK MODE – Akademi / Kurskatalog (html[data-theme="dark"])
   Använder --bg, --bg-elev, --text, --muted, --outline från cctrl-core.css
   ========================================================================== */

/* Kurskort – mörk bakgrund, ljus text */
html[data-theme="dark"] body:not(.is-public) .tutor-course-card,
html[data-theme="dark"] body:not(.is-public) .tutor-card,
html[data-theme="dark"] body:not(.is-public) .tutor-course {
  background: var(--bg-elev) !important;
  border-color: var(--outline) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-card-body,
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-card-content,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-card-body,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-card-content,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-card-content {
  background: transparent;
}

/* Korttitel och länk */
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-course-name a,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-course-name a,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-course-name a,
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-course-title a,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-course-title a,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-course-title a {
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-course-name a:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-course-name a:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-course-name a:hover {
  color: var(--lav-300, #b8b9d9) !important;
}

/* Excerpt / beskrivning */
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-course-content,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-course-content,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-course-content {
  color: var(--muted) !important;
}

/* Meta och footer */
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-meta,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-meta,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-meta {
  color: var(--muted);
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-card-footer,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-card-footer,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-card-footer {
  border-top-color: var(--outline);
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-card-footer .tutor-btn,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-card-footer .tutor-btn,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-card-footer .tutor-btn {
  background: var(--lav-600, #55578f);
  color: #fff;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-card-footer .tutor-btn:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-card-footer .tutor-btn:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-card-footer .tutor-btn:hover {
  background: var(--lav-500, #6264a7);
  color: #fff;
}

/* Badge / level-pill på kort */
html[data-theme="dark"] body:not(.is-public) .tutor-course-card .tutor-course-level,
html[data-theme="dark"] body:not(.is-public) .tutor-card .tutor-course-level,
html[data-theme="dark"] body:not(.is-public) .tutor-course .tutor-course-level {
  background: rgba(255, 255, 255, 0.15);
  color: var(--text);
}

/* Pagination – mörk pill och knappar */
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers,
html[data-theme="dark"] body:not(.is-public) .tutor-pagination-wrap .tutor-pagination-numbers {
  background: var(--bg-elev) !important;
  border: 1px solid var(--outline);
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > *,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span {
  color: var(--text);
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a:hover {
  background: var(--lav-700);
  color: #fff;
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .current,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers .page-numbers.current,
html[data-theme="dark"] body:not(.is-public) .tutor-nav-links .current {
  background: var(--lav-600);
  color: #fff;
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.prev,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.next,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.prev,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next {
  background: var(--bg-elev) !important;
  color: var(--text);
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.prev:hover,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > a.next:hover {
  background: var(--lav-700);
  color: #fff;
}

html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.prev.disabled,
html[data-theme="dark"] body:not(.is-public) nav.tutor-pagination .tutor-pagination-numbers > span.next.disabled {
  background: rgba(255, 255, 255, 0.08);
  color: var(--muted);
}

/* Akademi breadcrumb (dark). Nav-raden styras av app-shell.css. */
html[data-theme="dark"] .akademi-breadcrumb,
html[data-theme="dark"] .akademi-breadcrumb-sep {
  color: var(--muted);
}
html[data-theme="dark"] .akademi-breadcrumb-link {
  color: var(--lav-300, #b8b9d9);
}
html[data-theme="dark"] .akademi-breadcrumb-link:hover {
  color: var(--lav-200, #d0d1e8);
}
html[data-theme="dark"] .akademi-breadcrumb-current {
  color: var(--text);
}

/* Sökfält, filter, dropdowns – mörk bakgrund */
html[data-theme="dark"] body:not(.is-public) .tutor-wrap input[type="text"],
html[data-theme="dark"] body:not(.is-public) .tutor-wrap input[type="search"],
html[data-theme="dark"] body:not(.is-public) .tutor-wrap select,
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page input[type="text"],
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page input[type="search"],
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page select,
html[data-theme="dark"] body:not(.is-public) .course-archive-page input[type="text"],
html[data-theme="dark"] body:not(.is-public) .course-archive-page input[type="search"],
html[data-theme="dark"] body:not(.is-public) .course-archive-page select {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-color: var(--outline) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-wrap input::placeholder,
html[data-theme="dark"] body:not(.is-public) .tutor-wrap input::-webkit-input-placeholder,
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page input::placeholder {
  color: var(--muted);
}

/* Filter-sidebar (Category, Level m.m.) – mörk bakgrund och text */
html[data-theme="dark"] body:not(.is-public) .tutor-dashboard-filter,
html[data-theme="dark"] body:not(.is-public) .tutor-course-filter,
html[data-theme="dark"] body:not(.is-public) .tutor-filter-panel,
html[data-theme="dark"] body:not(.is-public) [class*="tutor-filter"],
html[data-theme="dark"] body:not(.is-public) [class*="tutor-dashboard-sidebar"] {
  background: var(--bg-elev);
  border-color: var(--outline);
  color: var(--text);
}

html[data-theme="dark"] body:not(.is-public) .tutor-dashboard-filter label,
html[data-theme="dark"] body:not(.is-public) .tutor-course-filter label,
html[data-theme="dark"] body:not(.is-public) [class*="tutor-filter"] label {
  color: var(--text);
}

/* Clear All Filters-knapp */
html[data-theme="dark"] body:not(.is-public) .tutor-wrap a[href*="clear"],
html[data-theme="dark"] body:not(.is-public) .tutor-wrap .tutor-btn-outline,
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page .tutor-btn-outline {
  color: var(--lav-300) !important;
  border-color: var(--outline);
}

html[data-theme="dark"] body:not(.is-public) .tutor-wrap .tutor-btn-outline:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page .tutor-btn-outline:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
}

/* Sorterings-dropdown (Release Date) */
html[data-theme="dark"] body:not(.is-public) .tutor-wrap .tutor-form-select,
html[data-theme="dark"] body:not(.is-public) .tutor-course-archive-page .tutor-form-select,
html[data-theme="dark"] body:not(.is-public) .tutor-courses-wrap select {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-color: var(--outline);
}

/* ============================================================================
   7) DARK MODE – Kurs/lektionssida (single course & lesson view)
   Täcker sidebar, accordion, lektionsinnehåll, tabs och spotlight-wrapper.
   ========================================================================== */

/* --- Sidebar --- */
html[data-theme="dark"] body:not(.is-public) .tutor-course-single-sidebar-wrapper,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-sidebar {
  background: var(--bg-elev) !important;
  border-color: var(--outline) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-single-sidebar-title {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-bottom-color: var(--outline) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-accordion-item-header {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-color: var(--outline) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-accordion-item-header.is-active {
  background: var(--bg-card) !important;
  color: var(--lav-300, #cfd3ec) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-accordion-item-body {
  background: var(--bg) !important;
  border-color: var(--outline) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-quiz,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-lesson {
  border-color: var(--outline) !important;
}

/* Tutor LMS sätter background:#fff på länken – override till transparent i dark mode */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item a,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-quiz a,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-lesson a {
  background-color: transparent !important;
  color: var(--text) !important;
}

/* Tutor LMS sätter color:#41454f (mörk) på title-texten – override */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item .tutor-course-topic-item-title {
  color: var(--muted) !important;
}

/* Aktiv lektion: Tutor sätter background:#eff1f6 (ljus) – dark mode override */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item.is-active a {
  background-color: var(--bg-card) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item.is-active .tutor-course-topic-item-title,
html[data-theme="dark"] body:not(.is-public) .tutor-course-single-sidebar-wrapper .tutor-course-topic-item.is-active .tutor-course-topic-item-title {
  color: var(--lav-300, #cfd3ec) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item.is-active .tutor-course-topic-item-icon,
html[data-theme="dark"] body:not(.is-public) .tutor-course-single-sidebar-wrapper .tutor-course-topic-item.is-active .tutor-course-topic-item-icon {
  color: var(--lav-300, #cfd3ec) !important;
}

/* Hover: Tutor sätter tutor-color-primary på title (kan vara mörk) – override */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item a:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-quiz a:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item-lesson a:hover {
  background-color: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item:hover .tutor-course-topic-item-title,
html[data-theme="dark"] body:not(.is-public) .tutor-course-single-sidebar-wrapper .tutor-course-topic-item:hover .tutor-course-topic-item-title {
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-item:hover .tutor-course-topic-item-icon {
  color: var(--text) !important;
}

/* --- Huvudinnehåll --- */
html[data-theme="dark"] body:not(.is-public) .tutor-course-single-content-wrapper,
html[data-theme="dark"] body:not(.is-public) #tutor-single-entry-content {
  background: var(--bg) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-spotlight-wrapper {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* --- Tabs --- */
html[data-theme="dark"] body:not(.is-public) .tutor-tab,
html[data-theme="dark"] body:not(.is-public) .tutor-course-spotlight-tab {
  border-bottom-color: var(--outline) !important;
  background: transparent !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-tab .tutor-nav-link,
html[data-theme="dark"] body:not(.is-public) .tutor-tab .tutor-tab-link,
html[data-theme="dark"] body:not(.is-public) .tutor-tab > li > a,
html[data-theme="dark"] body:not(.is-public) .tutor-tab > li > button {
  color: var(--muted) !important;
  border-bottom-color: transparent !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-tab .tutor-nav-link.is-active,
html[data-theme="dark"] body:not(.is-public) .tutor-tab .tutor-tab-link.is-active,
html[data-theme="dark"] body:not(.is-public) .tutor-tab > li.is-active > a,
html[data-theme="dark"] body:not(.is-public) .tutor-tab > li.is-active > button {
  color: var(--text) !important;
  border-bottom-color: var(--lav-400, #aeb3da) !important;
}

/* --- Lektionsinnehåll (text) --- */
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper,
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-body,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview {
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper p,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper ul,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper ol,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper li,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper li span,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper h1,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper h2,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper h3,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper h4,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-wrapper h5 {
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview p,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview ul,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview li,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview li span,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview h1,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview h2,
html[data-theme="dark"] body:not(.is-public) #tutor-course-spotlight-overview h3 {
  color: var(--text) !important;
}

/* tutor-color-secondary är en Tutor-utilityklass som sätter mörk text – ljus i dark mode */
html[data-theme="dark"] body:not(.is-public) .tutor-color-secondary {
  color: var(--muted) !important;
}

/* Navigeringsknappar (föregående/nästa lektion) */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-nav,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-nav {
  border-top-color: var(--outline) !important;
  background: var(--bg-elev) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-nav a,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-nav a {
  color: var(--text) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-nav a:hover,
html[data-theme="dark"] body:not(.is-public) .tutor-lesson-nav a:hover {
  color: var(--lav-300, #cfd3ec) !important;
}

/* --- Lektionens topbar (kursnamn) --- */
/* Tutor sätter background:var(--tutor-color-primary) – okänd accentfärg. Dark mode: mörk lav. */
html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-header,
html[data-theme="dark"] body:not(.is-public) .tutor-single-page-top-bar {
  background: var(--lav-900, #3d3e66) !important;
  color: #fff !important;
  border-bottom-color: var(--outline) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-header .tutor-topbar-mark-btn {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-header .tutor-iconic-btn {
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-course-topic-single-header .tutor-iconic-btn:hover {
  color: #fff !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
}

/* --- Video-player: loading-spinner och iframe-wrapper --- */
/* Tutor sätter background:#eff1f6 (ljusgrå) på loading-spinner */
html[data-theme="dark"] body:not(.is-public) .tutor-video-player .loading-spinner {
  background: var(--bg-card, #252840) !important;
}

html[data-theme="dark"] body:not(.is-public) .tutor-video-player .loading-spinner::before {
  border-color: var(--outline, #333854) !important;
  border-top-color: var(--lav-400, #aeb3da) !important;
}

/* Wrapper bakom iframe (vit bakgrund under laddning) */
html[data-theme="dark"] body:not(.is-public) .tutor-video-embeded-wrap,
html[data-theme="dark"] body:not(.is-public) .tutor-video-player,
html[data-theme="dark"] body:not(.is-public) .tutor-video-player-wrapper {
  background: var(--bg-card, #252840) !important;
}

/* #58 (Emma): ta bort lektionens flik-rad (Översikt + Anteckningar) */
.tutor-course-spotlight-nav { display: none !important; }
/* #58 (Emma): dölj Elementor Notes-knappen i admin-baren (vi använder ej anteckningar) */
#wpadminbar #wp-admin-bar-elementor_notes { display: none !important; }

/* ── Kursens landningssida: hela texten, ingen hopfällning ────────────
   Pia 2026-08-25: *"pluset och visa mer ska vi inte ha, vi visar hela texten.
   det är en landing page för kursen där vi inte ska skriva för mycket."*

   Två saker i en: hopfällningen bort OCH ingressen kort. Den här regeln gör det
   första. Det andra är innehållsarbete — en hopfällning är ett symptom på att
   texten är för lång, inte en lösning på det.

   Uppmätt: `.tutor-course-details-content.tutor-toggle-more-collapsed` har
   `overflow: hidden` och höjd 200px. Höjden sätts INLINE av Tutors eget skript,
   och inline vinner över allt utom !important.

   `!important` är därför nödvändigt här, och det är den undantagsgrund CONTRACT
   redan namnger: "No new !important on standard elements (TutorLMS-JS exception
   documented inline)". Det här är den dokumentationen. */
body:not(.is-public) .tutor-course-details-content.tutor-toggle-more-content,
.tutor-course-details-content.tutor-toggle-more-content {
	max-height: none !important;
	height: auto !important;
	overflow: visible !important;
}

/* Knappen har inget kvar att fälla ut. */
.tutor-course-details-wrapper .tutor-btn-show-more,
.tutor-course-details-content + .tutor-btn-show-more {
	display: none !important;
}

/* =======================================================================
   Kurssidan #493 – priskort, metarader, dragspel
   Pia 2026-08-25. "Gratis stämmer inte heller", "Intyg om färdigställande är
   inte en flex", "pillsen ska ligga i sidokortet", "dragspel för kursinnehåll
   ska vara enligt vår brand".
   Bara tokens, ingen hårdkodad hex/px-skala, inga nya !important.
   ======================================================================= */

/* ── Priskortet ──────────────────────────────────────────────────────────── */
.cctrl-kurspris {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}
/* Ersätter Tutors .tutor-fs-4 .tutor-fw-bold: nivån är ett SAKFÖRHÅLLANDE, inte
   ett pris. Den ska läsas, inte skrika – därav rubrikvikt utan display-storlek. */
.cctrl-kurspris__ingar {
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--text);
	text-wrap: balance;
}
.cctrl-kurspris--uppgradera .cctrl-kurspris__ingar {
	color: var(--lav-500);
}
.cctrl-kurspris__not {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--muted);
}
.cctrl-kurspris--stangd .cctrl-kurspris__ingar {
	font-weight: 500;
	color: var(--muted);
}

/* ── Metaraderna i kortets fot ───────────────────────────────────────────── */
/* Tutors rad är en ikon + en textsträng. Våra två rader bär i stället en
   etikett och pills, så de får staplas i stället för att ligga på baslinjen. */
.cctrl-kursmeta .cctrl-kursmeta__etikett {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--muted);
	margin-block-end: var(--space-1);
}
.cctrl-kursmeta .cctrl-kursmeta__pills {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-1);
}

/* ── Dragspelet (kursinnehåll) ───────────────────────────────────────────── */
/* Tutors standard är en grå låda med ram runt varje sektion OCH runt listan.
   Vår brand: en yta, tunna avdelare, ingen ram-i-ram. Samma resonemang som
   biblioteket och gemenskapen – ta bort lådan, behåll rytmen. */
body:not(.is-public) .tutor-accordion {
	border: 1px solid var(--outline);
	border-radius: var(--radius-md);
	overflow: hidden;
	background: var(--bg-elev);
}
body:not(.is-public) .tutor-accordion .tutor-accordion-item {
	border: 0;
	border-radius: 0;
	background: transparent;
}
body:not(.is-public) .tutor-accordion .tutor-accordion-item + .tutor-accordion-item {
	border-top: 1px solid var(--outline);
}
body:not(.is-public) .tutor-accordion-item-header {
	background: transparent;
	border: 0;
	padding: var(--space-3) var(--space-4);
	font-weight: 600;
	color: var(--text);
	transition: background-color 0.15s ease;
}
body:not(.is-public) .tutor-accordion-item-header:hover {
	background: var(--ctp-surface-alt);
}
/* Aktiv sektion markeras med brandfärgad kantlinje i stället för fylld yta –
   samma grepp som app-bandets aktiva post. */
body:not(.is-public) .tutor-accordion-item-header.is-active {
	background: transparent;
	box-shadow: inset 3px 0 0 0 var(--lav-500);
	color: var(--text);
}
body:not(.is-public) .tutor-accordion-item-body {
	background: transparent;
	border: 0;
	padding: 0 var(--space-4) var(--space-3);
}

/* Certifikatkorten i Mitt lärande (#493). Ärver .cctrl-lista-kort från Min lista
   – samma komponent, inte en ny. Bara det som skiljer står här. */
.cctrl-certkort__datum {
	margin: 0;
	font-size: 0.8125rem;
	color: var(--muted);
}
.cctrl-certkort__utan {
	font-size: 0.8125rem;
	color: var(--muted);
	font-style: italic;
}