/**
 * Examination Question Module - Dark Mode Styles
 * otocin 레이아웃 다크모드 호환
 * .dark 클래스가 html/body에 적용될 때 활성화
 */

/* ========================================
   기본 색상 변수 (otocin 레이아웃 호환)
   ======================================== */
:root {
    --dark-bg-primary: #0f172a;
    --dark-bg-secondary: #1e293b;
    --dark-bg-tertiary: #334155;
    --dark-text-primary: #f1f5f9;
    --dark-text-secondary: #e2e8f0;
    --dark-text-muted: #94a3b8;
    --dark-border: #334155;
    --dark-border-light: #475569;
    --dark-accent: #3b82f6;
    --dark-accent-hover: #2563eb;
    --dark-success: #10b981;
    --dark-danger: #ef4444;
    --dark-warning: #f59e0b;
}

/* ========================================
   _header.css 다크모드
   ======================================== */
.dark div.exam-header {
    color: var(--dark-text-primary);
}

.dark a.insert-category-bt {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark a.insert-category-bt:hover {
    background: var(--dark-danger);
}

.dark div.share-sns-bt-header {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark div.share-sns-bt-header:hover {
    background: var(--dark-danger);
}

.dark div.shuffle-example-bt-header {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark div.shuffle-example-bt-header:hover {
    background: var(--dark-danger);
}

.dark div.search-bt-header {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark div.search-bt-header:hover {
    background: var(--dark-danger);
}

/* ========================================
   list.css 다크모드
   ======================================== */
.dark div.exam {
    color: var(--dark-text-primary);
}

.dark div.category_list {
    background: var(--dark-bg-tertiary);
}

.dark div.category_list a {
    color: var(--dark-text-secondary);
}

.dark div.sub_category_list {
    background: var(--dark-bg-secondary);
}

.dark div.sub_category_list a {
    color: var(--dark-text-secondary);
}

.dark div.no-exam-list {
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark div.search-header select,
.dark div.search-header input,
.dark div.search-header button {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

/* ========================================
   view_exam.css 다크모드
   ======================================== */
.dark div.exam_body {
    border-color: var(--dark-border);
}

.dark div.exam_list_header {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark div.exam_list_left {
    border-color: var(--dark-border);
}

.dark div.exam_no_select {
    border-color: var(--dark-text-muted);
    color: var(--dark-text-primary);
}

.dark .selected_answer {
    background: var(--dark-accent) !important;
}

.dark div.omr {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
}

.dark table.omr {
    border-color: var(--dark-warning);
}

.dark span.exam_no_select {
    border-color: var(--dark-warning);
    color: var(--dark-warning);
}

.dark th.omr-number,
.dark td.omr-number {
    color: var(--dark-warning);
    border-color: var(--dark-warning);
}

.dark a.exam_title {
    color: var(--dark-text-primary);
}

.dark div.exam_item {
    border-color: var(--dark-border);
}

.dark div.view_func_area a {
    color: var(--dark-text-primary);
}

.dark .btn_blue {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark .btn_blue:hover {
    background: var(--dark-danger);
}

.dark input#exam_answer_select {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark a.answer_select {
    color: var(--dark-text-primary);
}

.dark a.answer_select:hover {
    background: var(--dark-bg-tertiary);
}

.dark div.explanation {
    border-color: var(--dark-border);
    background: var(--dark-bg-secondary);
}

.dark h2.explanation {
    color: #ff6b9d;
}

.dark div.big_text {
    border-color: var(--dark-border);
    background: var(--dark-bg-secondary);
}

.dark div.timer-start {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark div.timer-disp {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-accent);
    color: #ff6b6b;
}

.dark div.tags {
    color: var(--dark-text-muted);
}

/* ========================================
   view_exam_list.css 다크모드
   ======================================== */
.dark div.header-text {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark tbody.omr-item {
    border-color: var(--dark-border);
}

.dark div.copy_exam {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
    box-shadow: 2px 3px 7px 0px rgba(0, 0, 0, 0.5);
}

/* ========================================
   view_ckfa_list.css 다크모드
   ======================================== */
.dark div.correct_answer {
    background: var(--dark-accent);
}

.dark li.correct_answer {
    background: rgba(59, 130, 246, 0.3);
}

/* ========================================
   write.css 다크모드
   ======================================== */
.dark select#parent_srl,
.dark select#category_srl,
.dark select#sub_category,
.dark select#question_type,
.dark select#correct {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark textarea#question,
.dark textarea#item,
.dark textarea#header_text,
.dark textarea#explanation,
.dark textarea#content {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark div.obj-item,
.dark div.cho-item,
.dark div.score,
.dark div.category {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark input#obj-correct,
.dark input#score,
.dark input#exam_file {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark span.write_bt {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark span.write_bt:hover {
    background: var(--dark-accent-hover);
}

.dark div.correct-item {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark img.item-image {
    border-color: var(--dark-border);
}

.dark div.text-title {
    color: var(--dark-text-primary);
}

/* ========================================
   write_text.css 다크모드
   ======================================== */
.dark div.exam_srl {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark div.exam_srl label {
    color: var(--dark-text-secondary);
}

/* ========================================
   comment.css 다크모드
   ======================================== */
.dark div.comment {
    color: var(--dark-text-primary);
}

.dark li.cmItem {
    border-color: var(--dark-border);
}

.dark div.comment_content {
    color: var(--dark-text-secondary);
}

.dark div.comment_time {
    color: var(--dark-text-muted);
}

.dark div.comment_author a {
    color: var(--dark-text-primary);
}

.dark div.pagination a {
    color: var(--dark-text-secondary);
}

.dark div.comment_list {
    border-color: var(--dark-border);
}

.dark div.do_action a {
    color: var(--dark-text-secondary);
}

.dark textarea#text_editor {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark button.btn_insert {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark button.btn_insert:hover {
    background: var(--dark-danger);
}

.dark div.editor.re_comment,
.dark div.re_comment {
    border-color: var(--dark-border);
}

.dark li.cmt_re {
    background: var(--dark-bg-tertiary);
}

.dark a.switch-editor-bt {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-secondary);
    border-color: var(--dark-border);
}

.dark div.parent_nick {
    color: #38bdf8;
}

/* ========================================
   comment_write.css 다크모드
   ======================================== */
.dark div.editor {
    background: var(--dark-bg-secondary);
}

/* ========================================
   search.css 다크모드
   ======================================== */
.dark div.result {
    border-color: var(--dark-border);
    color: var(--dark-text-secondary);
}

.dark div.questions i.xi-paper,
.dark div.tags i.xi-tags {
    color: var(--dark-text-muted);
}

.dark div.question-header,
.dark div.tags-header {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark div.question-body,
.dark div.tags-body {
    border-color: var(--dark-border);
}

.dark div.question-question a,
.dark div.tags-question a {
    color: var(--dark-accent);
}

.dark div.more a {
    color: var(--dark-warning);
}

.dark div.pagination a {
    color: var(--dark-text-secondary);
    background-color: var(--dark-bg-tertiary);
}

/* ========================================
   check_favo_list.css / log_list.css 다크모드
   ======================================== */
.dark .log_list_content th {
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

.dark .log_list_content td {
    border-color: var(--dark-border);
}

.dark td.no,
.dark td.date,
.dark td.correct_rate,
.dark td.score,
.dark td.category_name {
    color: var(--dark-text-secondary);
}

.dark td a {
    color: var(--dark-text-secondary);
}

.dark th a {
    color: var(--dark-accent);
}

.dark .log_list_content table {
    border-color: var(--dark-border);
}

.dark td.category_name select {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

/* ========================================
   view_check_favo_log.css / view_exam_log.css 다크모드
   ======================================== */
.dark div.exam_result {
    color: #ff6b6b;
}

.dark div.explanation {
    border-color: var(--dark-accent);
    background: var(--dark-bg-secondary);
}

.dark button.exam_footer {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark button.exam_footer:hover {
    background: var(--dark-danger);
}

.dark div.header-title {
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark div.hide_oo {
    background: var(--dark-accent);
    color: var(--dark-text-primary);
}

.dark div.hide_oo:hover {
    background: var(--dark-danger);
}

/* ========================================
   공통 요소 다크모드
   ======================================== */
.dark button {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark button:hover {
    background: var(--dark-bg-secondary);
}

.dark input[type="text"],
.dark input[type="number"],
.dark input[type="search"],
.dark select,
.dark textarea {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
    border-color: var(--dark-border);
}

.dark input[type="text"]:focus,
.dark input[type="number"]:focus,
.dark input[type="search"]:focus,
.dark select:focus,
.dark textarea:focus {
    border-color: var(--dark-accent);
    outline: none;
}

/* 테이블 다크모드 */
.dark table {
    color: var(--dark-text-primary);
}

.dark th {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

.dark td {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-secondary);
}

.dark tr:hover td {
    background: var(--dark-bg-tertiary);
}

/* 스크롤바 다크모드 */
.dark ::-webkit-scrollbar-thumb {
    background: var(--dark-border-light);
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: var(--dark-text-muted);
}

.dark ::-webkit-scrollbar-track {
    background: var(--dark-bg-secondary);
}

/* 선택 영역 다크모드 */
.dark ::selection {
    background: rgba(59, 130, 246, 0.4);
    color: var(--dark-text-primary);
}

/* ========================================
   모바일 반응형 다크모드
   ======================================== */
@media screen and (max-width: 768px) {
    .dark div.comment_content {
        color: var(--dark-text-secondary);
    }
}

/* ========================================
   인쇄 시 다크모드 비활성화
   ======================================== */
@media print {
    .dark * {
        background: #fff !important;
        color: #000 !important;
        border-color: #000 !important;
    }
}