@charset "utf-8";
@import url('../myfile/font/NEXON_Lv2_Gothic.css');
@import url('./my_gooin.css?ver=6');
@import url('./my_nariya.css?ver=6');

/* 기준 폰트 */
html {
    font-size: 14px;
}

/* 제목, 내용 등 기본 폰트 */
body {
    font-size: 15px !important;
    font-family: 'NEXON Lv2 Gothic', sans-serif !important;
    line-height: 1.8;
}


.btn-checkbox {
    /* transition: all 0.2s ease; */
    border: 1px solid #a9a9aa;
    background-color: transparent !important;
    /* color: #6c757d; */
    font-size: 0.9rem;
    /* padding: 8px 16px; */
    padding: 5px 10px;
    border-radius: 10px;
    /* font-weight: 500; */
}

.btn-checkbox:hover {
    /* transform: translateY(-1px); */
    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
    background-color: rgba(0, 0, 0, 0.05) !important;
}

.btn-checkbox.active {
    background-color: #d9dada !important;
    border-color: #565656;
    /* color: white !important; */
}

/* Dark 모드 대응 */
[data-bs-theme="dark"] .btn-checkbox,
.dark .btn-checkbox {
    border-color: #6c757d;
    /* color: #adb5bd; */
    background-color: transparent !important;
    box-shadow: none;
}

[data-bs-theme="dark"] .btn-checkbox:hover,
.dark .btn-checkbox:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: #adb5bd;
    color: #ffffff;
    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); */
}

[data-bs-theme="dark"] .btn-checkbox.active,
.dark .btn-checkbox.active {
    background-color: rgba(255, 255, 255, 0.2) !important;
    border-color: #9ba3ab;
    color: #ffffff;
    box-shadow: none;
    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); */
}


/* 기타 스타일들 */
.btn-checkbox.primary {
    border-color: #0d6efd;
    color: #0d6efd;
    background-color: transparent !important;
}

.btn-checkbox.primary:hover {
    background-color: rgba(13, 110, 253, 0.1) !important;
}

.btn-checkbox.primary.active {
    background-color: #0d6efd !important;
    border-color: #0d6efd;
    color: #ffffff;
    /* box-shadow: 0 2px 6px rgba(13, 110, 253, 0.5); */
}


/* Dark 모드에서 primary 옵션 */
[data-bs-theme="dark"] .btn-checkbox.primary,
.dark .btn-checkbox.primary {
    border-color: primary;
    /* color: p; */
    /* color: white; */
    background-color: transparent !important;
    box-shadow: none;
}

[data-bs-theme="dark"] .btn-checkbox.primary:hover,
.dark .btn-checkbox.primary:hover {
    border-color: #9ec5fe;
    /* color: #9ec5fe; */
    /* background-color: rgba(110, 168, 254, 0.1) !important; */
    background-color: transparent !important;
    /* box-shadow: 0 2px 6px rgba(110, 168, 254, 0.2); */
    /* transform: translateY(-1px); */
}

[data-bs-theme="dark"] .btn-checkbox.primary.active,
.dark .btn-checkbox.primary.active {
    background-color: #0d6efd !important;
    border-color: #0d6efd;
    color: #ffffff;
    /* box-shadow: 0 2px 6px rgba(13, 110, 253, 0.5); */
}

.btn-checkbox.success {
    border-color: #198754;
    color: #198754;
    background-color: transparent !important;
}

.btn-checkbox.success:hover {
    background-color: rgba(25, 135, 84, 0.1) !important;
}

.btn-checkbox.success.active {
    background-color: #198754 !important;
    border-color: #198754;
    color: white;
}

/* Dark 모드에서 success 옵션 */
[data-bs-theme="dark"] .btn-checkbox.success,
.dark .btn-checkbox.success {
    border-color: #75b798;
    color: #75b798;
    background-color: transparent !important;
    box-shadow: none;
}

[data-bs-theme="dark"] .btn-checkbox.success:hover,
.dark .btn-checkbox.success:hover {
    border-color: #95c5af;
    color: #95c5af;
    background-color: rgba(117, 183, 152, 0.1) !important;
    transform: translateY(-1px);
}

[data-bs-theme="dark"] .btn-checkbox.success.active,
.dark .btn-checkbox.success.active {
    background-color: #198754 !important;
    border-color: #198754;
    color: #ffffff;
}

.btn-checkbox.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    background-color: transparent !important;
}

/* Dark 모드에서 비활성화된 버튼 */
[data-bs-theme="dark"] .btn-checkbox.disabled,
.dark .btn-checkbox.disabled {
    opacity: 0.4;
    color: #6c757d;
    border-color: #495057;
    background-color: rgba(255, 255, 255, 0.02) !important;
    box-shadow: none;
    transform: none;
}

/* Tags */
/*.list-tags { margin-bottom:15px; padding-top: 14.5px; }
.list-tags .nav { background:#fafafa; border-right:1px solid #ddd; border-top:1px solid #ddd; }
.list-tags .nav li { border-top:0px !important; }
*/

.tags-item { padding:0px; overflow:hidden; margin:-4px 0px -6px; margin-right:-12px; padding-top: 16px; }
.tags-item .chk-tag { text-align:left !important; background: none !important; padding:0px !important; margin: 0px !important; box-shadow:none !important;display:inline-block !important; height:28px; line-height:28px !important;}

.tags-item .chk-tag span { /*font-family:dotum;*/ font-weight:normal; display:inline-block; margin:0px; padding-right:12px; line-height:28px; font-size: 14px; }
.tags-item .chk-tag.active span,
.tags-item .chk-tag:focus span { color:orangered; font-weight:bold; font-size: 14px; }
.tags-item .chk-tag.active span:before,
.tags-item .chk-tag:focus span:before { font-family:FontAwesome; content:"\f00c"; padding-right:4px; }
.tags-submit { border-top:1px dotted #ccc; margin-top:15px; padding-top:15px; }
.tags-line { border-top:1px dotted #ccc; margin:6px 10px; margin-left:0px; height:1px; }

/* Bootstrap5 btn 클릭시 focus outline(border) 제거 - 25.03.28, 작업자: 쏘넷인턴 */
.chk-tag:focus, .chk-tag:focus-visible { outline: none !important; box-shadow: none !important; }
.tags-item .chk-tag { transition: none !important; } /* transition 제거로 찰나의 border 플래시 방지 */
.tags-item .chk-tag:focus, .tags-item .chk-tag:focus-visible { outline: none !important; box-shadow: none !important; border: none !important; }
.tags-item .chk-tag:active { outline: none !important; box-shadow: none !important; border: none !important; }
.tags-item .chk-tag.active:focus, .tags-item .chk-tag.active:focus-visible { outline: none !important; box-shadow: none !important; border: none !important; }
.tags-item .chk-tag.active{ outline: none !important; box-shadow: none !important; border: none !important; }


.my-input-lg {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0.15rem;
    cursor: pointer;
}

.my-newline {
    display: block;
    height: 7px;
}