/* Правовые страницы (/legal/*) в общем облике портала.
   До 26.08.2026 это была голая бутстраповская вкладочная сетка: текст 13px
   без интерлиньяжа, список документов — колонка с инлайновыми width/height,
   контент во всю ширину экрана. Здесь всё переведено на язык анкеты и
   каталога: Manrope, белые карточки, рельса слева, кегль 16px.
   Переменные --dt-* приходят из landingcss/home.css. */

.dt-legal {
    font-family: 'Manrope', 'Inter', var(--dt-font, Arial, sans-serif);
    color: var(--dt-text, #475569);
    font-size: 16px;
    line-height: 1.7;
}
.dt-legal__wrap {
    display: grid;
    grid-template-columns: 268px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    max-width: 1180px;
    margin: 0 auto;
    padding: 22px 0 56px;
}
/* Во вкладке кабинета ширину задаёт сама оболочка: своё ограничение здесь
   центрировало документ и оставляло пустые поля слева и справа (28.08.2026).
   На публичных /legal/* ограничение остаётся — там страница во всю ширину окна. */
body.dt-dashboard .dt-legal__wrap {
    max-width: none;
    padding-top: 0;
}

/* ---------- рельса с документами ---------- */

.dt-legal__rail {
    position: sticky;
    top: 84px;
    padding: 16px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 18px;
    background: #fff;
}
.dt-legal__rail-title {
    margin: 2px 0 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--dt-dim, #94a3b8);
}
.dt-legal__nav { margin: 0; padding: 0; list-style: none; }
.dt-legal__nav li { margin: 0; padding: 0; list-style: none; }
.dt-legal__link {
    display: block;
    margin: 2px 0;
    padding: 9px 12px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--dt-text, #475569);
    text-decoration: none;
}
.dt-legal__link:hover {
    background: #f1f5f9;
    color: var(--dt-ink, #0f172a);
    text-decoration: none;
}
.dt-legal__link.is-active {
    background: rgba(37, 99, 235, .09);
    color: var(--dt-accent, #2563eb);
    font-weight: 700;
}

/* ---------- сам документ ---------- */

.dt-legal__doc {
    min-width: 0;
    padding: 30px 34px 36px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 18px;
    background: #fff;
}
.dt-legal__title {
    margin: 0 0 18px;
    padding: 0;
    font-size: 27px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}

/* Текст документов лежит в базе готовым HTML — приводим в порядок то,
   что там реально встречается: абзацы, заголовки, списки, таблицы. */
.dt-legal__body { font-size: 16px; line-height: 1.75; }
.dt-legal__body p { margin: 0 0 12px; font-size: 16px; line-height: 1.75; }
.dt-legal__body h1,
.dt-legal__body h2,
.dt-legal__body h3,
.dt-legal__body h4 {
    margin: 26px 0 12px;
    font-family: inherit;
    font-weight: 800;
    line-height: 1.3;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}
.dt-legal__body h1 { font-size: 24px; }
.dt-legal__body h2 { font-size: 22px; }
.dt-legal__body h3 { font-size: 20px; }
.dt-legal__body h4 { font-size: 17px; }
/* Пять документов из семи начинаются собственным <h3> с тем же названием,
   что и заголовок страницы, — второй раз его показывать незачем. */
.dt-legal__body > h1:first-child,
.dt-legal__body > h2:first-child,
.dt-legal__body > h3:first-child { display: none; }
.dt-legal__body > p:first-child,
.dt-legal__body > table:first-child { margin-top: 0; }
.dt-legal__body ul,
.dt-legal__body ol { margin: 0 0 14px 22px; padding: 0; }
.dt-legal__body li { margin: 0 0 6px; font-size: 16px; line-height: 1.7; }
.dt-legal__body a { color: var(--dt-accent, #2563eb); }
.dt-legal__body strong,
.dt-legal__body b { color: var(--dt-ink, #0f172a); font-weight: 700; }
.dt-legal__body sup { font-size: 11px; }
.dt-legal__body img { max-width: 100%; height: auto; }
.dt-legal__body hr { margin: 22px 0; border: 0; border-top: 1px solid var(--dt-border, #e2e8f0); }

/* Таблицы в документах — прейскурант и реквизиты. Широкие прокручиваются,
   а не ломают карточку. */
.dt-legal__body table {
    width: 100%;
    margin: 0 0 16px;
    border-collapse: collapse;
    font-size: 15px;
}
.dt-legal__body table td,
.dt-legal__body table th {
    padding: 10px 12px;
    border: 1px solid var(--dt-border, #e2e8f0);
    vertical-align: top;
    line-height: 1.6;
}
.dt-legal__body table th { background: #f8fafc; font-weight: 700; color: var(--dt-ink, #0f172a); }
.dt-legal__body table.a12 td { border: 0; padding: 0 24px 8px 0; }

/* ---------- «О компании»: контакты, реквизиты, оплата ----------
   Документ единственный, кто не является сплошным текстом: до 28.08.2026
   он был свёрсткой 2013 года — таблица в две колонки, отбивки <br><br><br>
   и пять картинок с логотипами платёжных систем через file.php (файлы
   утрачены вместе с выносом file.php из webroot, все пять отдавали 404).
   Теперь это карточки контактов и таблица реквизитов. */

/* Ловушки портала: в конце body лежит глобальное `* { margin: 0 auto }`,
   а border-box глобально не задан — без этих двух строк карточка с
   внутренними отступами вылезает за свою колонку на телефоне. */
.dt-about,
.dt-about *,
.dt-about *:before,
.dt-about *:after { box-sizing: border-box; }
.dt-about * { margin-left: 0; margin-right: 0; }

.dt-legal__body .dt-about__lead {
    margin: 0 0 22px;
    font-size: 17px;
    line-height: 1.6;
    color: var(--dt-ink, #0f172a);
}
/* Контакты — одна плашка в строку: два телефона и почты администрации.
   Отдельные карточки «Поддержка преподавателей» и «Сотрудничество» убраны
   28.08.2026 (в них оставались одни адреса почты). */
.dt-about__contacts {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 18px 48px;
    margin: 0 0 30px;
    padding: 18px 22px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 16px;
    background: #f8fafc;
}
.dt-about__phone { margin: 0; line-height: 1.35; }
.dt-legal__body .dt-about__phone a {
    display: block;
    font-size: 19px;
    font-weight: 800;
    color: var(--dt-ink, #0f172a);
    text-decoration: none;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.dt-legal__body .dt-about__phone a:hover { color: var(--dt-accent, #2563eb); }
.dt-about__note {
    display: block;
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--dt-dim, #94a3b8);
}
.dt-about__mails { margin: 0; }
.dt-legal__body .dt-about__mails a {
    display: block;
    margin: 0 0 3px;
    font-size: 14.5px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* Реквизиты: пары «поле — значение» строками, без сетки бухгалтерской
   таблицы. Значения моноширинными цифрами — их сверяют и копируют. */
.dt-legal__body .dt-about__req { margin: 0 0 30px; font-size: 15px; }
.dt-legal__body .dt-about__req th,
.dt-legal__body .dt-about__req td {
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--dt-border, #e2e8f0);
    vertical-align: top;
    text-align: left;
    background: transparent;
}
.dt-legal__body .dt-about__req th {
    width: 232px;
    padding-right: 20px;
    font-weight: 600;
    color: var(--dt-dim, #94a3b8);
}
.dt-legal__body .dt-about__req td {
    color: var(--dt-ink, #0f172a);
    font-variant-numeric: tabular-nums;
}
.dt-legal__body .dt-about__req tr:last-child th,
.dt-legal__body .dt-about__req tr:last-child td { border-bottom: 0; }

@media (max-width: 640px) {
    /* на телефоне подпись встаёт над значением, а не жмёт его в угол */
    .dt-legal__body .dt-about__req,
    .dt-legal__body .dt-about__req tbody,
    .dt-legal__body .dt-about__req tr,
    .dt-legal__body .dt-about__req th,
    .dt-legal__body .dt-about__req td { display: block; width: auto; }
    .dt-legal__body .dt-about__req th {
        padding: 12px 0 2px;
        border-bottom: 0;
        font-size: 13px;
    }
    .dt-legal__body .dt-about__req td { padding: 0 0 10px; }
}

/* ---------- раскрывающиеся разделы (bootstrap accordion в тексте) ---------- */

.dt-legal__body .accordion { margin: 18px 0; }
.dt-legal__body .accordion-group {
    margin: 0 0 8px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}
.dt-legal__body .accordion-heading { border: 0; }
.dt-legal__body .accordion-toggle {
    display: block;
    position: relative;
    padding: 14px 46px 14px 18px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--dt-ink, #0f172a);
    text-decoration: none;
    text-transform: none;
}
.dt-legal__body .accordion-toggle:hover {
    background: #f8fafc;
    color: var(--dt-accent, #2563eb);
    text-decoration: none;
}
/* шеврон вместо ничего: понятно, что раздел раскрывается */
.dt-legal__body .accordion-toggle:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    width: 9px;
    height: 9px;
    margin-top: -6px;
    border-right: 2px solid #94a3b8;
    border-bottom: 2px solid #94a3b8;
    transform: rotate(45deg);
    transition: transform .18s ease;
}
.dt-legal__body .accordion-group:has(.accordion-body.in) .accordion-toggle:after {
    margin-top: -2px;
    transform: rotate(-135deg);
}
.dt-legal__body .accordion-inner {
    padding: 4px 18px 16px;
    border-top: 1px solid var(--dt-border, #e2e8f0);
}
.dt-legal__body .accordion-inner p:last-child { margin-bottom: 0; }

/* ---------- планшет и телефон ---------- */

@media (max-width: 900px) {
    .dt-legal__wrap {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
        padding: 14px 0 40px;
    }
    /* рельса превращается в ленту вкладок и прокручивается вбок */
    .dt-legal__rail {
        position: static;
        padding: 10px 12px;
        border-radius: 16px;
    }
    .dt-legal__rail-title { display: none; }
    .dt-legal__nav {
        display: flex;
        gap: 8px;
        width: 0;
        min-width: 100%;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }
    .dt-legal__nav li { flex: none; max-width: 260px; }
    .dt-legal__link {
        margin: 0;
        padding: 8px 14px;
        border: 1px solid var(--dt-border, #e2e8f0);
        border-radius: 9999px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 13.5px;
    }
    .dt-legal__link.is-active { border-color: transparent; }
    .dt-legal__doc { padding: 22px 18px 26px; border-radius: 16px; }
    .dt-legal__title { font-size: 22px; }
}

@media (max-width: 767px) {
    .dt-legal { font-size: 15.5px; }
    .dt-legal__body p,
    .dt-legal__body li { font-size: 15.5px; }
    .dt-legal__body table { display: block; overflow-x: auto; }
    .dt-legal__body .accordion-toggle { padding: 12px 40px 12px 14px; font-size: 14.5px; }
    .dt-legal__body .accordion-inner { padding: 4px 14px 14px; }
}