/* TSIM_V3_2026_11_09: урок курса — учебный график поверх основного и карточка заданий.
   Канон вида: DESIGN-DNA-TOOLS.md раздел 0; поля и кнопки — как у карточки уроков v2 (TSIM_L23). */

/* Учебный график закрывает основной целиком: задания идут на своих свечах, счёт и история не меняются */
.tsim-chart-container > .tsim-lstage { position: absolute; inset: 0; z-index: 25; overflow: hidden !important; background: #0a0d12; }
.tsim-lstage[hidden] { display: none !important; }
.tsim-lstage-chart { position: absolute; inset: 0; cursor: crosshair; }
.tsim-lstage.is-board .tsim-lstage-chart { cursor: default; }
.tsim-lstage-tag {
    position: absolute; top: 10px; right: 84px; z-index: 3; max-width: calc(100% - 480px);
    display: flex; flex-direction: column; align-items: flex-end; gap: 2px; pointer-events: none; text-align: right;
    font: 400 13px/1.35 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #949ca7;
}
.tsim-lstage-tag[hidden] { display: none; }
.tsim-lstage-name { color: #e6e9ee; font-weight: 500; }
.tsim-lstage-src { font-size: 12px; }

/* Линейка «вход → стоп» справа от последней свечи */
.tsim-lstage-ruler {
    position: absolute; z-index: 3; width: 8px; box-sizing: border-box; pointer-events: none;
    border: 1px solid #e6e9ee; border-left: none; border-radius: 0 2px 2px 0;
}
.tsim-lstage-ruler[hidden] { display: none; }
.tsim-lstage-ruler span {
    position: absolute; left: 14px; top: 50%; transform: translateY(-50%); white-space: nowrap;
    padding: 2px 6px; border-radius: 4px; background: rgba(10, 13, 18, .85);
    font: 500 12px/1.3 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #e6e9ee;
}

/* Задание на числах: доска вместо графика */
.tsim-lstage-board { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; padding: 16px 16px 16px 400px; box-sizing: border-box; }
.tsim-lstage-board[hidden] { display: none; }
.tsim-lv3-board { display: flex; flex-direction: column; gap: 10px; font: 400 20px/1.35 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #b3b9c2; }
.tsim-lv3-board b { color: #e6e9ee; font-weight: 600; }
.tsim-lv3-board-q { margin-top: 6px; color: #e6e9ee; font-weight: 600; }

/* Карточка урока v3 на ПК чуть шире: в ней поля и таблица сравнения */
@media (min-width: 769px) {
    .tsim-course.is-lv3 .tsim-onboard-pop { width: 360px; }
}

/* Пока открыт учебный график, полосы и кнопки основного графика не видны */
.tsim-chart-container.has-lstage .tsim-starthere-strip,
.tsim-chart-container.has-lstage .tsim-bridge-strip,
.has-lstage > .tsim-hotkeys,
.has-lstage > .tsim-chart-controls { display: none !important; }

/* Сначала объяснение, потом кнопка: разбор, сравнение и ошибки контрольного стоят над действиями */
.tsim-course-acts > .tsim-lv3-verdict,
.tsim-course-acts > .tsim-lv3-box,
.tsim-course-acts > .tsim-lv3-review,
.tsim-course-acts > .tsim-lv3-exv { order: -1; }

/* Вердикт после ответа */
.tsim-lv3-verdict { flex: 1 1 100%; margin: 0; padding: 10px 12px; border-radius: 6px; background: #171e28; font: 400 14px/1.5 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #d1d4dc; }
.tsim-lv3-verdict strong { font-weight: 600; }
.tsim-lv3-verdict.is-ok strong { color: #95ce5a; }
.tsim-lv3-verdict.is-err strong { color: #f87171; }
/* Что было дальше: строка под разбором стопа (TSIM_V3_STOPFIX_2026_11_09) */
.tsim-lv3-next { margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255, 255, 255, .06); color: #b3b9c2; }

/* Пример: разбор выбранного стопа, под ним объём; текст карточки пуст и не занимает место */
.tsim-lv3-exv { flex: 1 1 100%; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.tsim-lv3-size { font: 400 14px/1.55 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #9ca3af; }
.tsim-onboard.is-lv3 .tsim-onboard-text:empty { display: none; }

/* «Суть»: подсветка 10 дней, линия стопа тянется (TSIM_V3_RULE10_2026_11_09) */
.tsim-lstage.is-drag .tsim-lstage-chart { touch-action: none; }
.tsim-lv3-live { display: flex; flex-direction: column; gap: 6px; }
.tsim-lstage-win { position: absolute; top: 0; z-index: 1; pointer-events: none; background: rgba(230, 233, 238, .07); border-left: 1px dashed rgba(230, 233, 238, .22); border-right: 1px dashed rgba(230, 233, 238, .22); box-sizing: border-box; }
.tsim-lstage-win[hidden] { display: none; }
.tsim-lv3-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; border-radius: 6px; overflow: hidden; background: rgba(255, 255, 255, .06); }
.tsim-lv3-cell { display: flex; flex-direction: column; gap: 2px; padding: 7px 10px; background: #121922; min-width: 0; }
.tsim-lv3-k { font: 400 12px/1.3 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #949ca7; }
.tsim-lv3-s { font: 400 12px/1.3 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #949ca7; }
.tsim-lv3-v { font: 500 14px/1.35 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #e6e9ee; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tsim-lv3-tag { padding: 6px 10px; border-radius: 6px; background: #171e28; font: 400 13px/1.45 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #d1d4dc; }
.tsim-lv3-tag.is-ok { color: #95ce5a; }
.tsim-lv3-tag.is-soft { color: #e6e9ee; }
.tsim-lv3-tag.is-err { color: #f87171; }
.tsim-lv3-input .tsim-lv3-per { margin-top: 6px; }

/* «Что было бы»: два варианта стопа рядом */
.tsim-lv3-box { flex: 1 1 100%; min-width: 0; }
.tsim-lv3-cmp { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 0; font: 400 13px/1.4 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #d1d4dc; }
.tsim-lv3-cmp th, .tsim-lv3-cmp td { padding: 5px 6px; border: none; text-align: left; vertical-align: top; background: transparent; }
.tsim-lv3-cmp tr:first-child th { color: #949ca7; font-weight: 400; font-size: 12px; }
.tsim-lv3-cmp th.is-k { width: 74px; color: #949ca7; font-weight: 400; }
.tsim-lv3-cmp tr + tr { border-top: 1px solid rgba(255, 255, 255, .06); }
.tsim-lv3-note { margin-top: 6px; font: 400 12px/1.4 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #949ca7; }

/* Сделка: стоп и объём рядом, под ними — сколько теряет лот */
.tsim-lv3-two { display: flex; gap: 8px; min-width: 0; }
.tsim-lv3-field { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tsim-onboard .tsim-lv3-trade input[type="text"] {
    width: 100%; max-width: none; min-width: 0; margin: 0; box-sizing: border-box;
    height: 40px; padding: 0 12px; border: none; border-radius: 6px;
    background: #0a0d12; color: #f0f3fa; font: 500 15px/1 'IBM Plex Sans', -apple-system, 'Segoe UI', sans-serif; box-shadow: none; outline: none;
}
.tsim-onboard .tsim-lv3-trade input[type="text"]:focus { background: #0a0d12; color: #f0f3fa; outline: 2px solid #95ce5a; outline-offset: 0; }
.tsim-onboard .tsim-lv3-trade input[type="text"]::placeholder { color: #6b7280; }
.tsim-lv3-per { font: 400 13px/1.45 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #949ca7; }
.tsim-onboard .tsim-lv3-trade .tsim-course-act { flex: 1 1 100%; margin-top: 2px; }

/* Разбор ошибок контрольного */
.tsim-lv3-review { flex: 1 1 100%; min-width: 0; display: flex; flex-direction: column; gap: 8px; max-height: 260px; overflow-y: auto; }
.tsim-lv3-review-row { padding: 8px 10px; border-radius: 6px; background: #171e28; }
.tsim-lv3-review-h { font: 500 13px/1.35 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #e6e9ee; margin-bottom: 2px; }
.tsim-lv3-review-t { font: 400 13px/1.45 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #b3b9c2; }

/* «Путь»: отметка «сдан» */
.tsim-lesson.is-passed .tsim-lesson-mark { color: #95ce5a; }

@media (max-width: 768px) {
    .tsim-lstage-tag { top: 6px; left: 6px; right: auto; max-width: calc(100% - 96px); align-items: flex-start; text-align: left; padding: 3px 6px; border-radius: 4px; background: rgba(10, 13, 18, .78); }
    .tsim-lstage-name, .tsim-lstage-src { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
    .tsim-lstage-board { padding: 12px; }
    .tsim-lv3-board { font-size: 17px; gap: 6px; }
    .tsim-course[data-dock="1"] .tsim-lv3-verdict { font-size: 13px; padding: 8px 10px; }
    .tsim-course[data-dock="1"] .tsim-lv3-size { font-size: 13px; line-height: 1.45; }
    .tsim-onboard .tsim-lv3-trade input[type="text"] { height: 44px; font-size: 16px; }
    .tsim-lv3-review { max-height: 200px; }
    .tsim-course.is-lv3-pick .tsim-course-acts .tsim-course-act { flex: 1 1 calc(50% - 3px); min-width: 0; min-height: 44px; padding-left: 8px; padding-right: 8px; white-space: normal; line-height: 1.25; }
}
