/* ============================================================
   Dark mode for 내페이지 pages
   Scoped to html.cd-mypage-dark
   Targets: mypage.php, myclasspage.php, myexampage.php,
            myexamview.php, incorrect.php, incorrect_all.php
   ============================================================ */

html.cd-mypage-dark,
html.cd-mypage-dark body {
  background: #0a0a0b !important;
  color: #ededee !important;
}

/* Header backgrounds match home page */
html.cd-mypage-dark .top-line { background: #1c1c20 !important; }
html.cd-mypage-dark .main-nav { background: #0a0a0b !important; }
html.cd-mypage-dark #tnb { background: transparent !important; border-bottom: none !important; }
html.cd-mypage-dark #tnb ul { background: transparent !important; width: 100% !important; }
html.cd-mypage-dark #tnb ul li[style*="3d3d3d"] { background: #1f1f24 !important; }

/* Page wrapper (the .py-5 div with inline background:#f2f2f2) */
html.cd-mypage-dark .py-5[style*="background:#f2f2f2"],
html.cd-mypage-dark .py-5[style*="background: #f2f2f2"] {
  background: #0a0a0b !important;
}

/* Generic text colors inside main */
html.cd-mypage-dark .mp-main {
  color: #ededee;
}

/* Page section title like "| 수업내역" / "| 시험내역" */
html.cd-mypage-dark .mp-main > div[style*="margin-bottom:10px"] {
  color: #ededee;
}

/* Loading panel */
html.cd-mypage-dark #loading {
  color: #ededee !important;
}
html.cd-mypage-dark #loading div {
  color: #b6b6b9 !important;
}

/* ---------- Sidebar (frame brighter so it pops from page bg) ---------- */
html.cd-mypage-dark .mp-side-inner,
html.cd-mypage-dark #mypage .mp-sidebar > div {
  background: #3a3a42 !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px;
  height: auto !important;
  min-height: 170px;
  overflow: hidden;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 12px 28px -16px rgba(0,0,0,0.6);
}
html.cd-mypage-dark .mp-side-inner > div[style*="background:#242424"],
html.cd-mypage-dark #mypage .mp-sidebar > div > div[style*="background:#242424"] {
  background: #1f1f24 !important;
}

/* ---------- Tables ---------- */
html.cd-mypage-dark .tbl_frm01,
html.cd-mypage-dark .tbl_wrap {
  background: transparent !important;
}
html.cd-mypage-dark .tbl_frm01 table,
html.cd-mypage-dark .tbl_wrap table,
html.cd-mypage-dark .mp-class-table-view table {
  background: #131317 !important;
  color: #ededee !important;
  border-radius: 10px;
  overflow: hidden;
}
html.cd-mypage-dark .tbl_frm01 thead tr,
html.cd-mypage-dark .tbl_wrap thead tr,
html.cd-mypage-dark .mp-class-table-view thead tr {
  background: #1c1c20 !important;
}
html.cd-mypage-dark .tbl_frm01 thead th,
html.cd-mypage-dark .tbl_wrap thead th,
html.cd-mypage-dark .mp-class-table-view thead th {
  background: #1c1c20 !important;
  color: #ededee !important;
  border-color: rgba(255,255,255,0.08) !important;
  font-weight: 600;
}
html.cd-mypage-dark .tbl_frm01 tbody tr,
html.cd-mypage-dark .tbl_wrap tbody tr,
html.cd-mypage-dark .mp-class-table-view tbody tr {
  background: #131317 !important;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
html.cd-mypage-dark .tbl_frm01 tbody tr:hover,
html.cd-mypage-dark .tbl_wrap tbody tr:hover,
html.cd-mypage-dark .mp-class-table-view tbody tr:hover {
  background: #1a1a1f !important;
}
html.cd-mypage-dark .tbl_frm01 tbody td,
html.cd-mypage-dark .tbl_wrap tbody td,
html.cd-mypage-dark .mp-class-table-view tbody td,
html.cd-mypage-dark .td_subject,
html.cd-mypage-dark .td_num,
html.cd-mypage-dark .td_datetime {
  background: transparent !important;
  color: #ededee !important;
  border-color: rgba(255,255,255,0.06) !important;
}
html.cd-mypage-dark .bo_notice {
  background: #131317 !important;
}

/* ---------- Mobile cards ---------- */
html.cd-mypage-dark .mp-class-card {
  background: #131317 !important;
  color: #ededee !important;
  border: 1px solid rgba(255,255,255,0.06);
}
html.cd-mypage-dark .mp-class-title {
  color: #ededee !important;
}
html.cd-mypage-dark .mp-class-line {
  color: #b6b6b9 !important;
}
html.cd-mypage-dark .mp-class-empty {
  color: #b6b6b9 !important;
  background: #131317 !important;
  border: 1px dashed rgba(255,255,255,0.1);
}

/* ---------- Login / register card (mypage.php logged-out) ---------- */
html.cd-mypage-dark #login,
html.cd-mypage-dark #register {
  color: #ededee;
}
html.cd-mypage-dark .auth-tab {
  color: #9b9ba0 !important;
}
html.cd-mypage-dark .auth-tab-active {
  color: #ff8c70 !important;
}
html.cd-mypage-dark #login + #register,
html.cd-mypage-dark .py-5 > .container > div[style*="display:flex"][style*="justify-content:center"] > div[style*="background:#fff"] {
  background: #131317 !important;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 12px 28px -16px rgba(0,0,0,0.6) !important;
}
html.cd-mypage-dark #login label,
html.cd-mypage-dark #register label {
  color: #b6b6b9 !important;
}
html.cd-mypage-dark #login input[type="text"],
html.cd-mypage-dark #login input[type="password"],
html.cd-mypage-dark #register input[type="text"],
html.cd-mypage-dark #register input[type="password"] {
  background: #1c1c20 !important;
  color: #ededee !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
}
html.cd-mypage-dark #login input::placeholder,
html.cd-mypage-dark #register input::placeholder {
  color: #75757a;
}
html.cd-mypage-dark #login button,
html.cd-mypage-dark #register button {
  background: #ff6b50 !important;
  color: #fff !important;
}

/* ---------- 오답노트 button (top-right pill) ---------- */
html.cd-mypage-dark #wronganswer a {
  background: #3ebfff !important;
  color: #fff !important;
}

/* ---------- 수업 요약 banner (myclasspage) ---------- */
html.cd-mypage-dark .myclass-summary {
  background: #1c1c20 !important;
  border: 1px solid rgba(255,255,255,0.06);
}
html.cd-mypage-dark .myclass-summary-label {
  color: #9b9ba0 !important;
}

/* ---------- Accordion (수업자료) ---------- */
html.cd-mypage-dark .material-accordion-toggle {
  background: transparent !important;
  color: #ededee !important;
}
html.cd-mypage-dark .material-accordion-item .bookhead {
  background: #1c1c20 !important;
  color: #ededee !important;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 10px 14px;
}
html.cd-mypage-dark .material-accordion-body {
  background: #131317 !important;
  color: #ededee !important;
  border: 1px solid rgba(255,255,255,0.06);
  border-top: none;
  border-radius: 0 0 8px 8px;
}
html.cd-mypage-dark .material-accordion-body th,
html.cd-mypage-dark .material-accordion-body td,
html.cd-mypage-dark .booktitle2 {
  color: #ededee !important;
}

/* ---------- Calendar (myclasspage) ---------- */
html.cd-mypage-dark .calendar table {
  border-top-color: rgba(255,255,255,0.1) !important;
  background: #131317;
}
html.cd-mypage-dark .calendar thead th {
  background: #1c1c20 !important;
  color: #ededee !important;
  border-color: rgba(255,255,255,0.08) !important;
}
html.cd-mypage-dark .calendar td {
  color: #ededee !important;
  border-top-color: rgba(255,255,255,0.06) !important;
}
html.cd-mypage-dark .calendar tbody td:hover {
  background: #1a1a1f !important;
  border-color: rgba(255,255,255,0.18) !important;
}
html.cd-mypage-dark .calendar tbody th {
  border-bottom-color: rgba(255,255,255,0.06) !important;
  color: #ededee !important;
}
html.cd-mypage-dark .cal-nav-btn {
  color: #ededee !important;
}

/* ---------- Misc: white-bg utility containers inside main get darkened ---------- */
html.cd-mypage-dark .mp-main div[style*="background:#fff"]:not(#examview):not(#examresultview):not(#incorrtectview):not([id^="kk_"]) {
  background: #131317 !important;
  color: #ededee !important;
}
html.cd-mypage-dark .mp-main div[style*="background:#fafafa"] {
  background: #1c1c20 !important;
  color: #ededee !important;
}
html.cd-mypage-dark .mp-main div[style*="background:#f6f6f6"] {
  background: #1c1c20 !important;
}

/* Headings / labels with generic dark text colors should switch to light */
html.cd-mypage-dark .mp-main [style*="color:#333"],
html.cd-mypage-dark .mp-main [style*="color:#555"],
html.cd-mypage-dark .mp-main [style*="color:#666"] {
  color: #b6b6b9 !important;
}
html.cd-mypage-dark .mp-main [style*="color:#000"] {
  color: #ededee !important;
}

/* Pagination etc. */
html.cd-mypage-dark .pg_page,
html.cd-mypage-dark .pg_current {
  background: #1c1c20 !important;
  color: #ededee !important;
  border-color: rgba(255,255,255,0.08) !important;
}
html.cd-mypage-dark .pg_current {
  background: #ff6b50 !important;
}

/* Footer/copyright area should remain dark already; don't override */

/* Make sure the exam fullscreen overlays keep their own dark frame; do NOT
   re-paint inner question content (which holds problem images on white). */
html.cd-mypage-dark #examview,
html.cd-mypage-dark #examresultview,
html.cd-mypage-dark #incorrtectview {
  /* leave problem rendering area white for legibility of images/SVG */
}