/* Tcafe21 Dark Mode CSS - Dark Reader 스타일 v5 */
/* 다크모드 활성화시 body.dark-mode 클래스 적용 */

/* ========== 기본 배경/텍스트 ========== */
body.dark-mode,
body.dark-mode #thema_wrapper {
    background-color: #181a1b !important;
    color: #e8e6e3 !important;
}

/* ========== 사이드바 전체 ========== */
body.dark-mode .main-sidebar,
body.dark-mode .left-side,
body.dark-mode aside.main-sidebar,
body.dark-mode .sidebar,
body.dark-mode section.sidebar {
    background-color: #1e2021 !important;
}

/* 사이드바 회원정보 패널 */
body.dark-mode .user-panel,
body.dark-mode .user-panel *,
body.dark-mode .sidebar-misc,
body.dark-mode .sidebar-misc * {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .user-panel .info,
body.dark-mode .user-panel .info a,
body.dark-mode .user-panel p,
body.dark-mode .sidebar-list,
body.dark-mode .sidebar-list li,
body.dark-mode .sidebar-list a,
body.dark-mode .sidebar-text {
    color: #e8e6e3 !important;
}

/* 사이드바 메뉴 */
body.dark-mode .sidebar-menu,
body.dark-mode .sidebar-menu li,
body.dark-mode .sidebar-menu li a,
body.dark-mode .sidebar-menu > li > a {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .sidebar-menu > li:hover > a,
body.dark-mode .sidebar-menu > li.active > a,
body.dark-mode .sidebar-menu li a:hover {
    background-color: #2c2f31 !important;
    color: #ffffff !important;
}
body.dark-mode .sidebar-menu .treeview-menu {
    background-color: #232526 !important;
}
body.dark-mode .sidebar-menu .treeview-menu > li > a {
    color: #c8c6c3 !important;
}
body.dark-mode .sidebar-menu .treeview-menu > li > a:hover {
    color: #ffffff !important;
    background-color: #2c2f31 !important;
}
body.dark-mode .sidebar-menu .header,
body.dark-mode .sidebar-header {
    color: #ffd700 !important;
    background-color: #1e2021 !important;
}

/* 사이드바 폼 요소 */
body.dark-mode .sidebar-form,
body.dark-mode .sidebar-form input,
body.dark-mode .sidebar-input {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}

/* ========== 컨텐츠 영역 ========== */
body.dark-mode .content-wrapper,
body.dark-mode .right-side,
body.dark-mode .content,
body.dark-mode .at-content,
body.dark-mode #at-wrap,
body.dark-mode #at-main {
    background-color: #181a1b !important;
}

/* ========== 메인페이지 위젯 박스 ========== */
body.dark-mode .main-box,
body.dark-mode .at-content .main-box {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .main-tab,
body.dark-mode .at-content .main-tab,
body.dark-mode .bg-light {
    background-color: #232526 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .tab-content,
body.dark-mode .at-content .tab-content {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .nav-tabs {
    border-color: #3c4043 !important;
}
body.dark-mode .nav-tabs > li > a {
    color: #c8c6c3 !important;
    background-color: #232526 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .nav-tabs > li.active > a,
body.dark-mode .nav-tabs > li > a:hover {
    color: #ffffff !important;
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .div-tab,
body.dark-mode .tabs {
    background-color: #1e2021 !important;
}

/* ========== 오늘의 베스트 / 주간 베스트 ========== */
body.dark-mode .board-hot-posts {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .board-hot-posts * {
    color: #e8e6e3 !important;
}
body.dark-mode .board-hot-post-box {
    background-color: #1e2021 !important;
}
body.dark-mode .board-hot-title {
    color: #e8e6e3 !important;
    border-bottom-color: #3c4043 !important;
}
body.dark-mode .board-hot-posts a {
    color: #e8e6e3 !important;
}
body.dark-mode .board-hot-posts a:hover {
    color: #ffffff !important;
}

/* ========== 박스/카드/위젯 ========== */
body.dark-mode .box,
body.dark-mode .box-widget,
body.dark-mode .at-widget,
body.dark-mode .panel,
body.dark-mode .well,
body.dark-mode .card {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .box-header,
body.dark-mode .panel-heading {
    background-color: #232526 !important;
    color: #e8e6e3 !important;
    border-bottom-color: #3c4043 !important;
}
body.dark-mode .box-body,
body.dark-mode .panel-body {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .box-footer,
body.dark-mode .panel-footer {
    background-color: #232526 !important;
    border-top-color: #3c4043 !important;
}

/* ========== 테이블 헤더 (진한 검정) ========== */
body.dark-mode table,
body.dark-mode .table,
body.dark-mode .tbl_head01,
body.dark-mode .tbl_wrap {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode table thead,
body.dark-mode table thead tr,
body.dark-mode table thead th,
body.dark-mode table th,
body.dark-mode .table th,
body.dark-mode .tbl_head01 thead,
body.dark-mode .tbl_head01 th {
    background-color: #0d0d0d !important;
    color: #e8e6e3 !important;
    border-color: #2a2a2a !important;
}
body.dark-mode table td,
body.dark-mode .table td,
body.dark-mode tbody td {
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
    background-color: #1e2021 !important;
}
body.dark-mode table tr:hover td,
body.dark-mode .table-hover tbody tr:hover td {
    background-color: #2c2f31 !important;
}
body.dark-mode table a,
body.dark-mode tbody a {
    color: #e8e6e3 !important;
}
body.dark-mode table a:hover {
    color: #ffffff !important;
}

/* ========== 게시판 카테고리 탭 ========== */
body.dark-mode .bo_cate,
body.dark-mode .bo_cate_ul,
body.dark-mode .cate_wrap {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .bo_cate_ul li a {
    color: #c8c6c3 !important;
    background-color: #1e2021 !important;
}
body.dark-mode .bo_cate_ul li.active a,
body.dark-mode .bo_cate_ul li a:hover {
    color: #ffffff !important;
    background-color: #2c2f31 !important;
}

/* ========== 링크 ========== */
body.dark-mode a {
    color: #8ab4f8 !important;
}
body.dark-mode a:hover {
    color: #aecbfa !important;
}
body.dark-mode .td_subject a,
body.dark-mode .bo_tit a,
body.dark-mode .list-group-item a {
    color: #e8e6e3 !important;
}
body.dark-mode .td_subject a:hover {
    color: #ffffff !important;
}

/* ========== 폼 요소 ========== */
body.dark-mode input[type="text"],
body.dark-mode input[type="password"],
body.dark-mode input[type="email"],
body.dark-mode input[type="search"],
body.dark-mode textarea,
body.dark-mode select,
body.dark-mode .form-control {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode input::placeholder {
    color: #888888 !important;
}

/* ========== 버튼 ========== */
body.dark-mode .btn-default {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}

/* ========== 드롭다운 ========== */
body.dark-mode .dropdown-menu {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .dropdown-menu > li > a {
    color: #e8e6e3 !important;
}
body.dark-mode .dropdown-menu > li > a:hover {
    background-color: #2c2f31 !important;
}

/* ========== 페이지네이션 ========== */
body.dark-mode .pagination > li > a,
body.dark-mode .pagination > li > span,
body.dark-mode .pg_wrap,
body.dark-mode .pg a,
body.dark-mode .pg span {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .pagination > li.active > a,
body.dark-mode .pg_current {
    background-color: #3c4043 !important;
    color: #ffffff !important;
}

/* ========== 푸터 ========== */
body.dark-mode .main-footer,
body.dark-mode footer {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
    color: #a8a6a3 !important;
}

/* ========== 다크모드 토글 버튼 ========== */
.dark-mode-toggle {
    cursor: pointer;
}
body.dark-mode .dark-mode-toggle i {
    transform: rotate(180deg);
    color: #ffd700 !important;
}

/* ========== 리스트 그룹 ========== */
body.dark-mode .list-group,
body.dark-mode .list-group-item {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}

/* ========== Miso 위젯 전용 ========== */
body.dark-mode [class*="miso-"],
body.dark-mode .miso-post-list,
body.dark-mode .miso-gallery,
body.dark-mode .at-latest {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode [class*="miso-"] a,
body.dark-mode .at-latest a {
    color: #e8e6e3 !important;
}
body.dark-mode [class*="miso-"] a:hover {
    color: #ffffff !important;
}

/* ========== 텍스트 색상 강제 ========== */
body.dark-mode .text-muted {
    color: #a8a6a3 !important;
}
body.dark-mode .tab-more {
    color: #a8a6a3 !important;
}
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3,
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 {
    color: #e8e6e3 !important;
}

/* ========== 인라인 스타일 오버라이드 ========== */
body.dark-mode [style*="background:#fff"],
body.dark-mode [style*="background: #fff"],
body.dark-mode [style*="background:#ffffff"],
body.dark-mode [style*="background-color:#fff"],
body.dark-mode [style*="background:#f8f9fa"],
body.dark-mode [style*="background-color:#f8f9fa"] {
    background-color: #1e2021 !important;
}

/* ========== 기타 ========== */
body.dark-mode hr {
    border-color: #3c4043 !important;
}
body.dark-mode .empty_table {
    color: #888888 !important;
}
body.dark-mode .control-sidebar {
    background-color: #1e2021 !important;
}

/* ========== 스크롤바 ========== */
body.dark-mode ::-webkit-scrollbar {
    background-color: #1e2021;
}
body.dark-mode ::-webkit-scrollbar-thumb {
    background-color: #3c4043;
}


/* ========== 댓글 영역 ========== */
body.dark-mode #bo_vc,
body.dark-mode .comment-media {
    background-color: #181a1b !important;
    color: #e8e6e3 !important;
}

/* 댓글 제목 (Comments) */
body.dark-mode .view-comment {
    color: #e8e6e3 !important;
    border-bottom-color: #3c4043 !important;
}

/* 각 댓글 아이템 */
body.dark-mode .comment-media .media {
    background-color: #181a1b !important;
    border-color: #3c4043 !important;
}

/* 댓글 헤더 (작성자, 시간 등) */
body.dark-mode .comment-media .media-heading,
body.dark-mode .comment-media .media-heading * {
    color: #e8e6e3 !important;
}
body.dark-mode .comment-media .media-heading b {
    color: #ffffff !important;
}
body.dark-mode .comment-media .media-info {
    color: #a8a6a3 !important;
}

/* 일반 댓글 본문 - 어두운 배경 */
body.dark-mode .comment-media > .media .media-content,
body.dark-mode .comment-media .media .media-content {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
    border: 1px solid #3c4043 !important;
}

/* 대댓글 본문 - 진한 적색 배경 */
body.dark-mode .comment-media .media .media .media-content {
    background-color: #3d1a1a !important;
    color: #e8e6e3 !important;
    border: 1px solid #5a2a2a !important;
}

/* 대댓글 영역 전체 */
body.dark-mode .comment-media .media .media {
    background-color: #181a1b !important;
}

/* 댓글 작성자 사진 영역 */
body.dark-mode .comment-media .photo i {
    background-color: #2c2f31 !important;
    color: #a8a6a3 !important;
}

/* 댓글 버튼 (답변, 수정, 삭제 등) */
body.dark-mode .comment-media .media-btn a,
body.dark-mode .comment-media .btn-link {
    color: #8ab4f8 !important;
}
body.dark-mode .comment-media .media-btn a:hover {
    color: #aecbfa !important;
}

/* 댓글 추천/비추천 */
body.dark-mode .comment-media .cmt-good,
body.dark-mode .comment-media .cmt-nogood {
    color: #e8e6e3 !important;
}

/* 댓글 작성 폼 */
body.dark-mode #bo_vc_w,
body.dark-mode .bo_vc_w,
body.dark-mode .cmt-write {
    background-color: #1e2021 !important;
    border-color: #3c4043 !important;
}
body.dark-mode #bo_vc_w textarea,
body.dark-mode .cmt-write textarea {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}

/* 댓글 내 링크 */
body.dark-mode .comment-media a {
    color: #8ab4f8 !important;
}
body.dark-mode .comment-media .media-content a {
    color: #8ab4f8 !important;
}

/* BEST 댓글 라벨 */
body.dark-mode .comment-media .rank-icon {
    background-color: #ff4500 !important;
    color: #ffffff !important;
}


/* ========== 게시판 목록 헤더 (스킨 오버라이드) ========== */
body.dark-mode table.list-pc th,
body.dark-mode table.list-pc thead th,
body.dark-mode .list-pc th,
body.dark-mode .list-pc thead th {
    background: #0d0d0d !important;
    background-image: none !important;
    color: #e8e6e3 !important;
    border-color: #3c4043 !important;
}
body.dark-mode table.list-pc,
body.dark-mode .list-pc {
    background-color: #1e2021 !important;
}
body.dark-mode table.list-pc thead,
body.dark-mode .list-pc thead {
    background-color: #0d0d0d !important;
}
body.dark-mode table.list-pc th a,
body.dark-mode .list-pc th a {
    color: #e8e6e3 !important;
}

/* ========== 게시판 목록 글쓴이 ========== */
body.dark-mode .td_name,
body.dark-mode .td_name a,
body.dark-mode .td_name span,
body.dark-mode .sv_member,
body.dark-mode .sv_member a,
body.dark-mode table.list-pc .td_name,
body.dark-mode table.list-pc .td_name a,
body.dark-mode .list-pc .td_name a {
    color: #e8e6e3 !important;
}
body.dark-mode .td_name a:hover,
body.dark-mode .sv_member a:hover {
    color: #ffffff !important;
}

/* ========== 게시판 제목/헤더 영역 ========== */
body.dark-mode .board-list,
body.dark-mode section.board-list,
body.dark-mode .bo_fx,
body.dark-mode .bo_head,
body.dark-mode .view-board-list,
body.dark-mode .at-page-title,
body.dark-mode .page-title,
body.dark-mode .snb,
body.dark-mode .local-ov {
    background-color: #181a1b !important;
    color: #e8e6e3 !important;
}

/* 게시판 제목 텍스트 */
body.dark-mode .board-list h2,
body.dark-mode .board-list h3,
body.dark-mode .bo_fx h2,
body.dark-mode .view-board-list h2,
body.dark-mode .at-page-title h1,
body.dark-mode .at-page-title h2,
body.dark-mode .page-title h1 {
    color: #e8e6e3 !important;
}

/* 게시판 상단 전체 영역 */
body.dark-mode .bo_list,
body.dark-mode #bo_list,
body.dark-mode .list-wrap,
body.dark-mode .bo_vc,
body.dark-mode #bo_vc,
body.dark-mode .view-wrap {
    background-color: #181a1b !important;
}

/* ========== 추가 다크모드 영역 ========== */
body.dark-mode section,
body.dark-mode article,
body.dark-mode .section,
body.dark-mode .wrapper,
body.dark-mode .container,
body.dark-mode .row {
    background-color: transparent !important;
}

/* 모든 흰색 배경 강제 변환 */
body.dark-mode .bg-white,
body.dark-mode .white-bg,
body.dark-mode [class*="bg-white"] {
    background-color: #1e2021 !important;
}

/* APMS 관련 */
body.dark-mode .at-wrap,
body.dark-mode .at-row,
body.dark-mode .at-col,
body.dark-mode .at-box,
body.dark-mode .apms-box {
    background-color: #181a1b !important;
}

/* ========== 쪽지 페이지 ========== */
body.dark-mode .memo-send-form,
body.dark-mode .memo-list,
body.dark-mode .memo-view,
body.dark-mode #memo_form,
body.dark-mode .form-horizontal {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .memo-send-form label,
body.dark-mode .memo-send-form .control-label,
body.dark-mode .form-horizontal label {
    color: #e8e6e3 !important;
}
body.dark-mode .memo-send-form .alert,
body.dark-mode .alert-info {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .memo-send-form textarea,
body.dark-mode .memo-send-form input {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .btn-black {
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .btn-black.active,
body.dark-mode .btn-black:hover {
    background-color: #3c4043 !important;
    color: #ffffff !important;
}

/* ========== 게시판 제목 (아이콘 + 제목) ========== */
body.dark-mode .page-title,
body.dark-mode .page-title h2,
body.dark-mode .page-title h2 a,
body.dark-mode .page-title h2 span,
body.dark-mode .page-title i,
body.dark-mode .page-title .fa,
body.dark-mode .page-desc {
    color: #ffffff !important;
}
body.dark-mode .page-title h2 a:hover {
    color: #aecbfa !important;
}

/* ========== 게시글 작성 에디터 ========== */
body.dark-mode .write-wrap,
body.dark-mode .write_div,
body.dark-mode #bo_w,
body.dark-mode .form-write {
    background-color: #181a1b !important;
    color: #e8e6e3 !important;
}

/* 에디터 본문 영역 */
body.dark-mode .note-editable,
body.dark-mode .note-editor,
body.dark-mode .note-editor .note-editing-area,
body.dark-mode .note-editor .note-editable,
body.dark-mode #wr_content,
body.dark-mode textarea#wr_content,
body.dark-mode .summernote,
body.dark-mode .editor-content,
body.dark-mode .smarteditor,
body.dark-mode iframe.se2_inputArea {
    background-color: #2c2f31 !important;
    color: #e8e6e3 !important;
}

/* 에디터 툴바 */
body.dark-mode .note-toolbar,
body.dark-mode .note-btn,
body.dark-mode .note-editor .note-toolbar {
    background-color: #232526 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .note-btn {
    color: #e8e6e3 !important;
    background-color: #2c2f31 !important;
    border-color: #3c4043 !important;
}

/* 에디터 드롭다운 */
body.dark-mode .note-dropdown-menu,
body.dark-mode .note-dropdown-item {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}

/* 작성 폼 입력 필드 */
body.dark-mode #wr_subject,
body.dark-mode input#wr_subject,
body.dark-mode .write_div input,
body.dark-mode .write_div select,
body.dark-mode .write_div textarea {
    background-color: #2c2f31 !important;
    color: #e8e6e3 !important;
    border-color: #3c4043 !important;
}

/* 작성 폼 라벨 */
body.dark-mode .write_div label,
body.dark-mode .write_div th,
body.dark-mode .write_div td {
    color: #e8e6e3 !important;
    background-color: #1e2021 !important;
}

/* 첨부파일, 링크 영역 */
body.dark-mode .write_div .form-group,
body.dark-mode .bf-attach,
body.dark-mode .file-wrap {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}

/* ========== 에디터 본문 - 밝은 배경 (iframe 내부 적용 불가로 배경 밝게) ========== */
body.dark-mode .note-editable,
body.dark-mode .note-editor .note-editing-area,
body.dark-mode .note-editor .note-editable,
body.dark-mode .note-editing-area .note-editable,
body.dark-mode .summernote,
body.dark-mode .note-editor.note-frame .note-editing-area .note-editable {
    background-color: #f5f5f5 !important;
    color: #333333 !important;
}

/* ========== 쪽지 페이지 강화 ========== */
body.dark-mode .sub-title,
body.dark-mode .sub-title *,
body.dark-mode .memo-send-form *,
body.dark-mode .memo-list *,
body.dark-mode .memo-view * {
    background-color: #1e2021 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .sub-title {
    border-color: #3c4043 !important;
}
body.dark-mode .memo-send-form .form-group,
body.dark-mode .memo-send-form .input-group {
    background-color: #1e2021 !important;
}
body.dark-mode .memo-send-form .form-control,
body.dark-mode .memo-send-form input,
body.dark-mode .memo-send-form textarea {
    background-color: #2c2f31 !important;
    color: #e8e6e3 !important;
    border-color: #3c4043 !important;
}
body.dark-mode .memo-send-form .alert {
    background-color: #2c2f31 !important;
    color: #e8e6e3 !important;
    border-color: #3c4043 !important;
}

/* ========== 쪽지함 목록 닉네임 가독성 ========== */
body.dark-mode .div-table td,
body.dark-mode .div-table td b,
body.dark-mode .div-table td a,
body.dark-mode .div-table th,
body.dark-mode .memo-list td,
body.dark-mode .memo-list td b,
body.dark-mode .memo-list td a {
    color: #e8e6e3 !important;
}
body.dark-mode .div-table td b {
    color: #ffffff !important;
}
body.dark-mode .div-table tr.active,
body.dark-mode .div-table tr.active th {
    background-color: #232526 !important;
    color: #e8e6e3 !important;
}
body.dark-mode .div-table tr:hover td {
    background-color: #2c2f31 !important;
}

/* ========== 회원 닉네임 (sideview) ========== */
body.dark-mode .member,
body.dark-mode .member a,
body.dark-mode span.member,
body.dark-mode span.member a,
body.dark-mode .guest,
body.dark-mode span.guest {
    color: #ffffff !important;
}
body.dark-mode .sv_wrap,
body.dark-mode .sv_wrap a {
    color: #ffffff !important;
}

/* ========== 사이드바 그룹명 (커뮤니티, 취미생활 등) ========== */
body.dark-mode .sidebar-menu > li.treeview > a > span {
    color: #ffd700 !important;
}