@charset "utf-8";
/* ----------------------------------------------
CUSTOME.CSS
* writer : uxcamp
* version : 1.0.0
* last update : 2025.06.20
* purpose : 테마 커스텀 스타일
* license : © 2025 uxcamp. All rights reserved.
------------------------------------------------*/

:root {
    --uxc-motion-fast: 140ms;
    --uxc-motion-normal: 220ms;
    --uxc-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

button,
.button,
a.button,
a[class^="btn"],
a[class*=" btn"],
button[class^="btn"],
button[class*=" btn"],
input[type="button"],
input[type="submit"],
input[type="reset"],
[role="button"] {
    transition-property: transform, opacity, box-shadow, background-color, border-color, color, filter;
    transition-duration: var(--uxc-motion-fast);
    transition-timing-function: var(--uxc-motion-ease);
}

@media (hover: hover) and (pointer: fine) {
    button:not(:disabled):not([disabled]):hover,
    .button:not(:disabled):not([disabled]):hover,
    a.button:hover,
    a[class^="btn"]:hover,
    a[class*=" btn"]:hover,
    button[class^="btn"]:not(:disabled):not([disabled]):hover,
    button[class*=" btn"]:not(:disabled):not([disabled]):hover,
    input[type="button"]:not(:disabled):not([disabled]):hover,
    input[type="submit"]:not(:disabled):not([disabled]):hover,
    input[type="reset"]:not(:disabled):not([disabled]):hover,
    [role="button"]:hover {
        transform: translateY(-1px);
        filter: saturate(1.03);
    }
}

button:not(:disabled):not([disabled]):active,
.button:not(:disabled):not([disabled]):active,
a.button:active,
a[class^="btn"]:active,
a[class*=" btn"]:active,
button[class^="btn"]:not(:disabled):not([disabled]):active,
button[class*=" btn"]:not(:disabled):not([disabled]):active,
input[type="button"]:not(:disabled):not([disabled]):active,
input[type="submit"]:not(:disabled):not([disabled]):active,
input[type="reset"]:not(:disabled):not([disabled]):active,
[role="button"]:active {
    transform: translateY(0) scale(0.98);
    transition-duration: 90ms;
}

button:focus-visible,
.button:focus-visible,
a.button:focus-visible,
a[class^="btn"]:focus-visible,
a[class*=" btn"]:focus-visible,
button[class^="btn"]:focus-visible,
button[class*=" btn"]:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
input[type="reset"]:focus-visible,
[role="button"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.22);
}

@keyframes uxcFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes uxcPopIn {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.boardReportModal:not([hidden]) {
    animation: uxcFadeIn var(--uxc-motion-normal) ease both;
}

.boardReportModal:not([hidden]) .boardReportModalDialog {
    animation: uxcPopIn calc(var(--uxc-motion-normal) + 40ms) var(--uxc-motion-ease) both;
}

.multiModal.active {
    animation: uxcFadeIn var(--uxc-motion-fast) ease both;
}

.multiModal.active .modalBox {
    animation: uxcPopIn var(--uxc-motion-normal) var(--uxc-motion-ease) both;
}

.upload-modal-wrap.is-open {
    animation: uxcFadeIn var(--uxc-motion-fast) ease both;
}

.upload-modal-wrap.is-open .upload-modal-dim {
    animation: uxcFadeIn var(--uxc-motion-fast) ease both;
}

.upload-modal-wrap.is-open .upload-modal {
    animation: uxcPopIn var(--uxc-motion-normal) var(--uxc-motion-ease) both;
}

@media (prefers-reduced-motion: reduce) {
    button,
    .button,
    a.button,
    a[class^="btn"],
    a[class*=" btn"],
    button[class^="btn"],
    button[class*=" btn"],
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    [role="button"] {
        transition: none !important;
        animation: none !important;
        transform: none !important;
    }

    .boardReportModal:not([hidden]),
    .boardReportModal:not([hidden]) .boardReportModalDialog,
    .multiModal.active,
    .multiModal.active .modalBox,
    .upload-modal-wrap.is-open,
    .upload-modal-wrap.is-open .upload-modal-dim,
    .upload-modal-wrap.is-open .upload-modal {
        animation: none !important;
    }
}