/* Fichier : /assets/css/sections/annonces.css */

.rb-annonce-card {
    display: flex; /* Active le mode Flexbox */
    flex-direction: row; /* Aligne les enfants (photo et infos) côte à côte */
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

/* Conteneur de la photo (partie gauche) */
.rb-annonce-photo-wrapper {
    flex: 0 0 30%; /* Force la largeur à 1/3 du conteneur */
    min-width: 30%; /* Empêche le rétrécissement */
    background-color: #f0f0f0;
}

.rb-annonce-photo-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Garde le ratio de l'image sans la déformer */
}

/* Conteneur pour le texte (partie droite, 2/3) */
.rb-annonce-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    /* MODIFIÉ : On retire le padding pour que le badge puisse toucher le bord */
    padding: 0; 
}

/* Le badge de type d'annonce */
.rb-annonce-badge {
    /* MODIFIÉ : On retire les styles de "pilule" */
    background-color: #f1f1f1;
    color: #333;
    font-weight: bold;
    font-size: 0.8em;
    
    /* MODIFIÉ : On ajuste le padding et on aligne le texte à droite */
    padding: 8px 15px;
    text-align: right;

    /* MODIFIÉ : La magie des coins arrondis ! */
    /* top-left, top-right, bottom-right, bottom-left */
    border-radius: 0 12px 0 0; 
}

/* Le conteneur pour le nom et les détails */
.rb-annonce-details {
    /* NOUVEAU : On applique le padding ici */
    padding: 20px;

    /* NOUVEAU : On utilise flex pour centrer verticalement le texte dans l'espace restant */
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rb-annonce-details h3{
    margin: 0 0 8px 0;
    font-size: 1.2rem;
}

.rb-annonce-details p {
    margin: 0;
    font-size: 0.9em;
    line-height: 1.5;
    /* La ligne "color" a été supprimée pour permettre l'héritage */
}}