/* ================================
APP WRAPPER
Break out of Ridhi container
================================ */

.wf-app{
position:relative;

width:100vw;
margin-left:calc(50% - 50vw);

display:block;

}

.wf-app *{
box-sizing:border-box;
}



/* ================================
FILTER
================================ */

.wf-filter{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:25px;
font-size:15px;
}

.wf-filter-track{
display:flex;
white-space:nowrap;
overflow-x:auto;
max-width:100%;
}

.wf-cat{
background:none!important;
border:none!important;
padding:0!important;
margin:0!important;
color:#000!important;
cursor:pointer;
font-weight:400;
}

.wf-cat.active{
font-weight:700;
}

.wf-sep{
padding:0 6px;
color:#000;
}

.wf-arrow{
background:none!important;
border:none!important;
color:#000!important;
font-size:18px;
cursor:pointer;
padding:0!important;
margin:0!important;
box-shadow:none!important;
user-select:none;
}



/* ================================
GRID
================================ */

.wf-requests-grid{

display:grid;

grid-template-columns:repeat(auto-fill,minmax(260px,1fr));

gap:24px;

width:100%;

max-width:1200px;
margin:0 auto;

padding:0 20px;

}



/* ================================
CARD
================================ */

.wf-request-card{

display:block;

background:#fff;

border-radius:18px;

overflow:hidden;

text-decoration:none;
color:#222;

box-shadow:0 8px 22px rgba(0,0,0,0.06);

transition:transform .15s ease;

}

.wf-request-card:hover{
transform:translateY(-4px);
}



/* ================================
IMAGE
================================ */

.wf-card-image{
width:100%;
height:200px;
overflow:hidden;
}

.wf-card-image img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}



/* ================================
CONTENT
================================ */

.wf-card-category{
font-size:13px;
color:#888;
padding:16px 18px 4px;
}

.wf-card-title{
font-size:18px;
font-weight:600;
padding:0 18px 8px;
}



/* ================================
META
================================ */

.wf-card-meta{

display:flex;
flex-wrap:wrap;
gap:10px;

font-size:13px;
color:#666;

padding:0 18px 18px;

}

.wf-card-meta span{
display:flex;
align-items:center;
gap:5px;
}



/* ================================
SINGLE REQUEST IMAGE
================================ */

.wf-request-image img{

width:100%;
max-height:420px;
object-fit:cover;

border-radius:12px;

margin-bottom:20px;

}



/* ================================
MOBILE
================================ */

@media (max-width:600px){

.wf-requests-grid{
gap:18px;
}

.wf-card-title{
font-size:16px;
}

.wf-card-meta{
font-size:12px;
gap:8px;
}

}
/* FIX FOOTER MENU BODY PADDING */

body{
padding-bottom:0 !important;
}

.wf-mobile-nav{
position:fixed;
bottom:0;
left:0;
right:0;
z-index:9999;
}
.wf-filter-arrow{
color:#000;
font-size:20px;
font-weight:600;
opacity:0.6;
cursor:pointer;
padding:0 6px;
user-select:none;
transition:opacity .2s ease;
}

.wf-filter-arrow:hover{
opacity:1;
}
.wf-distance{
color:#777;
font-size:12px;
}
