/* Custom CSS to override Bootstrap styles */

body {
    background-color: #fd9ed0 !important;
}

/* Custom btn-primary styling */
.btn-primary {
    background-color: #ff8fca !important;
    border-color: #ff8fca !important;
}

.btn-primary:hover {
    background-color: #e57bb5 !important;
    border-color: #e57bb5 !important;
}

.btn-primary:focus,
.btn-primary.focus {
    background-color: #e57bb5 !important;
    border-color: #e57bb5 !important;
    box-shadow: 0 0 0 0.25rem rgba(255, 143, 202, 0.5) !important;
}

.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
    background-color: #d96ba8 !important;
    border-color: #d96ba8 !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
    background-color: #ff8fca !important;
    border-color: #ff8fca !important;
    opacity: 0.65;
}

/* Falling hearts effect */
.heart {
    position: fixed;
    top: -50px;
    font-size: 20px;
    color: #ff8fca;
    pointer-events: none;
    z-index: 9999;
    animation: fall linear infinite;
    opacity: 0.8;
}

@keyframes fall {
    to {
        transform: translateY(100vh) rotate(360deg);
        opacity: 0;
    }
}