*{
margin:0;
padding:0;
box-sizing:border-box;
}


body{
font-family:Arial, Helvetica, sans-serif;
background:#f3f6f2;
color:#222;
}


a{
text-decoration:none;
color:#174d27;
}


/* Liens du menu */
.menu a,
#adminMenu a{
color:white;
}


/* Liens du footer */
footer a{
color:white;
}



/* ================= HEADER ================= */


.header{

background:#174d27;

color:white;

display:flex;

align-items:center;

justify-content:space-between;

padding:15px 40px;

gap:25px;

}



.logo img{

height:65px;

display:block;

}





.menu{

display:flex;

align-items:center;

justify-content:center;

gap:18px;

flex-wrap:wrap;

white-space:normal;

}



.menu a,
#adminMenu a{

color:white;

font-weight:bold;

font-size:14px;

display:flex;

align-items:center;

justify-content:center;

height:35px;

line-height:35px;

}



.menu a:hover,
#adminMenu a:hover{

color:#d79b28;

}



#adminMenu{

display:flex;

align-items:center;

height:35px;

}



#adminMenu a{

height:35px;

}



/* ================= HERO ================= */


.hero{

min-height:500px;

background:
linear-gradient(
rgba(0,0,0,0.45),
rgba(0,0,0,0.45)
),
url("../images/nature.jpg");

background-size:cover;

background-position:center;

display:flex;

justify-content:center;

align-items:center;

text-align:center;

color:white;

}



.hero-content{

width:90%;

max-width:1000px;

}



.hero h1{

font-size:55px;

margin-bottom:15px;

}



.hero p{

font-size:24px;

}



/* ================= RECHERCHE ================= */


.recherche-principale{

background:white;

padding:15px;

border-radius:15px;

display:flex;

gap:10px;

margin-top:30px;

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

}



.recherche-principale input,
.recherche-principale select{

height:50px;

padding:0 15px;

border:1px solid #ddd;

border-radius:8px;

font-size:15px;

}



.recherche-principale input:first-child{

flex:1;

}



.recherche-principale button{

background:#174d27;

color:white;

border:0;

border-radius:8px;

padding:0 25px;

font-weight:bold;

cursor:pointer;

}



/* ================= CATEGORIES ================= */


.categories-home{

padding:50px;

}



.categories-home h2,
.annonces-section h2{

text-align:center;

color:#174d27;

margin-bottom:35px;

font-size:30px;

}



.categories-grid{

display:grid;

grid-template-columns:repeat(6,1fr);

gap:20px;

}



.categories-grid a{

background:white;

padding:30px 10px;

border-radius:15px;

text-align:center;

font-weight:bold;

color:#174d27;

box-shadow:0 5px 15px rgba(0,0,0,0.1);

}



/* ================= ANNONCES ================= */


.section{

padding:50px;

}



.annonces{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
gap:20px;
}

.card{
background:white;
border-radius:16px;
overflow:hidden;
box-shadow:0 5px 20px rgba(0,0,0,0.12);
}

.card img{
width:100%;
height:150px;
object-fit:cover;
}


.card-content{

padding:25px;

}



.card h3{

color:#174d27;

margin:15px 0;

}



.prix{

font-size:28px;

font-weight:bold;

color:#d79b28;

}



.badge{

display:inline-block;

padding:7px 15px;

border-radius:20px;

font-weight:bold;

}



.premium{

background:#ffd966;

color:#604500;

}



.urgent{

background:#ff9999;

color:#700000;

}



.btn{

display:inline-block;

background:#174d27;

color:white;

padding:12px 20px;

border-radius:10px;

margin-top:15px;

font-weight:bold;

}



/* ================= FOOTER ================= */


footer{

background:#174d27;

color:white;

text-align:center;

padding:35px;

}



/* ================= MOBILE ================= */


@media(max-width:1100px){


.header{

flex-direction:column;

}


.menu{

width:100%;

overflow-x:hidden;

justify-content:center;

flex-wrap:wrap;

}


.categories-grid{

grid-template-columns:repeat(3,1fr);

}


}



@media(max-width:700px){


.header{

padding:15px;

}


.menu{

gap:15px;

}


.recherche-principale{

flex-direction:column;

}


.categories-grid{

grid-template-columns:repeat(2,1fr);

}


.hero h1{

font-size:35px;

}


}
.menu a,
#adminMenu a {
    color:white;
}

footer a {
    color:white;
}
/* Correction menu haut sur toutes les pages */

.header .menu a,
.header .menu a:visited,
.header #adminMenu a {

    color:white !important;

}
.header {
    background: #2e7d32;
    padding: 15px 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    align-items: center;
}

.menu a {
    color: white;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
}

.menu a:hover {
    text-decoration: underline;
}

#langSelector {
    background: #2e7d32;
    color: white;
    border: none;
    padding: 6px;
    border-radius: 5px;
}