/* ========================================
   Forooshkav motion system
   Presence & hierarchy — CSS-first, RTL-safe
   ======================================== */

:root {
    --fk-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --fk-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --fk-duration: 0.55s;
    --fk-duration-fast: 0.2s;
    --fk-duration-nav: 0.18s;
    --fk-reveal-distance: 16px;
    --fk-stagger: 0.08s;
}

/* --- Keyframes --- */
@keyframes fk-fade-up {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fk-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fk-dropdown-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fk-nav-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Immediate (above-the-fold) entrances --- */
.fk-animate-in {
    animation: fk-fade-up 0.55s var(--fk-ease) both;
}

.fk-animate-fade {
    animation: fk-fade-in 0.6s var(--fk-ease) both;
}

.fk-animate-delay-1 { animation-delay: calc(var(--fk-stagger) * 1); }
.fk-animate-delay-2 { animation-delay: calc(var(--fk-stagger) * 2); }
.fk-animate-delay-3 { animation-delay: calc(var(--fk-stagger) * 3); }
.fk-animate-delay-4 { animation-delay: calc(var(--fk-stagger) * 4); }
.fk-animate-delay-5 { animation-delay: calc(var(--fk-stagger) * 5); }
.fk-animate-delay-6 { animation-delay: calc(var(--fk-stagger) * 6); }

/* --- Scroll reveal (opt-in; JS adds .fk-reveal-visible) --- */
.fk-reveal {
    opacity: 0;
    transform: translateY(var(--fk-reveal-distance));
    transition:
        opacity var(--fk-duration) var(--fk-ease),
        transform var(--fk-duration) var(--fk-ease);
}

.fk-reveal.fk-reveal-visible {
    opacity: 1;
    transform: none;
}

.fk-reveal-fade {
    opacity: 0;
    transform: none;
    transition: opacity var(--fk-duration) var(--fk-ease);
}

.fk-reveal-fade.fk-reveal-visible {
    opacity: 1;
}

.fk-reveal-delay-1 { transition-delay: calc(var(--fk-stagger) * 1); }
.fk-reveal-delay-2 { transition-delay: calc(var(--fk-stagger) * 2); }
.fk-reveal-delay-3 { transition-delay: calc(var(--fk-stagger) * 3); }
.fk-reveal-delay-4 { transition-delay: calc(var(--fk-stagger) * 4); }
.fk-reveal-delay-5 { transition-delay: calc(var(--fk-stagger) * 5); }
.fk-reveal-delay-6 { transition-delay: calc(var(--fk-stagger) * 6); }

/* Stagger children that already have .fk-reveal */
.fk-stagger > .fk-reveal:nth-child(1) { transition-delay: 0s; }
.fk-stagger > .fk-reveal:nth-child(2) { transition-delay: calc(var(--fk-stagger) * 1); }
.fk-stagger > .fk-reveal:nth-child(3) { transition-delay: calc(var(--fk-stagger) * 2); }
.fk-stagger > .fk-reveal:nth-child(4) { transition-delay: calc(var(--fk-stagger) * 3); }
.fk-stagger > .fk-reveal:nth-child(5) { transition-delay: calc(var(--fk-stagger) * 4); }
.fk-stagger > .fk-reveal:nth-child(6) { transition-delay: calc(var(--fk-stagger) * 5); }
.fk-stagger > .fk-reveal:nth-child(7) { transition-delay: calc(var(--fk-stagger) * 6); }
.fk-stagger > .fk-reveal:nth-child(8) { transition-delay: calc(var(--fk-stagger) * 7); }

/* Soft lift on interactive cards / blocks (opt-in) */
.fk-hover-lift {
    transition:
        transform var(--fk-duration-fast) var(--fk-ease),
        border-color var(--fk-duration-fast) ease,
        box-shadow var(--fk-duration-fast) ease;
}

.fk-hover-lift:hover {
    transform: translateY(-2px);
}

/* --- Global interactive polish --- */

/* Buttons — subtle lift; skip auth-heavy custom pages fighting transforms */
.btn,
.btn-glow,
button[type="submit"]:not(.fk-no-motion),
input[type="submit"] {
    transition:
        transform var(--fk-duration-fast) var(--fk-ease),
        box-shadow var(--fk-duration-fast) var(--fk-ease),
        background-color var(--fk-duration-fast) ease,
        border-color var(--fk-duration-fast) ease,
        color var(--fk-duration-fast) ease,
        opacity var(--fk-duration-fast) ease;
}

.btn:hover:not(:disabled):not(.disabled),
.btn-glow:hover:not(:disabled) {
    transform: translateY(-1px);
}

.btn:active:not(:disabled):not(.disabled),
.btn-glow:active:not(:disabled) {
    transform: translateY(0);
}

.btn:focus-visible,
.btn-glow:focus-visible,
button:focus-visible,
a:focus-visible {
    outline: 2px solid rgba(239, 60, 63, 0.45);
    outline-offset: 2px;
}

/* Text links — color ease only (avoid layout shift) */
a:not(.btn):not(.btn-glow):not(.nav-link):not(.navbar-link):not(.navbar-brand):not(.dropdown-item):not(.page-link) {
    transition: color var(--fk-duration-fast) ease, opacity var(--fk-duration-fast) ease;
}

/* Navbar links */
#navbarTop.fk-nav,
#navbarTop {
    animation: fk-nav-in 0.45s var(--fk-ease) both;
}

#navbarTop .nav-link,
#navbarTop .navbar-link,
#navbarTop a.navbar-brand,
.navbar-top .nav-link,
.navbar-top .navbar-link {
    transition:
        color var(--fk-duration-fast) ease,
        background-color var(--fk-duration-fast) ease,
        border-color var(--fk-duration-fast) ease,
        opacity var(--fk-duration-fast) ease;
}

#navbarTop .fk-nav__links .nav-link::after {
    transition: transform var(--fk-duration-fast) var(--fk-ease);
}

#navbarTop .fk-nav__action,
#navbarTop .fk-nav__actions .navbar-link {
    transition:
        color var(--fk-duration-fast) ease,
        background-color var(--fk-duration-fast) ease,
        border-color var(--fk-duration-fast) ease,
        transform var(--fk-duration-fast) var(--fk-ease);
}

#navbarTop .fk-nav__action:hover,
#navbarTop .fk-nav__actions .navbar-link:hover,
#navbarTop .fk-nav__login:hover {
    transform: translateY(-1px);
}

/* Dropdown soft entrance when opened */
#navbarTop .dropdown-menu.show,
.navbar-top .dropdown-menu.show,
.navbar .dropdown-menu.show {
    animation: fk-dropdown-in var(--fk-duration-nav) var(--fk-ease-out) both;
}

/* Form focus — polish ring, no layout thrash */
.form-control,
input.form-control,
textarea.form-control,
select.form-control,
.form-control:focus {
    transition:
        border-color var(--fk-duration-fast) ease,
        box-shadow var(--fk-duration-fast) ease,
        background-color var(--fk-duration-fast) ease;
}

.form-control:focus {
    border-color: rgba(239, 60, 63, 0.55);
    box-shadow: 0 0 0 3px rgba(239, 60, 63, 0.12);
}

/* List / card soft hover (light; no bounce) */
.list-group-custom li,
.card-custom {
    transition: background-color var(--fk-duration-fast) ease, box-shadow var(--fk-duration-fast) ease;
}

/* Banner / carousel: never trap opacity if a reveal class is added by mistake */
.banner-strip .fk-reveal,
.carousel .fk-reveal {
    opacity: 1;
    transform: none;
    transition: none;
}

/* Login / auth: inherit focus & button basics only — no reveal opacity traps */
.auth-box .fk-reveal,
.login-page .fk-reveal,
body.login .fk-reveal {
    opacity: 1;
    transform: none;
    transition: none;
}

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

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .fk-reveal,
    .fk-reveal-fade,
    .fk-animate-in,
    .fk-animate-fade {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }

    .fk-hover-lift:hover,
    .btn:hover:not(:disabled):not(.disabled),
    .btn-glow:hover:not(:disabled),
    .help-item:hover {
        transform: none !important;
    }

    #navbarTop .dropdown-menu.show,
    .navbar-top .dropdown-menu.show,
    .navbar .dropdown-menu.show {
        animation: none !important;
    }

    #navbarTop.fk-nav,
    #navbarTop {
        animation: none !important;
    }

    #navbarTop .fk-nav__action:hover,
    #navbarTop .fk-nav__actions .navbar-link:hover,
    #navbarTop .fk-nav__login:hover {
        transform: none !important;
    }
}

html.fk-reduce-motion .fk-reveal,
html.fk-reduce-motion .fk-reveal-fade {
    opacity: 1;
    transform: none;
    transition: none;
}