/*
 * Teacher workspace readability baseline.
 * Loaded after all feature styles so legacy compact rules cannot reduce
 * instructional or administrative text below the agreed readable scale.
 */

:root {
    --teacher-body-size: 16px;
    --teacher-leading: 1.6;
    --teacher-button-height: 40px;
    --teacher-input-height: 44px;
    --teacher-table-row-height: 52px;
}

.teacher-shell,
.teacher-login,
.modal-backdrop,
.teacher-toast,
.tex-editor-backdrop {
    font-size: var(--teacher-body-size);
    line-height: var(--teacher-leading);
}

/* Never let inherited legacy sizes such as 6px–15px reach visible UI text. */
.teacher-shell :where(p, span, small, strong, b, em, i, a, label, legend, li, td, th, code, pre),
.teacher-login :where(p, span, small, strong, b, em, i, a, label, legend, li),
.modal-backdrop :where(p, span, small, strong, b, em, i, a, label, legend, li, td, th, code, pre),
.tex-editor-backdrop :where(p, span, small, strong, b, em, i, a, label, legend, li, td, th, code, pre),
.teacher-toast {
    font-size: max(var(--teacher-body-size), 1em) !important;
    line-height: var(--teacher-leading);
}

.teacher-shell :where(button, input, select, textarea),
.teacher-login :where(button, input, select, textarea),
.modal-backdrop :where(button, input, select, textarea),
.tex-editor-backdrop :where(button, input, select, textarea) {
    font-size: var(--teacher-body-size) !important;
    line-height: var(--teacher-leading);
}

.teacher-shell :where(button, [role="button"]),
.teacher-login :where(button, [role="button"]),
.modal-backdrop :where(button, [role="button"]),
.tex-editor-backdrop :where(button, [role="button"]) {
    min-height: var(--teacher-button-height);
}

.teacher-shell :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), select, textarea),
.teacher-login :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.modal-backdrop :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]), select, textarea),
.tex-editor-backdrop :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea) {
    min-height: var(--teacher-input-height);
}

.teacher-shell :where(input, textarea)::placeholder,
.teacher-login :where(input, textarea)::placeholder,
.modal-backdrop :where(input, textarea)::placeholder,
.tex-editor-backdrop :where(input, textarea)::placeholder {
    font-size: var(--teacher-body-size) !important;
    line-height: var(--teacher-leading);
}

.teacher-shell :where(.table-row, .question-table-row, .question-folder-row, .member-row),
.modal-backdrop :where(.table-row, .question-table-row, .question-folder-row, .member-row) {
    min-height: var(--teacher-table-row-height) !important;
}

.teacher-shell table :where(tr, td, th),
.modal-backdrop table :where(tr, td, th) {
    height: var(--teacher-table-row-height);
    font-size: var(--teacher-body-size) !important;
    line-height: var(--teacher-leading);
}

/* Titles keep a clear hierarchy above the 16px body baseline. */
.teacher-shell :where(.page-actions h2, .course-portal-head h2, .course-workspace-heading h2),
.modal-head h2,
.teacher-login h1 {
    font-size: clamp(24px, 2vw, 28px) !important;
    line-height: 1.4;
}

.teacher-shell :where(.card-heading h2, .teacher-card h3, .course-builder-head strong),
.modal-backdrop :where(h3, legend) {
    font-size: 18px !important;
    line-height: 1.5;
}

/* Give enlarged text room instead of shrinking it or forcing horizontal scroll. */
.teacher-content {
    width: min(1440px, calc(100% - 48px));
}

.modal:not(.question-import-modal) {
    width: min(760px, calc(100vw - 40px));
}

.modal-head {
    padding: 24px 28px 20px;
}

.modal-head button {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
}

.modal-form,
.question-knowledge-manager {
    padding: 24px 28px 28px;
    gap: 18px;
}

.modal-form :where(input, select) {
    padding: 0 14px;
}

.modal-form textarea {
    min-height: 112px;
    padding: 12px 14px;
}

.modal-actions {
    gap: 12px;
    padding-top: 10px;
}

.modal-actions button {
    min-width: 96px;
    padding: 8px 20px;
}

.teacher-nav button {
    height: auto;
    min-height: 48px;
}

.filter-bar,
.resource-toolbar {
    min-height: 64px;
    flex-wrap: wrap;
}

.class-card,
.resource-card,
.assignment-item,
.content-cms-card,
.teacher-course-item {
    min-width: 0;
}

.class-card p,
.resource-card p,
.content-cms-card p {
    height: auto;
    min-height: 0;
    overflow: visible;
}

.assignment-item,
.table-row,
.question-table-row,
.question-folder-row {
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .teacher-content {
        width: calc(100% - 32px);
    }

    .course-portal-grid,
    .class-grid,
    .resource-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .teacher-content {
        width: calc(100% - 24px);
    }

    .course-portal-grid,
    .class-grid,
    .resource-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .modal:not(.question-import-modal) {
        width: calc(100vw - 20px);
    }

    .modal-head,
    .modal-form,
    .question-knowledge-manager {
        padding-right: 20px;
        padding-left: 20px;
    }
}
