/**
 * MS Custom Course Player — CSS Override
 * Nadpisuje style MasterStudy course player na nowy design.
 *
 * UWAGA: Nie zmieniac nazw klas MasterStudy — JS playera ich uzywa.
 */

/* ===================================================================
   1. CUSTOM PROPERTIES
   =================================================================== */
:root {
  --msp-font: 'Inter', system-ui, -apple-system, sans-serif;
  --msp-bg-surface: #FFFFFF;
  --msp-bg-sidebar: #F7F8FA;
  --msp-bg-sidebar-header: #F3F3F3;
  --msp-border: #e2e8f0;
  --msp-text-primary: #0f172a;
  --msp-text-secondary: #64748b;
  --msp-text-muted: #94a3b8;
  --msp-accent-light: #f1f5f9;
}

/* ===================================================================
   2. HEADER — bialy zamiast szarego #eef1f7
   =================================================================== */
.masterstudy-course-player-header {
  background: var(--msp-bg-surface) !important;
  border-bottom: 1px solid var(--msp-border) !important;
}
.masterstudy-course-player-header__back {
  border-right-color: var(--msp-border) !important;
}
.masterstudy-course-player-header__dark-mode {
  border-left-color: var(--msp-border) !important;
}
.masterstudy-course-player-header__discussions-toggler {
  border-left-color: var(--msp-border) !important;
}
/* Ukryj tytul kursu w headerze (jest w sidebarze) */
.masterstudy-course-player-header__course {
  display: none !important;
}

/* Dark mode header */
.masterstudy-course-player-header.masterstudy-course-player-header_dark-mode {
  background: #1e1e1e !important;
  border-bottom-color: #2d2d2d !important;
}
.masterstudy-course-player-header_dark-mode .masterstudy-course-player-header__back {
  border-right-color: rgba(255,255,255,0.05) !important;
}
.masterstudy-course-player-header_dark-mode .masterstudy-course-player-header__dark-mode {
  border-left-color: rgba(255,255,255,0.05) !important;
}

/* ===================================================================
   3. SIDEBAR — jasne tlo zamiast szarego
   =================================================================== */
.masterstudy-course-player-curriculum {
  background: var(--msp-bg-sidebar) !important;
  border-right: 1px solid var(--msp-border) !important;
}
/* Title wrapper — stonowany naglowek */
.masterstudy-course-player-curriculum__title-wrapper {
  background: var(--msp-bg-sidebar-header) !important;
  padding: 20px !important;
  border-bottom: 1px solid var(--msp-border) !important;
}
.masterstudy-course-player-curriculum__title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--msp-text-primary) !important;
}

/* Dark mode sidebar */
.masterstudy-course-player-content_dark-mode .masterstudy-course-player-curriculum {
  background: #1e1e1e !important;
  border-right-color: #2d2d2d !important;
}
.masterstudy-course-player-content_dark-mode .masterstudy-course-player-curriculum__title-wrapper {
  background: #1a1a1a !important;
  border-bottom-color: #2d2d2d !important;
}
.masterstudy-course-player-content_dark-mode .masterstudy-course-player-curriculum__title {
  color: #f5f5f5 !important;
}

/* ===================================================================
   4. CURRICULUM ACCORDION — sekcje jasniejsze
   =================================================================== */
/* Section headers — jasniejsze zamiast ciemnego #4d5e6f */
.masterstudy-curriculum-accordion__section {
  background: #e8ecf0 !important;
  border-bottom: 1px solid var(--msp-border) !important;
}
.masterstudy-curriculum-accordion__section-title {
  color: var(--msp-text-primary) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
.masterstudy-curriculum-accordion__section-count {
  color: var(--msp-text-secondary) !important;
}
.masterstudy-curriculum-accordion__toggler {
  background: rgba(0,0,0,0.06) !important;
}
.masterstudy-curriculum-accordion__toggler-icon {
  color: var(--msp-text-secondary) !important;
}
.masterstudy-curriculum-accordion__toggler-icon path,
.masterstudy-curriculum-accordion__toggler-icon svg {
  fill: var(--msp-text-secondary) !important;
  color: var(--msp-text-secondary) !important;
}

/* Dark mode sections */
.masterstudy-curriculum-accordion_dark-mode .masterstudy-curriculum-accordion__section {
  background: #252525 !important;
  border-bottom-color: #2d2d2d !important;
}
.masterstudy-curriculum-accordion_dark-mode .masterstudy-curriculum-accordion__section-title {
  color: #f5f5f5 !important;
}
.masterstudy-curriculum-accordion_dark-mode .masterstudy-curriculum-accordion__section-count {
  color: #a3a3a3 !important;
}

/* ===================================================================
   5. LESSON ITEMS — czystsze
   =================================================================== */
.masterstudy-curriculum-accordion__item {
  border-bottom: 1px solid var(--msp-border) !important;
}
.masterstudy-curriculum-accordion a.masterstudy-curriculum-accordion__link {
  padding: 14px 20px !important;
}
/* Tytul lekcji */
.masterstudy-curriculum-accordion__title {
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: var(--msp-text-primary) !important;
}
/* Meta (czas, typ) */
.masterstudy-curriculum-accordion__meta {
  font-size: 11px !important;
  color: var(--msp-text-muted) !important;
}
/* Ikona typu lekcji */
.masterstudy-curriculum-accordion__image {
  width: 20px !important;
  height: 20px !important;
  opacity: 0.6;
}
/* Aktywna lekcja */
.masterstudy-curriculum-accordion a.masterstudy-curriculum-accordion__link.masterstudy-curriculum-accordion__link_current {
  background: var(--msp-bg-surface) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.masterstudy-curriculum-accordion__link_current .masterstudy-curriculum-accordion__title {
  font-weight: 600 !important;
}
/* Ukonczona lekcja — wyciszony tekst */
.masterstudy-curriculum-accordion__link .masterstudy-curriculum-accordion__check_completed ~ .masterstudy-curriculum-accordion__title-wrapper .masterstudy-curriculum-accordion__title,
.masterstudy-curriculum-accordion__item:has(.masterstudy-curriculum-accordion__check_completed) .masterstudy-curriculum-accordion__title {
  color: var(--msp-text-secondary) !important;
}

/* Dark mode lessons */
.masterstudy-curriculum-accordion_dark-mode .masterstudy-curriculum-accordion__item {
  border-bottom-color: #2d2d2d !important;
}
.masterstudy-curriculum-accordion_dark-mode .masterstudy-curriculum-accordion__title {
  color: #e5e5e5 !important;
}
.masterstudy-curriculum-accordion_dark-mode a.masterstudy-curriculum-accordion__link.masterstudy-curriculum-accordion__link_current {
  background: #252525 !important;
}

/* ===================================================================
   6. CONTENT AREA — wezszy, czystszy
   =================================================================== */
.masterstudy-course-player-content__wrapper {
  background: var(--msp-bg-surface) !important;
}
.masterstudy-course-player-content__header {
  max-width: 768px !important;
}
.masterstudy-course-player-content__header h1 {
  font-size: 26px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: var(--msp-text-primary) !important;
}
.masterstudy-course-player-content__header-lesson-type {
  font-size: 13px !important;
  color: var(--msp-text-secondary) !important;
}
/* Lesson content — wezsza kolumna */
.masterstudy-course-player-lesson {
  max-width: 768px !important;
}
/* Lesson text */
.masterstudy-course-player-lesson__content {
  font-size: 14px !important;
  line-height: 1.75 !important;
}

/* Dark mode content */
.masterstudy-course-player-content_dark-mode .masterstudy-course-player-content__wrapper {
  background: #171717 !important;
}
.masterstudy-course-player-content_dark-mode .masterstudy-course-player-content__header h1 {
  color: #f5f5f5 !important;
}

/* ===================================================================
   7. NAVIGATION BAR
   =================================================================== */
.masterstudy-course-player-navigation {
  background: var(--msp-bg-surface) !important;
  border-top: 1px solid var(--msp-border) !important;
}
.masterstudy-course-player-navigation__wrapper {
  max-width: 768px !important;
}
/* Dark mode nav */
.masterstudy-course-player-navigation.masterstudy-course-player-navigation_dark-mode {
  background: #1e1e1e !important;
  border-top-color: #2d2d2d !important;
}

/* ===================================================================
   8. RESPONSIVE
   =================================================================== */
@media (max-width: 1366px) {
  .masterstudy-course-player-content__header,
  .masterstudy-course-player-lesson,
  .masterstudy-course-player-navigation__wrapper {
    max-width: 768px !important;
  }
}