/* Button Animations - Premium Collection */

/* Utility for Modal Cards */
.hover-shadow {
    transition: all 0.3s ease;
}

.hover-shadow:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
    border-color: var(--brand-300) !important;
}

/* Base Button Settings */
.btn {
    position: relative;
    z-index: 1;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 1. None - Strictly Static */
.btn.btn-anim-none {
    transition: none !important;
    transform: none !important;
    box-shadow: none !important;
    animation: none !important;
    overflow: hidden !important;
}

.btn.btn-anim-none::before,
.btn.btn-anim-none::after {
    display: none !important;
}

.btn.btn-anim-none:hover,
.btn.btn-anim-none:focus,
.btn.btn-anim-none:active {
    transform: none !important;
    box-shadow: none !important;
    outline: none !important;
    /* Allow BG change, but no movement */
}

/* 2. Glow */
.btn.btn-anim-glow {
    overflow: visible !important;
}

.btn.btn-anim-glow:hover {
    /* Override shadow-lg */
    box-shadow: 0 0 25px rgba(234, 88, 12, 0.8) !important;
    transform: translateY(-2px) !important;
}

/* 3. Slide Right (Arrow Reveal) */
.btn.btn-anim-slide-right {
    overflow: hidden !important;
    white-space: nowrap !important;
    /* Prevent text wrapping/height change */
}

.btn.btn-anim-slide-right span {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn.btn-anim-slide-right::after {
    content: "\f061";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn.btn-anim-slide-right:hover {
    padding-right: 3.5rem !important;
    padding-left: 2.5rem !important;
}

.btn.btn-anim-slide-right:hover span {
    transform: translateX(-5px);
    /* Move text left to make room */
}

.btn.btn-anim-slide-right:hover::after {
    right: 1.2rem !important;
    opacity: 1 !important;
}

/* 4. Neon */
.btn.btn-anim-neon {
    overflow: visible !important;
    border: 2px solid transparent !important;
}

.btn.btn-anim-neon:hover {
    background-color: white !important;
    color: var(--brand-600) !important;
    border-color: var(--brand-600) !important;
    box-shadow: 0 0 15px var(--brand-600), inset 0 0 10px var(--brand-600) !important;
}

/* 5. Pulse (Fixed Soft Ripple) */
.btn.btn-anim-pulse {
    position: relative;
    z-index: 1;
    overflow: visible !important;
}

.btn.btn-anim-pulse::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.7);
    opacity: 0;
    z-index: -1;
    transition: all 0.3s;
}

.btn.btn-anim-pulse:hover::before {
    animation: btn-pulse-soft 2s infinite cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* Keyframes remain effectively global or scoped by usage */
@keyframes btn-pulse-soft {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.7);
        opacity: 0.8;
    }

    70% {
        transform: scale(1.05);
        /* Slight expansion with shadow */
        box-shadow: 0 0 0 20px rgba(234, 88, 12, 0);
        opacity: 0;
    }

    100% {
        transform: scale(1.05);
        opacity: 0;
    }
}

/* 6. Border Flow */
.btn.btn-anim-border-flow {
    overflow: hidden !important;
}

.btn.btn-anim-border-flow::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    /* Wider shine */
    height: 100%;
    background: linear-gradient(120deg,
            transparent,
            rgba(255, 255, 255, 0.7),
            transparent);
    transform: skewX(-25deg);
    transition: none;
}

.btn.btn-anim-border-flow:hover::before {
    left: 150%;
    transition: left 0.7s ease;
}

/* 7. Lift & Shadow */
.btn.btn-anim-lift {
    overflow: visible !important;
}

.btn.btn-anim-lift:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.4) !important;
}

/* 8. Fill Up */
.btn.btn-anim-fill-up {
    background: transparent !important;
    color: var(--brand-600) !important;
    border: 2px solid var(--brand-600) !important;
    overflow: hidden !important;
    z-index: 1;
}

.btn.btn-anim-fill-up::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0%;
    background-color: var(--brand-600);
    transition: height 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: -1;
}

.btn.btn-anim-fill-up:hover {
    color: white !important;
}

.btn.btn-anim-fill-up:hover::before {
    height: 100%;
}

/* 9. Expand Text */
.btn.btn-anim-tracking {
    letter-spacing: normal !important;
    transition: letter-spacing 0.3s ease !important;
}

.btn.btn-anim-tracking:hover {
    letter-spacing: 2px !important;
}