/* Django states and components absent from the static v36 example. */
.user-v36 { min-height: 100dvh; }
.user-v36 .v28-header { position: sticky; top: 0; z-index: 90; }
.v28-header-actions { justify-self: end; }
.student-account-dropdown { display: none; }
.student-account-menu.is-open .student-account-dropdown { display: block; }
.account-chevron { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; flex: 0 0 auto; }
.student-account-menu.is-open .account-chevron { transform: rotate(180deg); }
.v28-account-dropdown form { margin: 0; }
.v28-header .mobile-menu { top: 100%; }
.user-v36 .student-commerce-context { padding-top: 24px; }
.user-v36 .student-commerce-context + main { padding-top: 20px; }
.user-v36 .teacher-avatar { display: inline-grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; background: var(--mint); color: var(--green-dark); font-weight: 700; font-size: .9375rem; }
.v28-course-teacher .teacher-avatar { width: 38px; height: 38px; }
.teachers-showcase__initials { display: grid; place-items: center; min-height: 100%; color: var(--green-dark); font: 600 5rem var(--display); }
.teachers-count-1 .teachers-showcase__card { flex-basis: min(540px,100%); }
.user-v36 .course-card__buy.is-disabled,.user-v36 .is-disabled { opacity: .65; cursor: default; }
.cd-main > .learning-breadcrumbs { margin-bottom: 26px; }
.cd-main .cd-module__topics { padding-left: 0; list-style: none; }
.cd-group__parameters { color: var(--muted); font-size: .875rem; margin-top: 14px !important; }
.course-advantages { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 20px; margin-top: 30px; }
.course-advantages h3 { margin-bottom: 12px; }
.course-advantages p { color: var(--muted); }
.group-top-up { width: 100%; margin-top: 16px; }
.user-v36 .lesson-layout { max-width: none; }
.video-shell.is-available { padding: 0; aspect-ratio: 16/9; min-height: 0; }
.video-frame { border: 0; width: 100%; height: 100%; aspect-ratio: 16/9; }
.user-v36 .homework-selected-file { grid-template-columns: 40px minmax(0,1fr) 36px; }
.homework-dropzone:focus-within { outline: 2px solid var(--green); outline-offset: 3px; }
.homework-dropzone input { clip-path: inset(50%); position: absolute; width: 1px; height: 1px; overflow: hidden; }
.homework-dropzone:has(input) > div { margin-top: 14px; }
.homework-dropzone.is-dragging { background: var(--mint); }
.homework-confirm-modal { padding: 0; width: min(540px,calc(100% - 28px)); max-height: calc(100dvh - 28px); height: auto; margin: auto; inset: 0; border: 0; border-radius: 24px; overflow: auto; background: var(--surface); }
.homework-confirm-modal:not([open]) { display: none; }
.homework-confirm-modal[open] { display: block; }
.homework-confirm-modal::backdrop { background: rgb(18 32 24 / 55%); }
.homework-confirm-dialog { width: 100%; border: 0; max-height: none; }
.homework-confirm-close { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--mint-soft); font-size: 1.375rem; }
.lesson-content .homework-section > .eyebrow { display: none; }
.user-v36 .compact-group-option { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.compact-group-option strong,.compact-group-option small,.compact-group-option span { display: block; }
.compact-group-option p { margin: 10px 0 !important; }
.compact-group-option span,.compact-group-option small { color: var(--muted); font-size: .875rem; }
.compact-group-option > div > strong { margin-bottom: 8px; }
.compact-plan-card { text-align: left; background: var(--surface); }
.compact-plan-card.is-selected { background: #e9f0e2; border-color: var(--green); }
.compact-purchase-form > .form-error-summary,.lesson-topup-layout > .form-error-summary { grid-column: 1/-1; }
.payer-details { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
.payer-details > summary { margin-bottom: 20px; font-weight: 700; color: var(--green-dark); }
.lesson-topup-summary .compact-purchase-consent { margin-top: 26px; }
.lesson-topup-summary .lesson-topup-pay { width: 100%; }
.topup-group-label { color: var(--muted); font-size: .875rem; margin-bottom: 24px !important; }
.purchase-lesson-preview ol:empty { display: none; }
.user-v36 .compact-purchase-consent .field-error { grid-column: 2; }
.payment-order-head strong { overflow-wrap: anywhere; }
.user-v36 .payment-state-main { align-items: start; }
.user-v36 .section-card,.user-v36 .student-empty-state { padding: 28px; border: 1px solid var(--portal-border); border-radius: 22px; background: var(--surface); }
.student-empty-state p,.student-empty-state .button { margin-top: 18px !important; }
.submission-answer { margin: 20px 0; overflow-wrap: anywhere; }
.submission-result-grid { display: grid; grid-template-columns: 200px minmax(0,1fr); gap: 24px; margin-top: 24px; }
.submission-score-card > strong { font-size: 2rem; }
.file-list { padding: 0; list-style: none; }
.file-list li { display: flex; gap: 20px; justify-content: space-between; padding: 16px 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.django-messages { width: var(--shell); margin: 18px auto; display: grid; gap: 10px; }
.django-message,.notice { padding: 14px 18px; border-radius: 12px; background: var(--mint-soft); color: var(--green-dark); font-size: .9375rem; }
.django-message--error { background: #f8e9e0; color: #923e2f; }
.form-error-summary,.commerce-form-error { padding: 14px 18px; background: #f8e9e0; color: #923e2f; border-radius: 12px; font-size: .875rem; }
.user-v36 .form-error-summary { margin: 0 0 16px; }
.user-v36 .field-help { font-size: .75rem; color: var(--muted); }
.user-v36 :is(.auth-dialog,.dashboard-dialog,.consultation-dialog) { margin: auto; color: var(--ink); }
.user-v36 .auth-dialog { width: min(480px,calc(100% - 28px)); }
.user-v36 .auth-dialog.is-register { width: min(620px,calc(100% - 28px)); }
.registration-name-grid,.registration-contact-grid,.registration-password-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; }
.registration-contact-grid { grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); }
.auth-form .auth-field { display: grid; gap: 7px; min-width: 0; }
.auth-field > span { font-size: .875rem; font-weight: 700; }
.register-consent,.consultation-consent { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: start; gap: 8px 12px; font-size: .8125rem; color: var(--muted); line-height: 1.5; }
.register-consent input,.consultation-consent input { margin: 2px 0 0; }
.register-consent .field-error,.consultation-consent .field-error { grid-column: 2; }
.user-v36 .settings-password-link { display: inline-block; margin-top: 22px; }
.user-v36 .consultation-dialog { width: min(540px,calc(100% - 28px)); }
.user-v36 .consultation-contact-head h2 { margin-top: 0; }
.user-v36 .consultation-form { margin-top: 0; }
.user-v36 .consultation-field textarea { min-height: 90px; height: 90px; }
.user-v36 .consultation-contact-submit { width: 100%; }
.user-v36 .auth-purchase-note:empty { display: none; }
.user-v36 .password-control { display: flex; align-items: center; position: relative; }
.user-v36 .password-control input { padding-right: 88px; }
.user-v36 .password-control button { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; padding: 8px; font-size: .75rem; color: var(--green-dark); }
.user-v36 :is(input,textarea,select):focus { outline: none; box-shadow: none; }
.user-v36 .dashboard-nav-item.is-active { color: #fff; background: var(--green-dark); }
.user-v36 .dashboard-nav-item:focus-visible { outline: 2px solid var(--green-dark); outline-offset: 3px; }
@media (max-width: 620px) {
  .user-v36 .dashboard-nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
.user-v36 .teacher-preview-service-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 12px 24px; background: var(--green-dark); color: white; font-size: .875rem; }
.user-v36 .teacher-preview-readonly { font-size: .875rem; }
.user-v36 .data-table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--portal-border); border-radius: 20px; background: var(--surface); }
.user-v36 .data-table { border-collapse: collapse; width: 100%; font-size: .875rem; }
.user-v36 .data-table th,.user-v36 .data-table td { padding: 18px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.user-v36 .data-table th { background: var(--mint-soft); }
.user-v36 .data-table td:first-child,.user-v36 .data-table td:nth-last-child(2) { white-space: nowrap; }
@media (max-width: 800px) {
  .study-sidebar { grid-template-columns: 1fr; }
  .lesson-topup-layout { grid-template-columns: 1fr; }
  .v28-account-dropdown { right: 0; }
}
@media (max-width: 620px) {
  .registration-name-grid,.registration-contact-grid,.registration-password-grid { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .user-v36 .auth-shell { padding: 24px 20px; }
  .user-v36 .compact-group-option,.submission-result-grid { grid-template-columns: 1fr; }
  .lesson-package-custom-head { align-items: start; }
  .user-v36 .compact-section-head { flex-wrap: wrap; }
  .lesson-topup-main .compact-plan-options { grid-template-columns: 1fr; }
  .user-v36 .file-list li { flex-direction: column; gap: 8px; }
  .user-v36 .lesson-row .lesson-indicator-lock { grid-column: 3; grid-row: 1; justify-self: end; }
  .user-v36 .lesson-row .lesson-indicator-done { grid-column: 3; grid-row: 1; }
  .user-v36 .homework-selected-file { grid-template-columns: minmax(0,1fr) 36px; }
  .user-v36 .homework-selected-file > span { display: none; }
  .user-v36 .dashboard-user { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .user-v36 *, .user-v36 *::before, .user-v36 *::after { transition-duration: 0s !important; animation-duration: 0s !important; }
}
/* Some legacy mobile rules in the supplied stylesheet put dt/dd in two columns. */
.user-v36 .course-card__stats > div:nth-child(n) { display: block !important; grid-template-columns: none !important; align-content: start !important; }
.user-v36 .course-card__stats :is(dt,dd) { width: auto !important; min-width: 0 !important; text-align: left !important; overflow-wrap: anywhere; }
.compact-plan-options { grid-template-columns: repeat(auto-fit,minmax(min(100%,160px),1fr)); }

/* Time zone is a shared, explicit label beside schedules and lesson times. */
.user-v36 .schedule-timezone { margin: 10px 0; }
.user-v36 .timezone-badge { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 7px 10px; border: 1px solid #b0c8b6; border-radius: 10px; background: #dfeade; color: #214a41; font-size: 12px; font-weight: 700; line-height: 1.45; vertical-align: middle; text-align: left; }
.user-v36 .timezone-badge > svg { width: 16px; height: 16px; flex: 0 0 16px; }
.user-v36 .timezone-badge__offset { white-space: nowrap; }
.user-v36 .course-info-card .schedule-timezone { margin-top: 0; }