/* -------------------------------------------------------------------------- */
/*                                Falcon Button                               */
/* -------------------------------------------------------------------------- */
/* prettier-ignore */
/*# sourceMappingURL=user.css.map */

:root,
[data-bs-theme=light] {
    gray:    #d5d3d3;
    blue:    #0d6efd;
    indigo:  #6610f2;
    purple:  #6f42c1;
    pink:    #d63384;
    red:     #dc3545;
    orange:  #fd7e14;
    yellow:  #ffc107;
    green:   #198754;
    teal:    #20c997;
    cyan:    #0dcaf0;
    black:   #212322;

    --clean-status-pending-rgb: 255, 191, 54;     /* yellow tone */
    --clean-status-inprogress-rgb: 229, 64, 59;   /* red tone */
    --clean-status-completed-rgb: 144, 238, 144;  /* green tone  */
    --clean-status-verified-rgb: 43, 178, 194;    /* blue tone */

    --clean-status-pending-opacity: 0.25;
    --clean-status-inprogress-opacity: 0.25;
    --clean-status-completed-rgb-opacity: 0.4;
    --clean-status-verified-rgb-opacity: 0.25;

    --room-status-background-available: gray;
    --room-status-background-checkin: blue;
    --room-status-background-occupied: green;
    --room-status-background-checkout: red;
    --room-status-background-backtoback: indigo;

    --cleaning-guest-count-text-emphasis: var(--falcon-info-text-emphasis);
    --cleaning-guest-count-bg-subtle: var(--falcon-info-bg-subtle);

    --cleaning-night-text-emphasis: var(--falcon-primary-text-emphasis);
    --cleaning-night-bg-subtle: var(--falcon-primary-bg-subtle);

}

.messages.hide {
    position: relative;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-10px); // translateX, translateY, translateZ works well
    transition: visibility 0s 250ms, opacity 250ms, transform 250ms;
}

/* room status */
rect.available,
rect.room-legend.available {
    fill: var(--room-status-background-available);
}
rect.occupied,
rect.room-legend.occupied {
    fill: var(--room-status-background-occupied);
}
rect.check-in,
rect.room-legend.check-in {
    fill: var(--room-status-background-checkin);
}
rect.check-out,
rect.room-legend.check-out {
    fill: var(--room-status-background-checkout);
}
rect.back-to-back,
rect.room-legend.back-to-back {
    fill: var(--room-status-background-backtoback);
}

.bg-pending {
    background-color: rgba(var(--clean-status-pending-rgb), var(--clean-status-pending-opacity, 0.20)) !important;
}
.bg-in_progress {
    background-color: rgba(var(--clean-status-inprogress-rgb), var(--clean-status-inprogress-opacity, 0.20)) !important;
}
.bg-completed {
    background-color: rgba(var(--clean-status-completed-rgb), var(--clean-status-completed-rgb-opacity, 0.20)) !important;
}
.bg-verified {
    background-color: rgba(var(--clean-status-verified-rgb), var(--clean-status-verified-rgb-opacity, 0.20)) !important;
}

.border-pending {
    --falcon-bg-opacity: 1;
    border-color: rgba(var(--clean-status-pending-rgb), var(--falcon-bg-opacity)) !important;
}
.border-in_progress {
    --falcon-bg-opacity: 1;
    border-color: rgba(var(--clean-status-inprogress-rgb), var(--falcon-bg-opacity)) !important;
}
.border-completed {
    --falcon-bg-opacity: 1;
    border-color: rgba(var(--clean-status-completed-rgb), var(--falcon-bg-opacity)) !important;
}
.border-verified {
    --falcon-bg-opacity: 1;
    border-color: rgba(var(--clean-status-verified-rgb), var(--falcon-bg-opacity)) !important;
}

/* 네온 효과 - 그린 */
.neon-border-completed {
  box-shadow: 0 0 7px 3px rgba(40, 167, 69, 0.5); /* Bootstrap success 색상 */
}

/* 네온 효과 - 블루 */
.neon-border-verified {
  box-shadow: 0 0 7px 3px rgba(23, 162, 184, 0.5); /* Bootstrap info 색상 */
}

/* 네온 효과 - 레드 */
.neon-border-in_progress {
  box-shadow: 0 0 7px 3px rgba(220, 53, 69, 0.5); /* Bootstrap danger 색상 */
}

/* 네온 효과 - 옐로우 */
.neon-border-pending {
  box-shadow: 0 0 7px 3px rgba(255, 193, 7, 0.5); /* Bootstrap warning 색상 */
}

.badge-direct {
    color: var(--falcon-info-text-emphasis) !important;
    background-color: var(--falcon-info-bg-subtle) !important;
}
.badge-airbnb {
    color: var(--falcon-danger-text-emphasis) !important;
    background-color: var(--falcon-danger-bg-subtle) !important;
}
.badge-naver {
    color: var(--falcon-success-text-emphasis) !important;
    background-color: var(--falcon-success-bg-subtle) !important;
}
.badge-yanolja {
    /* Yanolja Orange HEX F54B1E */
    color: var(--falcon-warning-text-emphasis) !important;
    background-color: var(--falcon-warning-bg-subtle) !important;
}

.badge-res-pending {
    color: var(--falcon-warning-text-emphasis) !important;
    background-color: var(--falcon-warning-bg-subtle) !important;
}
.badge-res-confirmed {
    color: var(--falcon-success-text-emphasis) !important;
    background-color: var(--falcon-success-bg-subtle) !important;
}
.badge-res-canceled {
    color: var(--falcon-danger-text-emphasis) !important;
    background-color: var(--falcon-danger-bg-subtle) !important;
}
.badge-res-completed {
    color: var(--falcon-secondary-text-emphasis) !important;
    background-color: var(--falcon-secondary-bg-subtle) !important;
}

.badge-audit-status-success {
    color: var(--falcon-success-text-emphasis) !important;
    background-color: var(--falcon-success-bg-subtle) !important;
}
.badge-audit-status-warning {
    color: var(--falcon-warning-text-emphasis) !important;
    background-color: var(--falcon-warning-bg-subtle) !important;
}
.badge-audit-status-error {
    color: var(--falcon-danger-text-emphasis) !important;
    background-color: var(--falcon-danger-bg-subtle) !important;
}


.badge-subtle-guest-count {
    color: var(--cleaning-guest-count-text-emphasis) !important;
    background-color: var(--cleaning-guest-count-bg-subtle) !important;
}

.badge-subtle-night {
    color: var(--cleaning-night-text-emphasis) !important;
    background-color: var(--cleaning-night-bg-subtle) !important;
}

.rainbow-text {
    /* 무지개 색상의 그라데이션 배경을 생성. */
    background: linear-gradient(to right, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #9400d3);
    /* 배경의 크기를 텍스트보다 2배 크게 설정하여 애니메이션 공간을 확보. */
    background-size: 200% auto;
    /* 배경을 텍스트 모양으로 잘라냄. */
    -webkit-background-clip: text;
    background-clip: text;
    /* 원래 텍스트 색상을 투명하게 만들어 배경 그라데이션이 보이게 함. */
    color: transparent;
    /* 'rainbow-flow' 애니메이션을 5초 동안 선형적으로 무한 반복. */
    animation: rainbow-flow 5s linear infinite;
}
@keyframes rainbow-flow {
    to {
        /* 배경의 위치를 200% 이동시켜 색상이 흐르는 효과. */
        background-position: -200% center;
    }
}
