/* ===========================
   FoodStreetly Listing V2
=========================== */

:root{
    --primary:#ff6b00;
    --dark:#222;
    --light:#ffffff;
    --gray:#f5f5f5;
    --border:#e5e5e5;
    --success:#28a745;
}

body{
    background:#f8f9fa;
}

/* ===============================
FoodStreetly Listing V2 Hero
=============================== */


.listing-hero{
    position:relative;
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    margin-bottom:50px;
}


/* Cover */

.hero-cover{
    width:100%;
    height:300px;
    overflow:hidden;
    position:relative;
}


.hero-cover img{

    width:100%;
    height:300px;

    object-fit:cover;
    object-position:center;

    display:block;

}



/* Dark Overlay */

.hero-overlay{

    position:absolute;
    inset:0;

    background:
    linear-gradient(
        to bottom,
        rgba(0,0,0,.15),
        rgba(0,0,0,.75)
    );

}




/* Body */

.hero-body{

    position:relative;

    margin-top:-70px;

    padding:0 30px 30px;

}




/* Logo */

.hero-logo img{

    width:130px;
    height:130px;

    object-fit:cover;

    border-radius:50%;

    border:5px solid #fff;

    background:#fff;

    box-shadow:0 5px 20px rgba(0,0,0,.25);

}



/* Name */

.hero-info h1{

    font-size:32px;
    font-weight:700;

    margin-top:15px;

}



/* Buttons */

.hero-actions{

    display:flex;
    flex-wrap:wrap;
    gap:10px;

}


.action-btn{

    padding:10px 18px;

    border-radius:30px;

    background:#fff;

    color:#222;

    text-decoration:none;

    box-shadow:0 3px 10px rgba(0,0,0,.15);

}




/* Mobile */

@media(max-width:768px){


.hero-cover,
.hero-cover img{

    height:220px;

}


.hero-body{

    margin-top:-50px;

    padding:0 15px 20px;

}


.hero-logo img{

    width:100px;
    height:100px;

}


.hero-info h1{

    font-size:24px;

}


}
/* Facilities */

.listing-facilities .card{

    border:none;
    border-radius:18px;

}

.facility-card{

    display:flex;

    align-items:center;

    gap:15px;

    padding:15px;

    border-radius:14px;

    background:#fafafa;

    transition:.3s;

    border:1px solid #eee;

}

.facility-card:hover{

    transform:translateY(-3px);

    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.facility-icon{

    width:50px;
    height:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#fff4eb;

    font-size:24px;

}
/* ==========================
   Reviews
========================== */

.listing-reviews .card{

    border-radius:18px;

}

.review-item:last-child hr{

    display:none;

}

.review-item h6{

    font-weight:600;

}

.review-item p{

    line-height:1.7;

}

.review-item{

    transition:.3s;

}

.review-item:hover{

    transform:translateX(4px);

}
/*==============================
Reviews
==============================*/

.listing-reviews .card{

    border-radius:18px;

}

.review-item{

    padding:10px 0;

}

.review-stars{

    font-size:18px;

    margin-top:4px;

}

.review-item p{

    color:#555;

    line-height:1.7;

}
/*==================================
Interactive Rating Stars
==================================*/

.rating-group{
    display:flex;
    flex-direction:row-reverse;
    justify-content:flex-end;
}

.rating-group input{
    display:none;
}

.rating-group label{
    font-size:34px;
    color:#ddd;
    cursor:pointer;
    transition:.2s;
    padding-right:5px;
}

/* Hover */

.rating-group label:hover,
.rating-group label:hover ~ label{
    color:#ffc107;
}

/* Selected */

.rating-group input:checked ~ label{
    color:#ffc107;
}