@charset "UTF-8";

:root {
    --bs-black:black;
    --bs-white:white;
    --bs-pink: #DF4A7C;
    --bs-lightpink: #ff9ac7;
    --bs-lightpinkbody: #FAF1F5;
    --bs-lightgray: #f8f8f8;
    --bs-gray: #ccc;
    --bs-darkgray: #7d7c7c;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-md: 0.5rem;
    --bs-border-radius-lg: 1rem;
    --bs-border-radius-xl: 1.5rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-xxxl: 3rem;
}
/*  */
*, *::before, *::after {
    box-sizing: border-box;
}


/* ////////////////////////// login page ////////////////////////// */
.login-card {
    max-width: 30rem;
    margin: 7rem auto 5rem auto;
    padding: 2rem ;
    border-radius: var(--bs-border-radius-lg);
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    background: var(--bs-white);
}

.btn-login , .btn-login:hover{
    background-color: var(--bs-pink);
    width: 25%;
    border: none;
}

a{
    text-decoration: none;
}
/* ////////////////////////// login page ////////////////////////// */

.hero-gradient {
    background: linear-gradient(135deg, rgba(236,72,153,0.9) 0%, rgba(244,114,182,0.8) 100%);
}

@media (max-width: 596px) {
    
    .featured-listing{
        z-index:9999;
        margin-top:-28rem;
    }
}


.card-hover:hover {
    transform: translateY(-5px);
    /* box-shadow: 0 20px 25px -5px rgba(236, 72, 153, 0.2), 0 10px 10px -5px rgba(236, 72, 153, 0.04); */
}