body{background:#f4f6fa;color:#1f2937}.card{border:0;box-shadow:0 2px 12px rgba(15,23,42,.06);border-radius:14px}.stat{font-size:1.8rem;font-weight:700}.table thead th{white-space:nowrap}.form-label{font-weight:600}.sidebar-link{display:block;padding:.65rem .8rem;border-radius:8px;color:#334155;text-decoration:none}.sidebar-link:hover{background:#e8efff}.page-title{font-weight:750}.muted{color:#64748b}.login-wrap{max-width:440px;margin:7vh auto}.required:after{content:" *";color:#dc3545}
/* Local WYSIWYG editor for question manuscripts */
.rich-editor{border:1px solid #ced4da;border-radius:.5rem;overflow:hidden;background:#fff}
.rich-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;padding:.45rem;background:#f5f7fa;border-bottom:1px solid #dee2e6}
.rich-toolbar button{border:1px solid #d5dbe2;background:#fff;border-radius:.3rem;padding:.25rem .5rem;min-width:30px;font-size:.875rem;color:#263445}
.rich-toolbar button:hover{background:#e8eef7}
.rich-toolbar select{width:auto;max-width:145px}
.toolbar-sep{height:24px;border-left:1px solid #cbd2da;margin:0 .2rem}
.rich-canvas{min-height:190px;padding:.75rem;outline:none;line-height:1.6;overflow-wrap:anywhere}
.rich-canvas:focus{box-shadow:inset 0 0 0 2px rgba(13,110,253,.12)}
.rich-canvas-sm{min-height:110px}
.rich-canvas p{margin-bottom:.6rem}.rich-canvas table{border-collapse:collapse;width:100%;margin:.5rem 0}.rich-canvas td,.rich-canvas th{border:1px solid #adb5bd;padding:.35rem}
.rich-canvas ul,.rich-canvas ol{padding-left:1.5rem}

/* DataTables polish */
.dataTables_wrapper .dataTables_filter input,.dataTables_wrapper .dataTables_length select{border:1px solid #ced4da;border-radius:.45rem;padding:.35rem .55rem;margin:.2rem}.dataTables_wrapper .dataTables_filter,.dataTables_wrapper .dataTables_length{margin-bottom:.75rem}.dataTables_wrapper .dataTables_info{color:#64748b;font-size:.85rem}.dataTables_wrapper .dataTables_paginate{padding-top:.4rem}.dataTables_wrapper table.dataTable{width:100%!important}.dataTables_wrapper .dataTables_paginate .paginate_button{padding:.25rem .5rem}

/* MathJax rendering in question editor, preview and exam room */
.math-preview{border:1px dashed #cbd5e1;border-radius:.5rem;background:#f8fafc;padding:.75rem;min-height:2.5rem;overflow-x:auto}
.math-preview:empty{display:none}
.question mjx-container,.option mjx-container,.math-preview mjx-container{max-width:100%;overflow-x:auto;overflow-y:hidden}
.rich-canvas mjx-container{max-width:100%;overflow-x:auto}

/* Bank soal: preview rumus per pilihan jawaban */
.option-item .option-math-preview {
  min-height: 0;
  border: 1px solid #e2e8f0;
  color: #334155;
  font-size: 1rem;
  overflow-x: auto;
  background: #f8fafc !important;
}
.option-item .option-math-preview:empty { display: none !important; }
.option-item .option-math-preview mjx-container { margin: .15rem 0 !important; }

/* Visual LaTeX editor */
.math-editor-dialog { width:min(720px, calc(100vw - 24px)); max-width:none; border:0; border-radius:14px; padding:0; box-shadow:0 18px 60px rgba(0,0,0,.25); }
.math-editor-dialog::backdrop { background:rgba(15,23,42,.55); }
.math-editor-shell { padding:22px; }
.math-editor-tabs { display:flex; gap:8px; }
.math-editor-preview { min-height:34px; font-size:1.25rem; overflow-x:auto; }
.math-editor-preview mjx-container { margin:.2rem 0 !important; }
.option-row .insert-option-math { min-width:52px; font-weight:600; }
.option-math-preview { min-height:28px; border:1px solid #e2e8f0; color:#334155; font-size:1rem; overflow-x:auto; background:#f8fafc !important; }
.option-math-preview:empty { display:none !important; }
.option-math-preview mjx-container { margin:.15rem 0 !important; }
.rich-toolbar [data-insert-math] { font-weight:700; color:#0d6efd; }

.option-math-preview { display:flex; align-items:center; flex-wrap:wrap; gap:3px; min-height:32px; }
.option-math-field { display:inline-block; width:auto; min-width:1.2em; max-width:100%; border:0 !important; background:transparent !important; padding:0 2px !important; margin:0 !important; box-shadow:none !important; pointer-events:none; font-size:1.15rem; vertical-align:middle; }
.option-math-field::part(virtual-keyboard-toggle), .option-math-field::part(menu-toggle) { display:none; }

/* Preview matematika pilihan: terpisah dari input teks yang dapat diedit. */
.option-math-preview { display:block; min-height:32px; padding:8px 12px !important; line-height:1.8; overflow-x:auto; white-space:normal; }
.option-math-preview:empty { display:none !important; }
.option-math-preview mjx-container { display:inline-block !important; margin:0 .12em !important; }
.option-math-field { display:inline-block; width:auto; border:0 !important; background:transparent !important; pointer-events:none; }

/* WYSIWYG untuk setiap opsi jawaban */
.option-editor-wrap { min-width:0; }
.option-toolbar { display:flex; flex-wrap:wrap; gap:4px; padding:5px 7px; border:1px solid #ced4da; border-bottom:0; border-radius:7px 7px 0 0; background:#f8fafc; }
.option-toolbar button { border:1px solid #d7dee8; background:#fff; border-radius:4px; min-width:30px; padding:3px 8px; color:#334155; }
.option-toolbar button:hover { background:#eaf2ff; border-color:#86b7fe; }
.option-toolbar .option-insert-math { color:#0d6efd; font-weight:600; }
.option-wysiwyg { min-height:58px; max-height:220px; overflow:auto; border:1px solid #ced4da; border-radius:0 0 7px 7px; background:#fff; padding:9px 11px; outline:none; }
.option-wysiwyg:focus { border-color:#86b7fe; box-shadow:0 0 0 .2rem rgba(13,110,253,.15); }
.option-wysiwyg:empty:before { content:"Ketik pilihan jawaban di sini..."; color:#94a3b8; pointer-events:none; }
.option-wysiwyg mjx-container { margin:.1em 0 !important; }


/* Konsistensi format naskah dan gambar pada preview, ruang ujian, serta hasil */
.student-question-preview, .student-preview-question, .question, .question-content,
.question .mb-4, .answer-options, .option-editor-wrap { overflow-wrap:anywhere; }
.student-question-preview p, .student-preview-question p, .question p, .question-content p { margin:0 0 .8rem; line-height:1.7; }
.student-question-preview p:last-child, .student-preview-question p:last-child, .question p:last-child, .question-content p:last-child { margin-bottom:0; }
.question-inline-image { display:block; max-width:100%; height:auto; max-height:420px; object-fit:contain; margin:.65rem auto; border-radius:.45rem; }
.student-question-preview img, .question img, .question-content img, .option img, .answer-options img { max-width:100%; height:auto; }
.option img, .answer-options img { display:block; max-height:260px; object-fit:contain; margin:.45rem 0; }
.student-question-preview table, .question table, .question-content table { width:100%; border-collapse:collapse; margin:.75rem 0; }
.student-question-preview td, .student-question-preview th, .question td, .question th, .question-content td, .question-content th { border:1px solid #adb5bd; padding:.4rem; }
.question-image-upload { border:1px dashed #9aa9ba; }
.option-image-upload { display:block; color:#526174; }
.option-image-preview img { max-width:100%; object-fit:contain; }

.answer-options .option { display:flex; align-items:flex-start; gap:.55rem; padding:.8rem .9rem; border:1px solid #dbe2ea; border-radius:.65rem; background:#fff; cursor:default; line-height:1.6; }
.answer-options .option-content { min-width:0; flex:1; }
.answer-options .option-content p:last-child { margin-bottom:0; }
.student-question-preview .answer-options { display:grid; gap:.5rem; }
