/* ══════════════════════════════════════════════════════
   DMRoom Course Curriculum Widget — curriculum.css
   RTL Persian Design — v1.1.0
   ══════════════════════════════════════════════════════ */

/* ── Base Reset & Variables ── */
.dmr-curriculum,
.dmr-curriculum * {
  box-sizing: border-box;
}

.dmr-curriculum {
  display: flex;
  flex-direction: column;
  gap: 14px;
  direction: rtl;
  text-align: right;
  padding: 8px 0;
}

/* ══════════════════════
   Chapter Card
══════════════════════ */
.dmr-chapter-card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 2px 16px 0 rgba(99,80,180,.07), 0 1px 4px 0 rgba(0,0,0,.04);
  overflow: hidden;
  transition: box-shadow .3s ease;
  border: 1px solid #f1f0f6;
}

.dmr-chapter-card.dmr-open {
  box-shadow: 0 4px 32px 0 rgba(99,80,180,.12), 0 2px 8px 0 rgba(0,0,0,.06);
  border-color: #e4e0f5;
}

/* ══════════════════════
   Chapter Header
   RTL DOM order → visual order (right to left):
   label | separator | icon-box | titles(flex:1) | stats | toggle
══════════════════════ */
.dmr-chapter-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 24px;
  cursor: pointer;
  user-select: none;
  transition: background-color .2s ease;
  min-height: 80px;
}

.dmr-chapter-header:hover { background-color: #fafaf9; }

/* Label pill */
.dmr-chapter-label {
  flex-shrink: 0;
  background: #ede9fe;
  color: #7c3aed;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

/* Separator line between label pill and icon box */
.dmr-label-separator {
  flex-shrink: 0;
  width: 1px;
  height: 36px;
  background-color: #d8b4fe;
  border-radius: 2px;
  display: block;
}

/* Chapter icon box */
.dmr-chapter-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dmr-chapter-icon i,
.dmr-chapter-icon svg {
  color: #f59e0b;
  font-size: 26px;
  width: 26px;
  height: 26px;
}

/* Chapter titles — fills remaining space */
.dmr-chapter-titles {
  flex: 1;
  min-width: 0;
  text-align: right;
}

.dmr-chapter-title {
  margin: 0 0 3px;
  font-weight: 700;
  color: #1a1a2e;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dmr-chapter-subtitle {
  margin: 0;
  color: #9ca3af;
  font-weight: 400;
}

/* Stat badges */
.dmr-stats {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.dmr-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 999px;
  font-weight: 600;
  border: 1px solid transparent;
  white-space: nowrap;
}

.dmr-badge i,
.dmr-badge svg {
  font-size: 14px;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.dmr-badge__num   { font-size: 13px; font-weight: 700; }
.dmr-badge__label { font-size: 12px; font-weight: 500; }

.dmr-badge--violet { background: #ede9fe; border-color: #c4b5fd; color: #6d28d9; }
.dmr-badge--green  { background: #dcfce7; border-color: #86efac; color: #15803d; }
.dmr-badge--pink   { background: #fce7f3; border-color: #f9a8d4; color: #be185d; }

/* Toggle chevron */
.dmr-toggle-btn {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #f3f0fb;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7c3aed;
  transition: background .25s ease;
}

.dmr-toggle-btn svg {
  width: 18px;
  height: 18px;
  transition: transform .3s ease;
}

.dmr-toggle-btn.dmr-open           { background: #7c3aed; color: #fff; }
.dmr-toggle-btn.dmr-open svg       { transform: rotate(0deg); }
.dmr-toggle-btn:not(.dmr-open) svg { transform: rotate(180deg); }

/* ══════════════════════
   Chapter Body
══════════════════════ */
.dmr-chapter-body { overflow: hidden; }

.dmr-chapter-body-inner {
  padding: 0 24px 24px;
  border-top: 1px solid #f3f0fb;
}

/* ── Tools Row ── */
.dmr-tools-row {
  padding: 18px 0 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.dmr-tools-label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-weight: 600;
  color: #4b5563;
}

.dmr-tools-label svg {
  width: 16px;
  height: 16px;
  color: #9ca3af;
  flex-shrink: 0;
}

/* FIX: No justify-content override — RTL direction aligns naturally to the right */
.dmr-tools-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dmr-tool-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 999px;
  font-weight: 600;
  cursor: default;
  transition: transform .15s ease;
}

.dmr-tool-badge:hover { transform: translateY(-1px); }

.dmr-tool-badge i,
.dmr-tool-badge svg { font-size: 14px; width: 15px; height: 15px; }

.dmr-tool--pink   { background: #fce7f3; color: #be185d; }
.dmr-tool--red    { background: #fee2e2; color: #b91c1c; }
.dmr-tool--yellow { background: #fef9c3; color: #92400e; }
.dmr-tool--green  { background: #dcfce7; color: #15803d; }
.dmr-tool--blue   { background: #dbeafe; color: #1e40af; }
.dmr-tool--purple { background: #ede9fe; color: #6d28d9; }

/* Divider */
.dmr-divider { height: 1px; background: #f3f0fb; margin: 0 0 16px; }

/* ══════════════════════
   Sub-sections
══════════════════════ */
.dmr-subsections { display: flex; flex-direction: column; gap: 10px; }

.dmr-subsection {
  border: 1px solid #ede9fe;
  border-radius: 12px;
  overflow: hidden;
  background: #fdfcff;
}

/* Sub-section header — RTL order: title+icon | duration | toggle */
.dmr-subsection-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  user-select: none;
  transition: background-color .2s ease;
}

.dmr-subsection-header:hover { background-color: #f5f3ff; }

/* FIX: flex:1 + no justify-content override — RTL handles right-alignment */
.dmr-sub-title-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.dmr-sub-title-wrap i,
.dmr-sub-title-wrap svg {
  font-size: 18px;
  width: 18px;
  height: 18px;
  color: #7c3aed;
  flex-shrink: 0;
}

.dmr-sub-title {
  font-weight: 600;
  color: #1e1b4b;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dmr-sub-duration {
  color: #9ca3af;
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
}

.dmr-subsection-toggle {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: #ede9fe;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7c3aed;
  flex-shrink: 0;
  transition: background .2s ease;
}

.dmr-subsection-toggle svg { width: 14px; height: 14px; transition: transform .3s ease; }

.dmr-subsection.dmr-sub-open .dmr-subsection-toggle           { background: #7c3aed; color: #fff; }
.dmr-subsection.dmr-sub-open .dmr-subsection-toggle svg       { transform: rotate(0deg); }
.dmr-subsection:not(.dmr-sub-open) .dmr-subsection-toggle svg { transform: rotate(180deg); }

/* ══════════════════════
   Lessons List
══════════════════════ */
.dmr-lessons-list {
  border-top: 1px solid #ede9fe;
  padding: 6px 0 10px;
  background: #ffffff;
}

.dmr-lesson-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 20px;
  transition: background-color .15s ease;
}

.dmr-lesson-item:hover { background-color: #f5f3ff; }
.dmr-lesson-item:not(:last-child) { border-bottom: 1px solid #f5f3ff; }

.dmr-lesson-title {
  color: #374151;
  font-weight: 400;
  line-height: 1.5;
  flex: 1;
}

.dmr-lesson-item i,
.dmr-lesson-item svg { font-size: 18px; width: 18px; height: 18px; color: #a78bfa; flex-shrink: 0; }

/* ══════════════════════
   Responsive
══════════════════════ */
@media (max-width: 768px) {
  .dmr-chapter-header {
    flex-wrap: wrap;
    padding: 14px 16px;
    gap: 8px;
    min-height: unset;
  }

  .dmr-stats {
    order: 5;
    flex-wrap: wrap;
    width: 100%;
  }

  .dmr-chapter-body-inner { padding: 0 14px 18px; }
  .dmr-badge { padding: 4px 8px; }

}
.dmr-hidden { display: none !important; }