/* ======================================================================
   PARUS cabinet mobile fix
   Цель: убрать горизонтальный скролл и привести личный кабинет к нормальному
   виду на 320–720px. Стили скоуплены только под .parus-cab.
   ====================================================================== */

.parus-cab,
.parus-cab * {
  box-sizing: border-box;
}

.parus-cab {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.parus-cab img,
.parus-cab iframe,
.parus-cab video,
.parus-cab svg {
  max-width: 100%;
}

.parus-cab .cab-body,
.parus-cab .cab-main,
.parus-cab .cab-panel,
.parus-cab .cab-panel > *,
.parus-cab .cab-panel-header,
.parus-cab .cab-lesson-panel,
.parus-cab .cab-lesson-video,
.parus-cab .progress-row,
.parus-cab .next-step,
.parus-cab .offer-block,
.parus-cab .quick-grid,
.parus-cab .library-grid,
.parus-cab .request-card,
.parus-cab .cab-soon {
  min-width: 0;
  max-width: 100%;
}

.parus-cab .cab-panel-title,
.parus-cab .cab-panel-desc,
.parus-cab .welcome-greeting,
.parus-cab .welcome-sub,
.parus-cab .next-step-title,
.parus-cab .next-step-desc,
.parus-cab .offer-header-title,
.parus-cab .quick-card-title,
.parus-cab .quick-card-desc,
.parus-cab .cab-lesson-title,
.parus-cab .cab-lesson-desc,
.parus-cab .cab-soon,
.parus-cab p,
.parus-cab h1,
.parus-cab h2,
.parus-cab h3 {
  overflow-wrap: anywhere;
}

/* Базовая сетка кабинета: main не должен раздвигать страницу. */
.parus-cab .cab-body {
  width: 100%;
}

.parus-cab .cab-main {
  min-width: 0;
  width: 100%;
}

/* Drupal admin toolbar иногда провоцирует горизонтальный скролл в responsive mode. */
html:has(.parus-cab),
body:has(.parus-cab) {
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 820px) {
  .parus-cab {
    overflow-x: hidden;
  }

  .parus-cab .cab-nav {
    position: sticky;
    top: 0;
  }

  .parus-cab .cab-nav-inner {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 56px;
    padding: 10px 14px;
    gap: 10px;
  }

  .parus-cab .cab-nav-logo {
    min-width: 0;
    flex: 1 1 auto;
    gap: 8px;
    font-size: 13px;
    line-height: 1.15;
  }

  .parus-cab .cab-nav-logo svg {
    width: 24px;
    height: 20px;
    flex: 0 0 auto;
  }

  .parus-cab .cab-nav-logo span {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .parus-cab .cab-nav-user {
    flex: 0 0 auto;
    gap: 8px;
  }

  .parus-cab .cab-nav-name {
    display: none;
  }

  .parus-cab .cab-nav-avatar {
    width: 30px;
    height: 30px;
    font-size: 12px;
  }

  .parus-cab .cab-nav-logout {
    font-size: 10px;
  }

  .parus-cab .cab-body {
    display: block;
    padding: 16px;
    min-height: auto;
  }

  .parus-cab .cab-sidebar {
    position: relative;
    top: auto;
    z-index: 4;
    width: 100%;
    margin: 0 0 20px;
  }

  .parus-cab .cab-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 2px 8px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .parus-cab .cab-menu::-webkit-scrollbar {
    display: none;
  }

  .parus-cab .cab-menu-item {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    white-space: nowrap;
    padding: 9px 12px;
    font-size: 13px;
    background: rgba(255,255,255,0.35);
    border: 1px solid rgba(217,207,191,0.75);
  }

  .parus-cab .cab-menu-item.active {
    background: var(--c-surface);
  }

  .parus-cab .cab-menu-item svg {
    width: 16px;
    height: 16px;
  }

  .parus-cab .cab-menu-badge {
    margin-left: 2px;
  }

  .parus-cab .cab-menu-divider {
    display: none;
  }

  .parus-cab .cab-panel-header {
    margin-bottom: 20px;
    padding-right: 42px;
  }

  .parus-cab .cab-tag {
    font-size: 10px;
    margin-bottom: 8px;
  }

  .parus-cab .welcome-greeting,
  .parus-cab .cab-panel-title {
    font-size: 22px;
    line-height: 1.18;
  }

  .parus-cab .welcome-sub,
  .parus-cab .cab-panel-desc {
    font-size: 14px;
    line-height: 1.55;
  }

  .parus-cab .progress-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-bottom: 20px;
  }

  .parus-cab .progress-card {
    padding: 14px 16px;
  }

  .parus-cab .progress-num {
    font-size: 22px;
  }

  .parus-cab .next-step {
    display: block;
    padding: 22px 18px;
    margin-bottom: 14px;
  }

  .parus-cab .next-step-title {
    font-size: 18px;
  }

  .parus-cab .next-step-action {
    margin-top: 16px;
  }

  .parus-cab .next-step-action .btn,
  .parus-cab .offer-cta .btn {
    width: 100%;
  }

  .parus-cab .offer-header {
    padding: 14px 16px;
    gap: 10px;
  }

  .parus-cab .offer-header-left {
    min-width: 0;
    gap: 10px;
  }

  .parus-cab .offer-icon {
    width: 32px;
    height: 32px;
  }

  .parus-cab .offer-header-text {
    min-width: 0;
  }

  .parus-cab .offer-header-tag {
    font-size: 9px;
  }

  .parus-cab .offer-header-title {
    font-size: 14px;
  }

  .parus-cab .offer-toggle {
    flex: 0 0 auto;
  }

  .parus-cab .offer-body {
    padding: 0 16px 18px;
  }

  .parus-cab .offer-price-row,
  .parus-cab .offer-cta {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  .parus-cab .offer-price-note {
    margin-left: 0;
  }

  .parus-cab .quick-grid,
  .parus-cab .library-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .parus-cab .quick-card,
  .parus-cab .library-card {
    padding: 0;
  }

  .parus-cab .quick-card {
    padding: 18px;
  }

  .parus-cab .cab-lessons {
    margin-top: 18px;
  }

  .parus-cab .cab-lesson-tabs {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 6px;
    margin-bottom: 18px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .parus-cab .cab-lesson-tabs::-webkit-scrollbar {
    display: none;
  }

  .parus-cab .cab-lesson-tab {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 10px 16px;
    font-size: 13px;
  }

  .parus-cab .cab-lesson-title {
    font-size: 17px;
    line-height: 1.25;
  }

  .parus-cab .cab-lesson-desc {
    font-size: 14px;
  }

  .parus-cab .cab-lesson-video {
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    min-height: 0;
  }

  .parus-cab .cab-lesson-video--empty {
    min-height: 190px;
  }

  .parus-cab .cab-lesson-ph {
    padding: 18px;
    text-align: center;
  }

  .parus-cab .cab-lesson-ph span {
    max-width: 100%;
    font-size: 13px;
    line-height: 1.45;
  }

  .parus-cab .cab-head-edit {
    top: 0;
    right: 0;
  }

  .parus-cab .request-card {
    padding: 20px;
  }
}

@media (max-width: 480px) {
  .parus-cab .cab-body {
    padding: 14px 12px 24px;
  }

  .parus-cab .cab-nav-inner {
    padding-left: 12px;
    padding-right: 12px;
  }

  .parus-cab .cab-nav-logo span {
    max-width: 150px;
  }

  .parus-cab .cab-menu {
    margin-left: -2px;
    margin-right: -2px;
  }

  .parus-cab .cab-menu-item {
    padding: 8px 10px;
  }

  .parus-cab .cab-panel-header {
    padding-right: 38px;
  }

  .parus-cab .welcome-greeting,
  .parus-cab .cab-panel-title {
    font-size: 20px;
  }

  .parus-cab .next-step {
    border-radius: 14px;
  }

  .parus-cab .btn {
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media (max-width: 360px) {
  .parus-cab .cab-nav-logo span {
    max-width: 118px;
  }

  .parus-cab .cab-nav-logout {
    display: none;
  }
}
@media (min-width: 769px) {
  .cabinet-page,
  .cabinet-main,
  .cabinet-content,
  .dashboard-container,
  .cabinet-container,
  .profile-container,
  .parus-cab .cab-body {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
  }

  .cabinet-page,
  .cabinet-main {
    padding-left: 24px;
    padding-right: 24px;
  }
}