/*
 * KURS TABLES UI — учебные таблицы, справочник, проверка работ, результаты.
 * Размеры находятся в kurs_ui_tokens.css; палитра — в классах темы ниже.
 * Меняет только оформление. Колонки EditorJS, DOM, обработчики Enter,
 * отправка ответов и оценивание остаются без изменений.
 */

/* Семантические оттенки только для тех компонентов, которым не хватало тем. */
.cabinet {
    --kurs-table-focus: #167d91;
    --kurs-grammar-head-bg: #373630;
    --kurs-grammar-head-ink: #f7f0df;
    --kurs-grammar-stub-bg: #eee5d3;
    --kurs-grammar-cell-bg: #fffaf1;
    --kurs-grammar-ink: #292722;
    --kurs-grammar-line: #d1c6b8;
}
.cabinet.cabinet-theme-dark {
    --kurs-table-focus: #18e4e8;
    --kurs-grammar-head-bg: #281713;
    --kurs-grammar-head-ink: #fffaf4;
    --kurs-grammar-stub-bg: #30201b;
    --kurs-grammar-cell-bg: #21130f;
    --kurs-grammar-ink: #fffaf4;
    --kurs-grammar-line: #80665b;
}
.cabinet.cabinet-theme-joyfull {
    --kurs-table-focus: #c34c79;
    --kurs-grammar-head-bg: #293b63;
    --kurs-grammar-head-ink: #ffffff;
    --kurs-grammar-stub-bg: #fff0b4;
    --kurs-grammar-cell-bg: #ffffff;
    --kurs-grammar-ink: #2d2940;
    --kurs-grammar-line: #ddd5e8;
}

/* Общая геометрия настоящих таблиц, без изменения их ширины и расположения. */
.cabinet :is(.lesson-table, .essay-score-table, .grammar-table) {
    box-sizing: border-box;
    font-family: var(--kurs-font-ui);
    font-size: var(--kurs-table-font-size) !important;
    line-height: var(--kurs-table-line-height) !important;
}
.cabinet :is(.lesson-table, .essay-score-table) {
    border-collapse: collapse;
    border-spacing: 0;
}
.cabinet :is(.lesson-table, .essay-score-table, .grammar-table) :is(th, td) {
    box-sizing: border-box;
    min-width: 0;
    padding: var(--kurs-table-cell-pad-y) var(--kurs-table-cell-pad-x) !important;
    vertical-align: top;
    font-family: var(--kurs-font-ui) !important;
    font-size: var(--kurs-table-font-size) !important;
    line-height: var(--kurs-table-line-height) !important;
    border-width: var(--kurs-table-border-width) !important;
    border-style: solid;
    overflow-wrap: anywhere;
}
.cabinet :is(.lesson-table, .essay-score-table, .grammar-table) th {
    font-weight: 800;
}
.cabinet .lesson-table-scroll {
    box-sizing: border-box;
    max-width: 100%;
}
/* Не менять table-layout / ширины <col> из EditorJS. */
.cabinet .lesson-table :is(th, td) {
    text-align: left;
}

/* Редактор ученической ячейки. ВАЖНО: pre-wrap, цветные span и <br> не трогать. */
.cabinet .lesson-student-table-cell {
    box-sizing: border-box;
    min-width: 0;
}
.cabinet :is(
    .lesson-student-table-input[contenteditable="true"],
    .lesson-student-table-cell .lesson-student-input[contenteditable="true"]
) {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: var(--kurs-table-input-min-height);
    padding: 6px 8px;
    border-radius: var(--kurs-control-radius);
    font-family: var(--kurs-font-ui);
    font-size: var(--kurs-table-font-size) !important;
    line-height: var(--kurs-table-line-height) !important;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere;
    overflow-y: auto;
}
.cabinet :is(
    .lesson-student-table-input[contenteditable="true"],
    .lesson-student-table-cell .lesson-student-input[contenteditable="true"]
):focus-visible {
    outline: 2px solid var(--kurs-table-focus);
    outline-offset: 1px;
}

/* Критерии ЕГЭ — таблица на странице «Мои сочинения». */
.cabinet .essay-score-table {
    border-width: var(--kurs-table-border-width);
    border-style: solid;
}
.cabinet .essay-score-table :is(th, td) {
    border-width: var(--kurs-table-border-width);
}
.cabinet .essay-score-table tfoot th {
    border-top-width: 2px !important;
}

/* Результаты пробника используют CSS Grid, а не <table>.
 * Колонки и responsive grid-template-columns оставлены как есть. */
.cabinet :is(.mock-criteria-table, .mock-result-answer-table) {
    box-sizing: border-box;
    min-width: 0;
    border-top-width: var(--kurs-table-border-width);
    border-left-width: var(--kurs-table-border-width);
    border-top-style: solid;
    border-left-style: solid;
    font-family: var(--kurs-font-ui);
    font-size: var(--kurs-table-font-size);
    line-height: var(--kurs-table-line-height);
}
.cabinet :is(.mock-criteria-table, .mock-result-answer-table) > * {
    box-sizing: border-box;
    min-width: 0;
    margin: 0;
    padding: var(--kurs-table-cell-pad-y) var(--kurs-table-cell-pad-x);
    border-right-width: var(--kurs-table-border-width);
    border-bottom-width: var(--kurs-table-border-width);
    border-right-style: solid;
    border-bottom-style: solid;
    font-family: var(--kurs-font-ui);
    font-size: var(--kurs-table-font-size);
    line-height: var(--kurs-table-line-height);
    overflow-wrap: anywhere;
}
.cabinet :is(.mock-criteria-head, .mock-result-answer-table .mock-answer-head) {
    font-size: var(--kurs-text-label);
    font-weight: 800;
    line-height: 1.35;
}

/* Справочник грамматики: существующая прокрутка на ПК,
 * мобильное преобразование в карточки остаются без изменений. */
.cabinet .grammar-table-wrap {
    box-sizing: border-box;
    border-radius: var(--kurs-card-radius);
}
.cabinet .grammar-table { color: var(--kurs-grammar-ink); }
.cabinet .grammar-table :is(th, td) {
    border-color: var(--kurs-grammar-line);
}
.cabinet .grammar-table thead th {
    background-color: var(--kurs-grammar-head-bg);
    color: var(--kurs-grammar-head-ink);
    font-size: var(--kurs-text-small) !important;
}
.cabinet .grammar-table tbody th {
    background-color: var(--kurs-grammar-stub-bg);
    color: var(--kurs-grammar-ink);
}
.cabinet .grammar-table td {
    background-color: var(--kurs-grammar-cell-bg);
    color: var(--kurs-grammar-ink);
}
.cabinet .grammar-table thead small { font-size: 10px; }

/* Формы ученических ответов: границы, размеры и шрифты без перекраски.
 * Специфические стили верного/неверного ответа и disabled сохраняются. */
.cabinet :is(
    .test-short-answer, .mock-answer-input, .grammar-answer,
    .joined-select, .ne-writing, .ne-reason, .punct-reason,
    .letter-answer-input, .roots-answer-input
) {
    box-sizing: border-box;
    border-radius: var(--kurs-control-radius);
    font-family: var(--kurs-font-ui);
    font-size: var(--kurs-text-field);
    line-height: 1.4;
}
.cabinet :is(
    .test-short-answer, .mock-answer-input, .grammar-answer,
    .joined-select, .ne-writing, .ne-reason, .punct-reason
) { min-height: var(--kurs-control-height); }
.cabinet :is(.letter-answer-input, .roots-answer-input) {
    min-height: var(--kurs-control-compact-height);
}
.cabinet :is(
    .test-short-answer, .mock-answer-input, .grammar-answer,
    .joined-select, .ne-writing, .ne-reason, .punct-reason,
    .letter-answer-input, .roots-answer-input
):focus-visible {
    outline: 2px solid var(--kurs-table-focus);
    outline-offset: 2px;
}

@media (max-width: 700px) {
    /* Мобильные колонки EditorJS по-прежнему ужимаются по прежним правилам. */
    .cabinet .lesson-table :is(th, td) {
        padding: var(--kurs-table-cell-pad-mobile-y) var(--kurs-table-cell-pad-mobile-x) !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        overflow-wrap: anywhere;
    }
    .cabinet :is(
        .lesson-student-table-input[contenteditable="true"],
        .lesson-student-table-cell .lesson-student-input[contenteditable="true"]
    ) {
        max-width: 100%;
        min-width: 0;
        padding: 5px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }
    .cabinet .essay-score-table :is(th, td),
    .cabinet :is(.mock-criteria-table, .mock-result-answer-table) > * {
        padding: var(--kurs-table-cell-pad-mobile-y) 8px !important;
        font-size: 13px;
    }
    .cabinet .grammar-table tr {
        border-radius: var(--kurs-card-radius);
        border-color: var(--kurs-grammar-line);
    }
    .cabinet .grammar-table :is(th, td) {
        padding: 12px 14px !important;
    }
    .cabinet .grammar-table td,
    .cabinet .grammar-table tbody th {
        border-color: var(--kurs-grammar-line);
    }
}