/* 토글 다크 모드일 때 thead 색상 */
body.dark-mode .input-group-text {
    background-color: #444343;
    color: white;
}

body.dark-mode #solution_label {
    color: white;
}

body.dark-mode .solution_btn_icon {
    color: white;
}

body.dark-mode .dropdown a {
    color: white;
}

body.dark-mode .sidebar-logo {
    background-color: #2a2a2a;
}

body.dark-mode .dropdown-menu {
    background: #444343;
}

body.light-mode .dropdown-menu {
    background: #f8f9fa;
}

body.light-mode .solution-items {
    background-color: #92c9ff;
    color: black;
}

body.dark-mode .solution-items {
    background-color: #444343;
    color: white;
}

/*프로젝트 상세*/
body.dark-mode .detail-header {
    .project-sidebar {
        background-color: #2a2a2a;
        color: white;
    }

    .project-item {
        background-color: #555555;
    }

    .project-item a {
        color: white;
    }

    .project-item.active a {
        color: #007bff;
        font-weight: bold;
    }

    .project-item a:hover {
        color: #007bff;
    }

    .accordion-button, .accordion-collapse {
        background-color: #444343;
        color: white;
    }

    .accordion-button:not(.collapsed)::after {
        color: white !important;
    }

    .info-section {
        background-color: #555555;
        color: white;
    }
    
    .info-table th:nth-child(1) {
        color: white;
    }

    .text-muted {
        color: #999999 !important;
    }

    /*업무*/
    .workcard {
        background-color: #555555;
    }

    .workcard:hover {
        background-color: #69696b !important;
    }

    .workcard.active {
        background-color: #69696b;
    }

    #markdownEditor {
        background-color: #555555;
        color: white;
    }

    /*문서*/
    .project-file-table tbody tr td a {
        background-color: #555555 !important;
        border: black !important;

        span, i {
            color: white !important;
        }
    }

    /*영업 및 제안*/
    #proposalSelect > p {
        color: white;
    }

    #proposalSelect > span {
        color: rgb(202, 202, 204);
    }

    .details-table tbody tr td div {
        background-color: #555555;
        color: white;
    }

    .details-table tbody tr td {
        background-color: #555555 !important;
    }

    .details-table:hover {
        background-color: #69696b!important;
    }

    #detailsModal #modalGrid thead th {
        background-color: #555555 !important;
        color: white;
    }

    #detailsModal input[type="number"] {
        background-color: #444343 !important;
        color: white;
    }

    #detailsModal button:last-child {
        background-color: #69696b !important;
        color: white;
    }

    #detailsModal #modalGrid tbody tr td:last-child button {
        background-color: #444343 !important;
    }

    /*실행*/
    .task-main-content input[type="checkbox"] {
        accent-color: #69696b;
        background-color: #555555;
        color: white;
    }

    .parent-task {
        background-color: #555555;
        color: white;
    }
    
    .parent-task:hover {
        background-color: #69696b!important;
    }

    .sub-task {
        background-color: #69696b;
    }

    .info span {
        color: white;
    }

    .task-item button {
        background-color: #4b4a4d;
        color: white;
    }

    #executionMainWorkInsertModal input[type="range"]::-webkit-slider-runnable-track {
        -webkit-appearance: none;
        background-color: #6d6d70;
        border-radius: 10px;
    }

    #executionMainWorkInsertModal input[type="range"]::-webkit-slider-thumb {
        -webkit-appearance: none;
        background-color: #494955 !important;
        border-radius: 50%;
        width: 20px;
        height: 20px;
        cursor: pointer;
        border: 1px solid #6d6d70;
        box-shadow: 0 0 5px rgba(0,0,0,0.2);
    }

    /* .gantt-container div {
        background-color: #adadb1;
    } */

    /* .gantt-container rect {
        fill: #adadb1;
    } */

    /* ::-webkit-scrollbar {
        background-color: red !important;
    }
    ::-webkit-scrollbar-button:vertical {
        background-color: #2a2a2a !important;
    }
    ::-webkit-scrollbar-corner{
        background: #2a2a2a !important;
    } */

    tr:hover {
        background-color: #666568;
    }
    
}

body.light-mode .detail-header {
    body.light-mode ::-webkit-scrollbar {
        background-color: #f8f9fa !important;
    }
    
    body.light-mode ::-webkit-scrollbar-button:vertical {
        background-color: #f8f9fa !important;
    }
    
    body.light-mode ::-webkit-scrollbar-corner{
        background: #f8f9fa !important;
    }
}

body.dark-mode .selected-participant {
    background-color: #69696b !important;
}

body.dark-mode .selected-participant .btn-remove {
    color: white;
}

body.dark-mode .accordion-button {
    background-color: #444343;
    color: white;
}

body.dark-mode .chat-messages {
    background-color: #2a2a2a !important;  
    color: white !important;
}

body.dark-mode .chat-box {
    background-color: #2a2a2a !important;
}

body.dark-mode .side-panel {
    background-color: #2a2a2a !important;
}

body.dark-mode .modal-content {
    background-color: #2a2a2a !important;
    border-top: none !important;
}

body.dark-mode .feed-content-body {
    background-color: #2a2a2a !important;
}

body.dark-mode .wiki-header {
    background-color: #2a2a2a !important;
}

body.dark-mode .search-input-group {
    background-color: #444343 !important;
}

body.dark-mode .wiki-item {
    background-color: #2a2a2a !important;
}

body.dark-mode .document-info {
    p {
        color: white !important;
    }

    span {
        color: white !important;
    }
}

body.dark-mode .category-buttons {
    a {
        color: white !important;
    }
}

body.dark-mode .category-management {
    a {
        color: white !important;
    }
}

body.dark-mode .version_btn {
    span {
        color: white !important;
    }

    .version_btn_icon {
        i {
            color: white !important;
        }
    }
}

/*개인별 프로젝트 관리 + 주간 업무 리스트*/
body.dark-mode .weekly-content-list,
body.dark-mode .favorite-project-container {
    .weekly-block {
        background-color: #323133 !important;
    }
    .preview-accordion-button{
        background-color: #444343 !important;
        color: white;
    }

    .accordion-button, .accordion-collapse {
        background-color: #444343;
        color: white;
    }
    
}

/*주간업무 리스트 + 개인별 프로젝트 관리*/
body.dark-mode .project-card-max-list,
body.dark-mode .sales-weekly-project-list {
    background-color: #444343;

    input[type="text"]::placeholder {
        color: gray;
    }
    
    .project-table-container-max table tbody{
        background-color: #2a2a2a !important;
    }

}

/*개인별 업무 관리*/
body.dark-mode .personal-work-section {
    thead tr th {
        background-color: #444343 !important;
        color: white;
    }

    tbody tr td {
        color: white;
    }

    .sort-buttons {
        background-color: #444343;
        color: white;
    }

    .nav-item > .active {
        background-color: #2a2a2a;
        color: white;
    }
}

/*수금관리*/
body.dark-mode .payment-list {
    tbody td{
        background-color: #2a2a2a;
    }

    thead tr:hover {
        background-color: #69696b !important;
    }
}

/*청구일자 + 수금일자*/
body.dark-mode .flatpickr-calendar {
    background-color: #444343;

    * {
        color: white;
        fill: white;
    }

    .inRange {
        background-color: #555555;
        border-color: #555555;
        -webkit-box-shadow: -5px 0 0 #555555, 5px 0 0 #555555;
    }

    span:hover {
        svg {
            fill: #bbbbbb;
        }
    }

    .flatpickr-monthDropdown-months option {
        background-color: #555555;
    }
}

body.light-mode .flatpickr-calendar {
    span:hover {
        svg {
            fill: #555555;
        }
    }
}

/*수주품의 상세*/
body.dark-mode .contract-detail-container {
    .info-section {
        background-color: #2a2a2a;
        border: 1px solid #adadad;

        *:not(a) {
            color: white;
        }

        tbody>tr:last-child>* {
            border: none !important;
        }

        td {
            border: none !important;
        }
    }

    #table_wrapper {
        td {
            border: 1px solid white !important;
        }
    }

    tbody tr:hover,
    thead tr:hover {
        background-color: #444343;
    }
}

/*ai 자동생성 모달*/
body.dark-mode #reportInsertModal {
    p:not(.text-danger) {
        color:white !important;
    }

    .progress {
        background-color: #555555;
    } 
}

/*수주품의 수정*/
body.dark-mode .contract-edit-form {
    .form-section {
        background-color: #2a2a2a;
        border: 1px solid #adadad;

        * {
            color: white;
        }
    }
}

body.dark-mode .insert-container {
    tbody tr:hover,
    thead tr:hover {
        background-color: #444343;
    }
}

body.dark-mode .delete-container {
    .card {
        border: 1px solid white;
    }

    .card-header {
        border-bottom: 1px solid white;
    }

    .info-box {
        background-color: #444343;
    }
}

/*회의실 관리*/
body.dark-mode .calendar-container {
    .calendar th {
        background-color: #444343;
    }

    .today, .selected {
        background-color: #666568 !important;
        color: white;
    }

    .other-month {
        color: gray;
    }

    .reservation-title {
        color: white;
    }

    .calendar td:last-child,
    .calendar th:last-child {
        color: #5858ff;
    }

    .calendar td:first-child,
    .calendar th:first-child {
        color: #f35656;
    }

    .calendar td.other-month {
        color: #aaa;
    }

    .nowMonth:hover,
    .other-month:hover {
        background-color: #555555;
    }
}

body.dark-mode .time_line_reservation_container {
    input {
        background-color: #333333;
        border: 1px solid white;
        color: #ddd;
    }

    .timeline-table {
        th, button {
            background-color: #333333;
            border-color: #ddd;
        }
    }

    .reservation-title {
        color: black !important;
    }
}

body.light-mode .time_line_reservation_container {
    button {
        background-color: #f0f0f0 !important;
        border-color: #e8e8e8 !important;
    }

    input {
        background-color: #f8f9fa !important;
        border: 1px solid #e8e8e8;
        color: black;
    }

    table thead th:first-child {
        background-color: #f8f9fa !important;
    }
}

body.dark-mode #resvroomFormModal {
    .select_room_list div, .selected_start_time, .selected_end_time, li {
        background-color: #444343;
    }

    #reservation_time {
        background-color: transparent !important;
    }
}

body.dark-mode #detail {
    background-color: #2a2a2a;
    color: white;
}

body.dark-mode #mobile_room_list li,
body.dark-mode #tablet_room_list li {
    background-color: #2a2a2a;
}

body.dark-mode .main-chart div {
    color: white !important;
    canvas {
        color: white !important;
    }
}

body.dark-mode .timeline-table th:first-child {
    background-color: #444343 !important;
}

body.dark-mode .project-link {
    color: #007bff !important;
}

body.dark-mode input::placeholder {
    color: white;
}

body.dark-mode .card {
    background-color: #2a2a2a !important;
}

body.dark-mode .list-group-item {
    background-color: #444343 !important;
    color: white !important;
}

body.dark-mode .dropdown-item:hover {
    background-color: #747474 !important;
    color: white !important;
}

body.light-mode .dropdown-item:hover {
    background-color: #e4e4e4 !important;
    color: black !important;
}

body.dark-mode .project-mobile-item {
    p {
        color: white !important;
    }
}

html.light-mode .month-card {
    border: 1px solid #e8e8e8;
}

body.dark-mode .month-card {
    background-color: #444343 !important;
    border: 1px solid white;
}

body.dark-mode .accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

body.dark-mode .accordion-item {
    background-color: #444343 !important;
}

body.dark-mode div.dt-container .dt-paging .dt-paging-button {
    color: white !important;
}

body.dark-mode .solution-dropdown-menu {
    li {
        color: white;
    }

    li:hover {
        background-color: #555555;
    }
}

body.dark-mode .mobile-menu {
    background-color: #2a2a2a;
    border-bottom: none;

    .navbar-toggler {
        background-color: #555555;
    }

    #mobileNav {
        background-color: #444343;
    }
}

/*사용자 리스트*/
body.dark-mode .user-list {
    .table td {
        background-color: #2a2a2a;
    }
}

body.dark-mode table.dataTable.cell-border>tbody>tr>*:first-child {
    border-left: 1px solid white !important;
}

body.dark-mode #dropzone {
    form {
        background-color: #555555;
    }
}

body.dark-mode #yearlyTarget {
    background-color: #444343 !important;
}

body.light-mode .nav-container {
    background-color: white;
}

/**
솔루션 태그 아코디언
**/
body.light-mode .solution-tag-wrapper .solution-tag .solution-item {
    background-color: #9ac6ff !important;

    .solution-accordion-button:hover {
        background-color: transparent !important;
    }
}

body.dark-mode .user-item:hover {
    background-color: #555555 !important;
}

body.dark-mode .nav-container, 
body.dark-mode .sidebar-logo {
    border-bottom: 1px solid #3a3a3b;
    background-color: #2a2a2a;
}

/*탭(ex. 프로젝트 상세, 피드)*/
body.dark-mode .nav-link {
    background-color: #2a2a2a !important;
    border-bottom: 1px solid white;
}

/*개인별 프로젝트 관리 내용입력 미리보기 칸*/
body.dark-mode #thisWeekPreview p {
    color: white;
}

/*.accordion-body 사용처가 많아 특정 태그로 스타일 지정*/
body.dark-mode .solution-accordion-body {
    background-color: #2a2a2a;
}

/*프로젝트 상세 테이블만 따로 스타일 추가*/
body.dark-mode #projectDetails .info-table {
    tr, td, th {
        border: none !important;
    }
}

/*개시판 작성*/
/*왼쪽(작성란)*/
body.dark-mode .toastui-editor {
    div {
        background-color: #2a2a2a;
        color: white;
    }
}

/*오른쪽(마크다운으로 보이는 란)*/
body.dark-mode .toastui-editor-contents {
    * {
        color: white;
    }
}

/*임시용*/
body.dark-mode .insert-container,
body.dark-mode .edit-container {
    .card-body {
        background-color: #2a2a2a !important;
    }
}

body.dark-mode .target-in-project-table {
    tbody {
        border-top: none;
    }
}

body.dark-mode .project-card-mini-list {
    .row {
        background-color: #444343 !important;
    }
}

body.dark-mode .delete-container {
    table * {
        border: 1px solid white;
    }

    .alert p {
        color: red !important;
    }
}

body.light-mode #salesCompanyMonthProjectSidePanel {
    background-color: white;
}

body.light-mode .calendar,
body.dark-mode .calendar {
    td:has(.holiday) {
        color: #f35656 !important;
    }
} 

body.dark-mode .popover-body,
body.dark-mode .popover-header {
    background-color: #2a2a2a;
}

/* 다크모드 스켈레톤 */
body.dark-mode .skeleton {
    background: linear-gradient(90deg, #444343 25%, #555555 50%, #444343 75%);
    background-size: 200% 100%;
}

body.dark-mode .skeleton-loader .table {
    background-color: #2a2a2a;
}

body.dark-mode .skeleton-loader .table-header {
    background-color: #444343;
}

body.dark-mode .skeleton-loader tbody tr {
    background-color: #2a2a2a;
    border-color: #555555;
}

body.dark-mode .skeleton-loader tbody tr:hover {
    background-color: #2a2a2a;
}

body.dark-mode .fallback-message {
    text-align: center;
    padding: 60px 20px;
    border-radius: 8px;
    background: #333;
    color: #fff;
}

body.light-mode .fallback-message {
    text-align: center;
    padding: 60px 20px;
    border-radius: 8px;
    background: #f8f9fa;
    color: #333;
}