/* ==========================
   Search Form
========================== */

.rs-search-wrapper{
    max-width:100%;
    margin:0 auto;
}

#rs-search-form {

    display: grid;

    grid-template-columns: repeat(5,1fr);

    gap: 15px;

    margin-bottom: 25px;

    background: #ffffff;

    padding: 20px;

    border-radius: 50px;

    box-shadow: 0px 15px 10px #dfdfdf8c;

    border: 1px solid #dddddd;
}


#rs-search-form input {

    height: 52px;

    padding: 0 15px;

    border: 1px solid #ddd;

    border-radius: 50px;

    font-size: 15px;

    outline: none;

    transition: .3s;
}


#rs-search-form input:focus{
    border-color:#0066cc;
}

#rs-search-form button {

    height: 52px;

    background: #000033;

    color: #fff;

    border: none;

    border-radius: 50px;

    cursor: pointer;

    font-size: 16px;

    transition: .3s;
}


#rs-search-form button:hover{
    background:#084298;
}

/* ==========================
   Restaurant Grid
========================== */

#rs-results{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

/* ==========================
   Card
========================== */

.rs-card {

    background: #fff;

    border-radius: 30px;

    overflow: hidden;

    box-shadow: 0 8px 20px rgba(0,0,0,.08);

    transition: .3s;

    border: 1px solid #04053133 !important;
}


.rs-card:hover{

    transform:translateY(-6px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.rs-card-image{

    height:260px;

    overflow:hidden;

}

.rs-card-body {

    padding: 15px 30px 30px !important;
}


.rs-card-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.3s;

}

.rs-card:hover img{

    transform:scale(1.08);

}

.rs-card-body{

    padding:20px;

}

.rs-title {
    margin: 0px;
    font-size: 25px !important;
    font-weight: 600 !important;
}



.rs-title a{

    color:#222;

    text-decoration:none;

}

.rs-description {

    color: #666;

    line-height: 1.4;

    margin-bottom: 15px;

    min-height: 70px;

    font-size: 14px;
}


.rs-location {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 15px;
    font-size: 14px;
    color: #777;
}

.rs-location h2 {
    font-size: 18px !important;
    font-weight: 700 !important;
    height: 35px;
    margin-top: -10px;
}



.rs-location span {
    border: 1px solid #f3f3f3;
    padding: 10px 20px;
    width: 155px;
    border-radius: 20px;
    box-shadow: 0px 20px 10px #e7e7e78c;
    margin-right: 10px;
}



.rs-button {
    display: inline-block;
    background: #040531;
    color: #fff !important;
    text-decoration: none;
    padding: 12px 20px;
    border-radius: 50px;
    transition: .3s;
    width: 100% !important;
    text-align: center;
    margin-top: 10px;
}


.rs-button:hover{

    background:#084298;

    color:#fff;

}

/* ==========================
   No Result
========================== */

.restaurant-no-results {

    grid-column: 1/-1;

    background: #ffffff;

    border: 1px solid #ddd;

    padding: 80px;

    text-align: center;

    border-radius: 40px;
}


.restaurant-no-results h2 {

    font-size: 30px;

    margin: 0px;

    font-weight: 600;
}

.restaurant-no-results p{

    color:#666;

}

/* ==========================
   Responsive
========================== */

@media(max-width:992px){

#rs-results{

grid-template-columns:repeat(2,1fr);

}

#rs-search-form{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:767px){

#rs-results{

grid-template-columns:1fr;

}

#rs-search-form{

grid-template-columns:1fr;

}

}

/* Loading */

#rs-results.loading{

opacity:.5;

pointer-events:none;

position:relative;

}

#rs-results.loading:after{

content:"Searching...";

position:absolute;

top:20px;

right:20px;

background:#fff;

padding:10px 15px;

border-radius:8px;

box-shadow:0 5px 15px rgba(0,0,0,.15);

}

/* Active Tags */

#rs-active-filters{

margin:20px 0;

display:flex;

gap:10px;

flex-wrap:wrap;

}

.rs-tag {
    background: #000033;

    color: #fff;

    padding: 5px 25px;

    border-radius: 30px;

    font-size: 14px;

    display: flex;

    align-items: center;

    gap: 8px;
}


.rs-tag .remove{

cursor:pointer;

font-weight:bold;

}

/* Clear Button */

#clear-search{

background:#dc3545;

color:#fff;

border:none;

cursor:pointer;

}

#clear-search:hover{

background:#bb2d3b;

}