/* CAMPUSSTAY GLOBAL MOTION V1 */

/* Smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Scroll reveal */
.cs-motion-on .cs-reveal {
    opacity: 0;
    translate: 0 16px;
    transition:
        opacity .58s cubic-bezier(.2,.75,.25,1),
        translate .58s cubic-bezier(.2,.75,.25,1);
    transition-delay: var(--cs-motion-delay, 0ms);
}

.cs-motion-on .cs-reveal.cs-visible {
    opacity: 1;
    translate: 0 0;
}

/* Cards */
:is(
    .card,
    .cs-room-card,
    .cs-help-card,
    .cs-role-card,
    .cs-market-stat,
    .cs-market-stat-card,
    .cs-about-mini-card,
    .cs-faq-item,
    .dashboard-card,
    .stat-card,
    .kpi-card
) {
    transition:
        translate .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

/* Buttons */
:is(
    .btn,
    .cs-login-submit,
    .cs-pw-submit,
    .cs-contact-submit,
    .cs-register-submit,
    .cs-card-btn,
    .cs-about-btn,
    .cs-reg3-fields button[type="submit"]
) {
    transition:
        translate .20s ease,
        box-shadow .20s ease,
        background-color .20s ease,
        border-color .20s ease,
        filter .20s ease;
}

/* Navigation */
.public-navbar .nav-link {
    transition:
        color .2s ease,
        background-color .2s ease;
}

/* Form controls */
:is(
    input:not([type="hidden"]),
    select,
    textarea
) {
    transition:
        border-color .20s ease,
        box-shadow .20s ease,
        background-color .20s ease;
}

/* Accessible keyboard focus */
:is(
    button,
    a,
    input,
    select,
    textarea
):focus-visible {
    outline-offset: 3px;
}

/* Desktop hover only */
@media (hover: hover) and (pointer: fine) {

    :is(
        .card,
        .cs-room-card,
        .cs-help-card,
        .cs-role-card,
        .cs-market-stat,
        .cs-about-mini-card,
        .dashboard-card,
        .stat-card,
        .kpi-card
    ):hover {
        translate: 0 -4px;
        box-shadow: 0 14px 30px rgba(16,54,113,.12);
    }

    :is(
        .btn,
        .cs-login-submit,
        .cs-pw-submit,
        .cs-contact-submit,
        .cs-register-submit,
        .cs-card-btn,
        .cs-about-btn,
        .cs-reg3-fields button[type="submit"]
    ):not(:disabled):hover {
        translate: 0 -2px;
    }

    :is(
        .btn,
        .cs-login-submit,
        .cs-pw-submit,
        .cs-contact-submit,
        .cs-register-submit
    ):not(:disabled):active {
        translate: 0 0;
        filter: brightness(.96);
    }

    tbody tr {
        transition: background-color .18s ease;
    }

    tbody tr:hover {
        background-color: rgba(29,105,222,.045);
    }
}

/* Mobile navigation entrance */
@keyframes cs-menu-entrance {
    from {
        opacity: 0;
        translate: 0 -7px;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}

@media (max-width: 991.98px) {
    .public-navbar #publicNavbar.show {
        animation: cs-menu-entrance .20s ease-out both;
    }
}

/* FAQ answer entrance */
@keyframes cs-answer-entrance {
    from {
        opacity: 0;
        translate: 0 -6px;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}

.cs-faq-item[open] .cs-faq-answer {
    animation: cs-answer-entrance .24s ease-out;
}

/* Small screen performance */
@media (max-width: 767.98px) {
    .cs-motion-on .cs-reveal {
        translate: 0 11px;
        transition-duration: .42s;
    }

    .cs-motion-on .cs-reveal.cs-visible {
        translate: 0 0;
    }
}

/* Accessibility: Reduce Motion */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto !important;
    }

    .cs-motion-on .cs-reveal,
    .cs-motion-on .cs-reveal.cs-visible {
        opacity: 1 !important;
        translate: none !important;
        transition: none !important;
    }

    .public-navbar #publicNavbar.show,
    .cs-faq-item[open] .cs-faq-answer {
        animation: none !important;
    }
}