@charset "UTF-8";

.input-box .ico-uni-arrow-down {pointer-events:none;}

.input-box:hover input,
.input-box:hover textarea,
.input-box:hover select,
.check-input-wrapper:hover i:after{ border: 1px solid var(--color-border-strong); }

.input-box input:focus,
.input-box textarea:focus,
.input-box select:focus {border: 1px solid var(--color-border-focus); box-shadow: var(--shadow-focus);}

.input-box select:disabled { opacity: 1; }

#unipost-unidocu .input-box.state-invalid-box input,
#unipost-unidocu .input-box.state-invalid-box textarea,
#unipost-unidocu .input-box.state-invalid-box select {
    border-color: var(--color-danger) !important;
    background-color: #FEE2E2 !important;
}
:root[data-mode="dark"] #unipost-unidocu .input-box.state-invalid-box input,
:root[data-mode="dark"] #unipost-unidocu .input-box.state-invalid-box textarea,
:root[data-mode="dark"] #unipost-unidocu .input-box.state-invalid-box select {
    background-color: var(--color-danger-bg) !important;
}

.unidocu-th.unidocu-th-required::after {
    content: ' *';
    color: var(--color-danger);
    position: relative;
    top: -0.25em;
    font-weight: 700;
}

.input-box input,
.input-box textarea,
.input-box select {
    transition: background-color .15s ease, border-color .15s ease;
}
.input-box.state-require-empty input,
.input-box.state-require-empty textarea,
.input-box.state-require-empty select {
    background-color: var(--color-input-bg-require);
    border-color: var(--color-warning-border, #FDE68A);
}
.input-box.state-require-empty:hover input,
.input-box.state-require-empty:hover textarea,
.input-box.state-require-empty:hover select { border-color: var(--color-warning-border, #FDE68A); }

.input-box.state-disabled,
.input-box.state-disabled .check-input-wrapper { cursor: default !important; opacity: 0.9 !important; }
.input-box.state-disabled input,
.input-box.state-disabled textarea,
.input-box.state-disabled select{background-color: #f1f5f9;}
:root[data-mode="dark"] .input-box.state-disabled input,
:root[data-mode="dark"] .input-box.state-disabled textarea,
:root[data-mode="dark"] .input-box.state-disabled select { background-color: var(--color-surface-secondary); }

/* 수정불가(state-disabled) 상태면 필수(state-require-empty) 표시 중 테두리 강조는 끈다 */
.input-box.state-disabled.state-require-empty input,
.input-box.state-disabled.state-require-empty textarea,
.input-box.state-disabled.state-require-empty select,
.input-box.state-disabled.state-require-empty:hover input,
.input-box.state-disabled.state-require-empty:hover textarea,
.input-box.state-disabled.state-require-empty:hover select { border-color: var(--color-border-strong); }

.input-box.state-disabled:hover input,
.input-box.state-disabled:hover textarea,
.input-box.state-disabled:hover select,
.input-box.state-disabled .check-input-wrapper:hover i:after{ border-color: var(--color-border); }

.input-box.state-disabled .check-input-wrapper input:checked + i:after {
    background-color: #333;
    border: 4px solid #c1c1c1;
}
:root[data-mode="dark"] .input-box.state-disabled .check-input-wrapper input:checked + i:after {
    background-color: var(--color-text-secondary);
    border-color: var(--color-border-strong);
}

.input-box,
.check-input-wrapper {position: relative;}

.input-box input,
.input-box textarea,
.input-box select {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    height: 30px;
    padding: 0 10px;
    font-size: calc(13px + var(--font-offset, 0px));
    font-family: 'SUIT-Medium', sans-serif;
    font-weight: 500;
    color: var(--color-text-primary);
    outline: none;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-strong);
    background-color: var(--color-surface);
    transition: border-color 0.13s ease, box-shadow 0.13s ease;
}
.input-box select,
.input-box.unidocu-input-datepicker input,
.input-box.unidocu-input-datepickermonth input {padding-right: 25px;}

.check-input-wrapper {
    color: var(--color-text-primary);
    margin-right: 12px;
    cursor: pointer;
}
.check-input-wrapper:last-child {margin-right: 0;}

.check-input-wrapper input{ position: absolute; left: -9999px; }
.check-input-wrapper input:checked + i {position: relative;}
.check-input-wrapper input + i::after {
    display: inline-block;
    width: calc(12px + var(--font-offset, 0px));
    height: calc(12px + var(--font-offset, 0px));
    line-height: 14px;
    border: 1px solid var(--color-border);
    background-color: var(--color-surface);
    margin-right: 5px;
    font-size: 12px;
    border-radius: 4px;
}
.check-input-wrapper input[type=checkbox]:checked + i::after {
    position: relative;
    top: 2px;
    content: '';
    background: url('../images/i-check.svg') 50% 50% no-repeat;
    background-size: 8px 6px;
}
:root[data-mode="dark"] .check-input-wrapper input[type=checkbox]:checked + i::after {
    background-image: url('../images/i-check-dark.svg');
}
.check-input-wrapper input[type=checkbox] + i::after {
    position: relative;
    top: 2px;
    left: 0;
    content: '';
}
.check-input-wrapper input[type=radio]:checked + i::before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: calc(12px + var(--font-offset, 0px));
    height: calc(12px + var(--font-offset, 0px));
    border: 1px solid var(--color-border);
    border-radius: 50%;
    z-index: 1;
}
.check-input-wrapper input[type=radio]:checked + i::after {
    background: var(--color-primary);
    border: 4px solid var(--color-surface);
    width: calc(6px + var(--font-offset, 0px));
    height: calc(6px + var(--font-offset, 0px));
}
.check-input-wrapper input[type=radio] + i::after {
    content: '';
    border-radius: 50%;
    position: relative;
    top: 1px;
}

.input-box textarea {  height: auto;  resize: none;  }
.unidocu-input-amount { width: 100px;}
.unidocu-input-amount input { text-align: right; }
.input-box.two-digit { display: inline-block; width: 52px; text-align: center;}
.input-box.four-digit { display: inline-block; width: 70px;}

.uni-ckeditor {
    min-height: 100px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    outline: none;
    background-color: var(--color-surface);
}
.uni-ckeditor[contenteditable=false]{
    border: none;
    padding: 2px;
}
table.cke_dialog {width: auto !important;}

.unidocu-input-datepicker { display: inline-block; text-align: center;}
.unidocu-input-datepicker.month { display: inline-block; width: 80px; }
.unidocu-input-datepicker {
    display: inline-block;
    width: 105px;
}
.unidocu-input-datepickermonth {
    display: inline-block;
    width: 85px;
}
.unidocu-input-datepickerSelectMonth {
    display: inline-block;
    position: absolute;
    margin-left: 10px;
}

.unidocu-input-datepickerSelectMonth button {
    margin-right: 5px;
}

.Uni_TextEditor * {
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-size: inherit;
}

.Uni_TextEditor { font-family: sans-serif, Arial, Verdana, "Trebuchet MS";font-size: 12px; color: #333; background-color: #fff;margin: 20px;}
:root[data-mode="dark"] .Uni_TextEditor { color: var(--color-text-primary); background-color: var(--color-surface); }
th.Uni_TextEditor {font-family: "SUIT-Regular", sans-serif;}
.Uni_TextEditor .cke_editable {font-size: 13px;line-height: 1.6; word-wrap: break-word;}
.Uni_TextEditor blockquote {font-style: italic;font-family: Georgia, Times, "Times New Roman", serif;padding: 2px 0;border-style: solid;border-color: #ccc;border-width: 0;}
.Uni_TextEditor .cke_contents_ltr blockquote {padding-left: 20px;padding-right: 8px;border-left-width: 5px;}
.Uni_TextEditor .cke_contents_rtl blockquote {padding-left: 8px;padding-right: 20px;border-right-width: 5px;}
.Uni_TextEditor a {color: #0782C1;}
.Uni_TextEditor ul, .Uni_TextEditor ol {list-style: none; margin-left: 20px; padding-left: 0;}
.Uni_TextEditor ul > li::before {content: "•";display: inline-block; width: 18px; text-align: right; margin-right: 6px;}
.Uni_TextEditor ol {counter-reset: item;}
.Uni_TextEditor ol > li {counter-increment: item; display: block; padding-left: 0;}
.Uni_TextEditor ol > li::before {content: counter(item) "."; display: inline-block; width: 24px; text-align: right; margin-right: 6px;}
.Uni_TextEditor dl { margin-right: 0; padding: 0 40px;}
.Uni_TextEditor h1,
.Uni_TextEditor h2,
.Uni_TextEditor h3,
.Uni_TextEditor h4,
.Uni_TextEditor h5,
.Uni_TextEditor h6 {font-weight: normal;line-height: 1.2;}
.Uni_TextEditor hr {border: 0;border-top: 1px solid #ccc;}
.Uni_TextEditor img.right {border: 1px solid #ccc;float: right;margin-left: 15px;padding: 5px;}
.Uni_TextEditor img.left {border: 1px solid #ccc;float: left;margin-right: 15px;padding: 5px;}
.Uni_TextEditor pre {white-space: pre-wrap;word-wrap: break-word;-moz-tab-size: 4;tab-size: 4;}
.Uni_TextEditor .marker {background-color: Yellow;}
.Uni_TextEditor span[lang] {font-style: italic;}
.Uni_TextEditor figure {text-align: center;border: solid 1px #ccc;border-radius: 2px;background: rgba(0, 0, 0, 0.05);padding: 10px;margin: 10px 20px;display: inline-block;}
.Uni_TextEditor figure > figcaption {text-align: center;display: block;}
.Uni_TextEditor a > img {padding: 1px;margin: 1px;border: none;outline: 1px solid #0782C1;}
.Uni_TextEditor .code-featured {border: 5px solid red;}
.Uni_TextEditor .math-featured {padding: 20px;box-shadow: 0 0 2px rgba(200, 0, 0, 1);background-color: rgba(255, 0, 0, 0.05);margin: 10px;}
.Uni_TextEditor .image-clean {border: 0;background: none;padding: 0;}
.Uni_TextEditor .image-clean > figcaption {font-size: .9em;text-align: right;}
.Uni_TextEditor .image-grayscale {background-color: white;color: #666;}
.Uni_TextEditor .image-grayscale img,
.Uni_TextEditor img.image-grayscale {filter: grayscale(100%);}
.Uni_TextEditor .embed-240p {max-width: 426px;max-height: 240px;margin: 0 auto;}
.Uni_TextEditor .embed-360p {max-width: 640px;max-height: 360px;margin: 0 auto;}
.Uni_TextEditor .embed-480p {max-width: 854px;max-height: 480px;margin: 0 auto;}
.Uni_TextEditor .embed-720p {max-width: 1280px;max-height: 720px;margin: 0 auto;}
.Uni_TextEditor .embed-1080p {max-width: 1920px;max-height: 1080px;margin: 0 auto;}
.Uni_TextEditor strong { font-weight: bold; }
.Uni_TextEditor big { font-size: larger; }
.Uni_TextEditor small { font-size: smaller; }
.Uni_TextEditor em { font-style: italic; }
.Uni_TextEditor table {border-collapse: collapse; border-spacing: 0; border: 1px solid #DDD;}
.Uni_TextEditor table th, .Uni_TextEditor table td {border: 1px solid #DDD; vertical-align: middle; line-height: 1.6;}

.multi-select-combo .select-text-box {
    height: 30px;
    padding-right: 30px;
    cursor: pointer;
}

.multi-select-combo .select-text-box:hover + ul
, .multi-select-combo ul:hover {
    border-color: var(--color-border-strong);
}

.multi-select-combo ul {
    list-style: none;
    box-sizing: border-box;
    min-width: 100%;
    max-height: 252px;
    outline: none;
    padding: 4px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    box-shadow: var(--shadow-lg);
    overflow-x: hidden;
    overflow-y: auto;
    cursor: pointer;
    position: fixed;
    top: auto;
    z-index: 10;
    display: none;
}

/* 전체선택(첫 행) — 상단 고정 + 하단 구분선으로 목록과 분리 */
.multi-select-combo ul li:first-child {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    border: none;
    border-bottom: 1px solid var(--color-border);
    border-radius: 0;
    margin-bottom: 4px;
    padding-bottom: 4px;
    background: var(--color-surface);
    display: none;
    z-index: 10;
}

.multi-select-combo ul li {
    position: relative;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    display: none;
    transition: background-color .13s ease;
}

.multi-select-combo ul li:hover {
    background: var(--bg-hover, #F1F5F9);
}

.multi-select-combo ul li:hover span.multi-select-item {
    color: var(--color-primary);
}

.multi-select-combo ul li label {
    display: flex;
    align-items: center;
    gap: 8px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 7px 10px;
    margin-right: 0;
    cursor: pointer;
}

.multi-select-combo ul li span.multi-select-item {
    max-width: 245px;
    font-size: calc(13px + var(--font-offset, 0px));
    color: var(--color-text-primary);
}

.input-box i.unicon {
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-sm);
    background-color: transparent;
    opacity: .7;
}
.input-box i.unicon:hover {opacity: 1;}
.input-box i.ico-uni-calendar {
    background: url('../images/i-calendar.svg') 50% 50% no-repeat;
    background-size: 14px;
}
.input-box i.ico-uni-arrow-down {
    background: url('../images/i-arrow-line.svg') 50% calc(50% + 1px) no-repeat;
    background-size: 10px 5px;
}
.input-box i.ico-uni-search {
    background: url('../images/i-search.svg') 50% 50% no-repeat;
    background-size: 10px;
}
:root[data-mode="dark"] .input-box i.ico-uni-arrow-down { background-image: url('../images/i-arrow-line-dark.svg'); }
:root[data-mode="dark"] .input-box i.ico-uni-search { background-image: url('../images/i-search-dark.svg'); }
.input-box.uni-search-button i.ico-uni-search {background-size: 12px;}
.input-box.uni-search-button {
    position: relative;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
}
.unidocu-input-wrapper + .unidocu-input-wrapper .input-box.uni-search-button {top: 8px;}
.input-box i.unicon::before {display: none;}
.Uni_Text .unidocu-input-wrapper {
    width: 100%;
    height: 30px;
    padding: 0 10px;
    line-height: 28px;
    font-size: calc(13px + var(--font-offset, 0px));
    font-family: 'SUIT-Medium', sans-serif;
    font-weight: 500;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    box-sizing: border-box;
    background-color: var(--color-surface-tertiary);
}
.Uni_Radio .unidocu-input-wrapper .input-box,
.Uni_CheckBox .unidocu-input-wrapper .input-box {
    line-height: 22px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    box-sizing: border-box;
}
.Uni_Radio .unidocu-input-wrapper .input-box.state-require,
.Uni_CheckBox .unidocu-input-wrapper .input-box.state-require,
.Uni_Radio .unidocu-input-wrapper .input-box.state-require-empty,
.Uni_CheckBox .unidocu-input-wrapper .input-box.state-require-empty {
    border-color: var(--color-border);
}
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty) input,
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty) textarea,
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty) select {
    background-color: var(--color-input-bg);
    border-color: var(--color-input-border);
}
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty):hover input,
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty):hover textarea,
:root[data-mode="dark"] .input-box:not(.state-disabled):not(.state-require-empty):hover select {
    border-color: #7c7b74;  /* sand10 */
}

#amount-display .input-box input {
    font-family: "SUIT-Bold", sans-serif;
    color: var(--color-text-primary);
}
html #unipost-unidocu .custom-uni_auto_complete-toggle .ui-icon-triangle-1-s {
    width: 26px;
    height: 25px;
    margin: 0;
    background: url('../images/i-arrow-line.svg') 50% calc(50% + 1px) no-repeat;
    background-size: 10px 5px;
    opacity: .7;
}
html[data-mode="dark"] #unipost-unidocu .custom-uni_auto_complete-toggle .ui-icon-triangle-1-s {
    background-image: url('../images/i-arrow-line-dark.svg');
}
