/* ============================================================
   Анкета репетитора — нормализация облика. v1 (24.08.2026).
   Скоуп — .dt-profile (обёртка в profile.tpl): body-класса на
   вкладке рабочего стола нет, поэтому по контейнеру.

   Не меняем раскладку (floats из styles.css), только облик:
   шрифты к var(--dt-font), секции — белые карточки, отзывы и
   цены — читаемые списки, кнопка записи — фирменная пилюля.

   Среда: html{font-size:62.5%} → только пиксели; в конце
   index.tpl глобальный * { margin: 0 auto } — поля задаём явно.
   ============================================================ */

/* Шрифт — Manrope, как в «Классе» (грузится из landingcss/rail.css). */
.dt-profile {
    font-family: 'Manrope', 'Inter', var(--dt-font, Arial, Helvetica, sans-serif);
    color: var(--dt-text, #475569);
}

/* на вкладке рабочего стола заголовок и так есть — крошку не дублируем */
body.dt-dashboard .dt-profile .breadcrumbs { display: none; }

/* ---------- верхние алерты ---------- */

.dt-profile > .alert {
    margin: 0 0 14px;
    border-radius: 14px;
    font-size: 14px;
}

/* ---------- хлебная крошка ---------- */

.dt-profile .breadcrumbs { margin: 2px 0 10px; }
.dt-profile .breadcrumbs .val { font-size: 13px; color: var(--dt-muted, #64748b); }
.dt-profile .breadcrumbs .marker {
    color: var(--dt-accent, #2563eb);
    text-decoration: none;
    font-weight: 600;
}
.dt-profile .breadcrumbs .marker:hover { text-decoration: underline; }
.dt-profile .breadcrumbs .marker-current { color: var(--dt-muted, #64748b); }
.dt-profile .breadcrumbs hr { display: none; }

/* ---------- шапка анкеты в духе «Профи» ---------- */

.dt-profile .dt-hero {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin: 0 0 18px;
    padding: 18px 20px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 30px -28px rgba(15, 23, 42, .4);
}
.dt-profile .dt-hero__ava {
    flex: none;
    width: 88px;
    height: 88px;
    margin: 0;
    border-radius: 20px;
    object-fit: cover;
    border: 1px solid rgba(226, 232, 240, .9);
}
.dt-profile .dt-hero__main { flex: 1 1 auto; min-width: 0; margin: 0; }
.dt-profile .dt-hero__name {
    margin: 4px 0 0;
    padding: 0;
    font-family: inherit;
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}
.dt-profile .dt-hero__name .fa-check-circle {
    color: var(--dt-accent, #2563eb);
    font-size: 19px;
    vertical-align: 2px;
}
.dt-profile .dt-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 10px 0 0;
}
.dt-profile .dt-hero__chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    padding: 5px 12px;
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}
.dt-profile .dt-hero__chip--rating { background: #fef3c7; color: #b45309; }
.dt-profile .dt-hero__chip--reviews { background: #e7f0fe; color: #1d4ed8; }
.dt-profile .dt-hero__chip--reviews:hover { background: #dbe9fd; text-decoration: none; }
.dt-profile .dt-hero__chip--cert { background: #dcfce7; color: #16a34a; }
.dt-profile .dt-hero__balance { font-size: 13px; font-weight: 600; color: var(--dt-muted, #64748b); }
.dt-profile .dt-hero__trace { margin: 8px 0 0; font-size: 11.5px; color: #94a3b8; }
.dt-profile .dt-hero__side {
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    margin: 0;
    max-width: 46%;
}
.dt-profile .dt-hero__offer { font-size: 12px; }
.dt-profile .dt-hero__offer .nav-pills { margin: 0; }
.dt-profile .dt-hero__offer--plain { color: var(--dt-muted, #64748b); }
.dt-profile .dt-hero__cta { white-space: nowrap; }

@media (max-width: 767px) {
    .dt-profile .dt-hero { flex-wrap: wrap; padding: 14px 16px; }
    .dt-profile .dt-hero__ava { width: 64px; height: 64px; border-radius: 16px; }
    .dt-profile .dt-hero__name { font-size: 20px; }
    .dt-profile .dt-hero__side { align-items: flex-start; max-width: 100%; }
}

/* ---------- шапка анкеты: имя, сертификация, договор ---------- */

.dt-profile legend {
    margin: 0 0 14px;
    padding: 0;
    border: 0;
    line-height: 1.2;
}
.dt-profile .user-fio {
    margin: 0;
    font-family: inherit;
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}
.dt-profile .user-fio .fa-check-circle {
    color: var(--dt-accent, #2563eb) !important;
    font-size: 20px;
    vertical-align: 2px;
}
.dt-profile .user-fio small.muted {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    color: #94a3b8;
}
/* выпадашка договора справа */
.dt-profile legend .nav-pills { margin: 0; }
.dt-profile legend .nav-pills .dropdown-toggle { font-size: 12.5px; }

/* ---------- левая колонка ---------- */

.dt-profile .sideBlocks {
    font-size: 13.5px;
    color: var(--dt-text, #475569);
}
.dt-profile .sideBlocks > b { color: var(--dt-ink, #0f172a); }

.dt-profile .sideBlocks .block {
    margin: 0 0 14px;
    padding: 12px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 30px -28px rgba(15, 23, 42, .4);
}
.dt-profile .sideBlocks .block .title {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8b95a5;
}
.dt-profile .sideBlocks .block .title:empty { display: none; }

/* Метрики анкеты (ранг, рейтинг, дисциплина, баллы) — компактные строки
   вместо гигантских процентов. */
.dt-profile .badge-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 8px;
    padding: 8px 11px;
    border: 1px solid #eef2f6;
    border-radius: 12px;
    background: #f8fafc;
}
.dt-profile .badge-price-title {
    margin: 0;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--dt-muted, #64748b);
}
.dt-profile .badge-price .badge.badge-price-value {
    display: inline-flex;
    align-items: baseline;
    gap: 1px;
    flex: none;
    margin: 0;
    padding: 3px 9px;
    border-radius: 9999px;
    background: #e7f0fe;
    background-image: none;
    box-shadow: none;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.35;
    color: #1d4ed8;
    text-shadow: none;
}
.dt-profile .badge-price .badge.badge-price-value span {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.dt-profile .badge-price .badge.badge-price-value .percent { font-size: 10.5px; }
.dt-profile .badge-price .rating[style] { margin: 0 !important; }
.dt-profile .block_userface img { border-radius: 12px; max-width: 100%; }
/* фото теперь в шапке-hero — дубль в левом блоке прячем, кнопки остаются */
.dt-profile .block_userface .c > div:first-child:not(.user-controls):not(.fail) { display: none; }
.dt-profile .block_userface .user-controls { margin: 8px 0 0; }
.dt-profile .block_userface .user-controls .btn-link {
    padding: 3px 0;
    font-family: inherit;
    font-size: 13px;
    color: var(--dt-accent, #2563eb);
    text-align: left;
    text-shadow: none;
}
/* Спрайтовые иконки bootstrap-2 (icon-th-list у «Управления ролями»,
   icon-upload/icon-edit в выпадашке фото) — пиксельное старьё, к тому же
   th-list c pull-right вылезал за карточку. Подписи самодостаточны. */
.dt-profile .user-controls [class^="icon-"],
.dt-profile .user-controls [class*=" icon-"] { display: none; }
.dt-profile .user-controls .caret {
    margin-left: 4px;
    border-top-color: currentColor;
    opacity: .55;
}
.dt-profile .block_userface .fail { font-size: 13px; }
.dt-profile .block_userface .failpercent { font-weight: 700; color: #059669; }
.dt-profile .sideBlocks .accordion { margin: 8px 0 0; }
.dt-profile .sideBlocks .accordion-toggle { font-size: 13px; padding: 6px 10px; }
.dt-profile .sideBlocks .accordion-inner { font-size: 12.5px; }
.dt-profile .sideBlocks .accordion-inner .req { margin: 0 6px 0 0; }

/* ---------- «Вам нужны ученики?» (в шапке-hero) ---------- */

.dt-profile .block-need-pupil {
    position: static;
    left: auto;
    top: auto;
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 7px 12px;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    background: #eff6ff;
    font-size: 13px;
    color: #1e40af;
}
.dt-profile .block-need-pupil .fa-info-circle { color: var(--dt-accent, #2563eb); }
.dt-profile .block-need-pupil span.text { font-weight: 700; }
.dt-profile .block-need-pupil select.need-pupil {
    height: 32px;
    width: auto;
    margin: 0;
    padding: 0 8px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    background: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    color: #1e40af;
}

/* старый style.css тянул тело анкеты вверх отрицательным отступом —
   из-за этого колонки наезжали на элементы над ними */
.dt-profile .profile_body { margin-top: 0; }

/* ---------- секции-карточки ---------- */

.dt-profile .profile_body { font-size: 14px; }

/* Две колонки тела анкеты. Спаны бутстрапа внутри колонок гасим:
   их проценты и float считались от всей строки. */
.dt-profile .dt-profile-cols {
    display: flex;
    gap: 0 18px;
    align-items: flex-start;
    margin: 0;
}
.dt-profile .dt-profile-col {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
}
/* Порядок левой колонки — по тому, что ищет клиент: подтверждающие
   документы у фото, образование и опыт, отзывы (социальное доказательство
   до цены), затем цены. Разметка остаётся в исходном порядке — рулит order. */
.dt-profile .dt-profile-col > .dt-profile-albums { order: 1; }
.dt-profile .dt-profile-col > .block-education   { order: 2; }
.dt-profile .dt-profile-col > .dt-profile-reviews { order: 3; }
.dt-profile .dt-profile-col > .block-prices      { order: 4; }
.dt-profile .dt-profile-col > .span6,
.dt-profile .dt-profile-col > .span12 {
    float: none;
    width: auto;
    margin: 0 0 16px;
    display: block;
}
@media (max-width: 860px) {
    .dt-profile .dt-profile-cols { display: block; }
}

.dt-profile .miniblocks_set {
    margin: 0 0 16px;
    padding: 16px 20px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 30px -28px rgba(15, 23, 42, .4);
}
.dt-profile .miniblocks_set h4 {
    margin: 0 0 12px;
    padding: 0 0 10px;
    border-bottom: 1px solid #eef2f6;
    font-family: inherit;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}
.dt-profile .miniblocks_set h4 b { font-weight: 700; }
.dt-profile .miniblocks_set hr {
    margin: 10px 0;
    border: 0;
    border-top: 1px solid #eef2f6;
}

.dt-profile .miniblock { margin: 0; }

/* Пары «лейбл — значение»: фиксированная колонка лейбла вместо процентов,
   чтобы значения не убегали к центру на широких карточках. */
.dt-profile .miniblock .lbl {
    float: left;
    width: 150px;
    padding: 3px 0;
    font-size: 13px;
    color: #7d8a9c;
}
.dt-profile .miniblock .info {
    float: none;
    width: auto;
    margin-left: 164px;
    padding: 3px 0;
    font-size: 14px;
    color: #334155;
    overflow-wrap: anywhere;
}

/* Простыни текста («О себе», «Опыт»): никакого justify с его дырами,
   человеческий межстрочный интервал. */
.dt-profile .miniblock > div {
    text-align: left !important;
    line-height: 1.65;
}
.dt-profile .miniblock p { margin: 0 0 10px; }
.dt-profile .miniblock a { color: var(--dt-accent, #2563eb); text-decoration: none; }
.dt-profile .miniblock a:hover { text-decoration: underline; }
.dt-profile .vuz {
    margin: 0 0 10px;
    padding: 10px 12px;
    border: 1px solid #eef2f6;
    border-radius: 12px;
}

/* ---------- цены и варианты: строки «услуга … цена», как на Профи ---------- */

.dt-profile .dt-prices__subject {
    margin: 14px 0 4px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--dt-ink, #0f172a);
}
.dt-profile .dt-prices__subject:first-of-type { margin-top: 2px; }
.dt-profile .dt-prices__dir {
    margin: 8px 0 2px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #8b95a5;
}
.dt-profile .dt-prices__row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 0;
    padding: 6px 0;
}
.dt-profile .dt-prices__name {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: #334155;
}
.dt-profile .dt-prices__dots {
    flex: 1 1 auto;
    min-width: 24px;
    margin: 0;
    border-bottom: 1px dotted #c3cdd9;
    transform: translateY(-4px);
}
.dt-profile .dt-prices__val {
    flex: none;
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--dt-ink, #0f172a);
    white-space: nowrap;
}
.dt-profile .one-free { margin: 10px 0 0; }
.dt-profile .one-free p {
    display: inline-block;
    margin: 0;
    padding: 7px 14px;
    border-radius: 9999px;
    background: #dcfce7;
    font-size: 13.5px;
    font-weight: 700;
    color: #16a34a;
}

/* ---------- альбомы ---------- */

.dt-profile .album { margin: 0 0 16px; }
.dt-profile .album h4 {
    margin: 0 0 10px;
    font-family: inherit;
    font-size: 17px;
    font-weight: 700;
    color: var(--dt-ink, #0f172a);
    text-shadow: none;
}
.dt-profile .album_line img {
    margin: 0 8px 8px 0;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 12px;
}
/* в колонке анкеты альбом — такая же карточка, как остальные секции */
.dt-profile .dt-profile-albums .album {
    padding: 16px 20px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 14px 30px -28px rgba(15, 23, 42, .4);
}
.dt-profile .dt-profile-albums .album h4 {
    padding: 0 0 10px;
    border-bottom: 1px solid #eef2f6;
}
.dt-profile .dt-profile-albums .album_line { overflow-x: auto; }

/* ---------- «О себе»: сворачивание длинного текста ---------- */

.dt-profile .block-about-tutor.is-collapsed .miniblocks_set {
    position: relative;
    max-height: 960px;
    overflow: hidden;
    padding-bottom: 56px;
}
.dt-profile .block-about-tutor.is-collapsed .miniblocks_set:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 44px;
    height: 90px;
    margin: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
    pointer-events: none;
}
.dt-profile .dt-about-toggle {
    position: static;
    display: block;
    width: 100%;
    margin: 6px 0 0;
    padding: 10px 16px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 12px;
    background: #fff;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--dt-accent, #2563eb);
    text-shadow: none;
    cursor: pointer;
}
.dt-profile .dt-about-toggle:hover { border-color: rgba(37, 99, 235, .35); background: #f8fafc; }
.dt-profile .block-about-tutor.is-collapsed .dt-about-toggle {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 14px;
    width: auto;
    z-index: 1;
}

/* ---------- отзывы ---------- */

.dt-profile .review {
    margin: 0;
    padding: 14px 0;
    border-top: 1px solid #eef2f6;
}
/* строки отзыва — флексом: имя слева, дата справа; аватар круглый */
.dt-profile .review > .row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px 14px;
    width: auto;
    margin: 0 0 4px;
}
.dt-profile .review > .row:before,
.dt-profile .review > .row:after { display: none; }
.dt-profile .review .span9,
.dt-profile .review .span3,
.dt-profile .review .span10 {
    float: none;
    width: auto;
    margin: 0;
    min-width: 0;
}
.dt-profile .review .span2 { float: none; flex: none; margin: 0; }
.dt-profile .review .span10 { flex: 1 1 auto; }
.dt-profile .review .span3 p { margin: 0; }
.dt-profile .review .userpicture {
    width: 44px !important;
    height: 44px !important;
    border-radius: 9999px;
    object-fit: cover;
}
.dt-profile .review:first-child { border-top: 0; padding-top: 4px; }
/* звезда отзыва: спрайт не красится цветом — рисуем свою */
.dt-profile .review .icon-star {
    width: auto;
    height: auto;
    margin: 0 2px 0 0;
    background: none;
    vertical-align: baseline;
}
.dt-profile .review .icon-star:before {
    content: '★';
    font-size: 14px;
    line-height: 1;
    color: #f59e0b;
}
.dt-profile .review a { color: var(--dt-accent, #2563eb); font-weight: 600; text-decoration: none; }
.dt-profile .review a:hover { text-decoration: underline; }
.dt-profile .review .muted { font-size: 12.5px; color: #94a3b8; }
.dt-profile .review .text-justify {
    text-align: left !important;
    font-size: 14px;
    line-height: 1.6;
    color: #334155;
}
.dt-profile .review .userpicture { border-radius: 10px; }

/* табы «От учеников / От коллег» */
.dt-profile ul.nav-reviews {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
    list-style: none;
}
.dt-profile ul.nav-reviews > li { margin: 0; }
.dt-profile ul.nav-reviews > li > a {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 7px 15px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 9999px;
    background: #f8fafc;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    color: #475569;
    text-decoration: none;
    text-shadow: none;
}
.dt-profile ul.nav-reviews > li > a:hover {
    border-color: #cbd5e1;
    background: #fff;
    color: var(--dt-ink, #0f172a);
}
.dt-profile ul.nav-reviews > li.active > a {
    border-color: transparent;
    background: var(--dt-accent, #2563eb);
    color: #fff;
}

/* «Посмотреть ещё отзывы» — тихая вторичная кнопка */
.dt-profile .btn.btn-morereviews {
    height: auto;
    margin: 6px 0 0;
    padding: 10px 20px;
    border: 1px solid var(--dt-border, #e2e8f0);
    border-radius: 12px;
    background-color: #fff;
    background-image: none;
    box-shadow: none;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--dt-accent, #2563eb);
    text-shadow: none;
}
.dt-profile .btn.btn-morereviews:hover {
    border-color: rgba(37, 99, 235, .35);
    background-color: #f8fafc;
    color: var(--dt-accent, #2563eb);
}

/* ---------- кнопка «Записаться на пробный урок» ---------- */

.dt-profile .dt-profile-cta-wrap {
    clear: both;
    margin: 26px auto 10px;
    text-align: center;
}
.dt-profile .btn.dt-profile-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    margin: 0;
    padding: 0 28px;
    border: 0;
    border-radius: 9999px;
    background-color: var(--dt-accent, #2563eb);
    background-image: linear-gradient(90deg, #3b82f6, #2f74ee 40%, #2563eb 72%, #1d4ed8);
    background-size: 220% 100%;
    background-position: 0% 50%;
    box-shadow: 0 10px 26px -18px rgba(37, 99, 235, .78);
    font-family: inherit;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    text-shadow: none;
    cursor: pointer;
    transition: background-position .52s cubic-bezier(.22, 1, .36, 1),
                transform .18s ease, box-shadow .22s ease;
}
.dt-profile .btn.dt-profile-cta:hover,
.dt-profile .btn.dt-profile-cta:focus {
    background-position: 100% 50%;
    transform: translateY(-1px);
    box-shadow: 0 14px 30px -18px rgba(37, 99, 235, .82);
    color: #fff;
}

/* ---------- узкие экраны ---------- */

@media (max-width: 767px) {
    .dt-profile .user-fio { font-size: 22px; }
    .dt-profile .miniblocks_set { padding: 14px 16px; border-radius: 16px; }
    .dt-profile .block-need-pupil {
        display: flex;
        flex-wrap: wrap;
        width: auto;
    }
    /* пары «лейбл — значение» в столбик */
    .dt-profile .miniblock .lbl { float: none; width: auto; padding-bottom: 0; }
    .dt-profile .miniblock .info { margin-left: 0; }
}


/* значок проверенного преподавателя рядом с именем (25.08.2026:
   вместо спрайта fa-check-circle, формулировка — «верификация») */
.dt-profile .dt-verified {
    display: inline-block;
    width: 21px;
    height: 21px;
    margin-left: 8px;
    vertical-align: -3px;
    color: #2563eb;
}
.dt-profile .dt-verified svg { display: block; width: 100%; height: 100%; }