.wpa-test-msg{background: #d1ecf1 !important; border: 1px solid #bee5eb !important; border-radius: 5px !important;color: #0c5460 !important; font-size: 14px !important; padding:.75rem 1.25rem !important; font-family: Arial !important; margin-top:5px !important;}
span.wpa-button{ display: inline-block !important; padding-top: 5px !important; color: #fff !important;background-color: #6c757d !important;border-color: #6c757d !important; padding: 5px 10px !important; border-radius: 5px !important; margin-top:5px !important;  cursor: pointer !important; }
#altEmail_container, .altEmail_container{position:absolute !important; overflow: hidden !important; display: inline !important; height:1px !important; width: 1px !important;z-index:-1000 !important;}.producteurs-layout {
display: flex;
flex-wrap: wrap;
gap: 20px;
} .producteurs-sidebar {
flex: 0 0 200px;
}
.filter-title {
margin-top: 0;
font-family: Rubik;
font-size: 24px;
text-transform: uppercase;
font-weight: 700;
color:#225C54;
}
.producteurs-filter-vertical {
list-style: none;
padding: 0;
margin: 0;
}
.producteurs-filter-vertical li {
margin-bottom: 8px;
}
.producteurs-filter-vertical .filter-button {
display: block;
width: 100%;
text-align: left;
font-family: Rubik;
font-size: 16px;
font-weight: 500;
color: white;
background-color: #BF211E;
border: 0px;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s;
}
.producteurs-filter-vertical .filter-button:hover,
.producteurs-filter-vertical .filter-button.active {
background-color: #225C54;
color: white;
} .producteurs-content {
flex: 1;
min-width: 0; } .producteurs-grid {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
gap: 20px !important;
}
.producteur-title {
font-family: Rubik;
font-size: 24px;
font-weight: 700;
text-transform: uppercase;
color: #225C54;
margin-bottom: 5px;
}
.producteur-categories {
font-family: Rubik;
font-size: 16px;
font-weight: 500;
color: #BF211E;
margin-bottom: 20px;
} @media (max-width: 768px) {
.producteur-image-container {
height: 200px; }
.producteurs-layout {
flex-direction: column;
}
.producteurs-sidebar {
flex: 0 0 auto;
margin-bottom: 20px;
}
} .producteur-image-container {
width: 100%;
height: 300px; overflow: hidden;
position: relative;
border-radius: 5px; }
.producteur-image {
width: 100%;
height: 100%;
object-fit: cover; object-position: center; transition: transform 0.3s ease;
}
.producteur-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 105%;
background: rgba(180,0,0,0.7) !important;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity 0.3s ease;
}
.voir-profil {
background: #FCF0DA;
color: #225C54 !important;
padding: 10px 20px;
text-decoration: none;
border-radius:4px;
font-weight: bold;
transition: all 0.3s ease;
} .producteur-item:hover .producteur-overlay {
opacity: 1 !important;
}
.producteur-item:hover .voir-profil {
transform: translateY(0) !important;
}
.voir-profil:hover {
background-color: #225C54 !important;
color: #FCF0DA !important;
}