/**
 * Styles pour les shortcodes du plugin ingui-biens.
 * Ce fichier est charge automatiquement sur le front du site.
 *
 * Typographie : Rubik (chargee via Google Fonts au cas ou
 * le theme ne la charge pas deja).
 */

@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700&display=swap');

/* =========================
   STYLE A - Corps de texte
   16px / weight 400 / #191919
   ========================= */

body .ingui-bien-equipements,
body .ingui-bien-equipements li,
body .ingui-bien-georisques,
body .ingui-bien-georisques p,
body .ingui-bien-caracteristiques,
body .ingui-bien-caracteristiques ul,
body .ingui-bien-caracteristiques li,
body .ingui-bien-caracteristiques li strong,
body .ingui-bien-caracteristiques li * {
    font-family: 'Rubik', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: #191919 !important;
}

body .ingui-bien-caracteristiques li strong {
    font-weight: 500 !important;
}

/* =========================
   STYLE B - Titres & accents
   18px / weight 500 / #191919
   ========================= */

.ingui-bien-prix,
.ingui-bien-prix .ingui-prix-loyer,
.ingui-bien-prix .ingui-prix-vente,
.ingui-bien-prix .ingui-prix-demande,
.ingui-bien-prix .ingui-prix-charges,
.ingui-bien-localisation,
.ingui-bien-badge,
.ingui-bien-caracteristiques h3 {
    font-family: 'Rubik', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #191919;
}

/* Prix : valeur en bleu */
.ingui-bien-prix .ingui-prix-loyer,
.ingui-bien-prix .ingui-prix-vente,
.ingui-bien-prix .ingui-prix-demande,
.ingui-bien-prix .ingui-prix-charges {
    color: #2B659A !important;
}

/* =========================
   Surcharges specifiques
   ========================= */

/* Prix : loyer et charges sur la meme ligne */
.ingui-bien-prix .ingui-prix-loyer,
.ingui-bien-prix .ingui-prix-vente,
.ingui-bien-prix .ingui-prix-demande {
    display: inline;
    line-height: 1.3;
}

.ingui-bien-prix .ingui-prix-charges {
    display: inline;
    margin-left: 8px;
}

/* Caracteristiques : titre H3 */
.ingui-bien-caracteristiques h3 {
    margin: 20px 0 10px 0;
}

/* Caracteristiques : liste sans puces */
.ingui-bien-caracteristiques ul {
    list-style: none;
    padding: 0;
    margin: 0 0 16px 0;
}

.ingui-bien-caracteristiques li {
    padding: 4px 0;
}

.ingui-bien-caracteristiques li strong {
    margin-right: 6px;
}

/* Equipements : liste sur 2 colonnes avec coches */
.ingui-bien-equipements {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 24px;
}

.ingui-bien-equipements li {
    padding: 4px 0 4px 22px;
    position: relative;
}

.ingui-bien-equipements li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 4px;
    color: #2B659A;
    font-weight: 700;
}

@media (max-width: 600px) {
    .ingui-bien-equipements {
        grid-template-columns: 1fr;
    }
}

/* Badge Vendu/Loue */
.ingui-bien-badge {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: white;
}

.ingui-bien-badge-vendu {
    background-color: #d62828;
    color: white;
}

.ingui-bien-badge-loue {
    background-color: #f77f00;
    color: white;
}

/* Georisques : encadre avec barre bleue a gauche */
.ingui-bien-georisques {
    padding: 16px 20px;
    background: #f5f5f5;
    border-left: 4px solid #2B659A;
}

.ingui-bien-georisques p {
    margin: 0;
    font-style: italic;
}

.ingui-bien-georisques a {
    color: #2B659A;
    text-decoration: underline;
}

/* =========================
   Boutons pilule : Type & Surface
   Utilises sur les cards de la home
   ========================= */

.ingui-bien-type,
.ingui-bien-surface {
    display: inline-block;
    padding: 8px 22px;
    background-color: #2B659A;
    color: white !important;
    border-radius: 999px;
    font-family: 'Rubik', sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    margin: 4px 6px 4px 0;
    text-align: center;
    white-space: nowrap;
}

/* =========================
   Mobile : Type et Surface
   sur la meme ligne
   ========================= */

@media (max-width: 768px) {
    .ingui-bien-type,
    .ingui-bien-surface {
        margin: 4px 4px 4px 0;
    }
}

/* Boutons Type et Surface : toujours en ligne (responsive inclus) */
.ingui-bien-type + .ingui-bien-surface,
.ingui-bien-surface + .ingui-bien-type {
    display: inline-block;
    margin-left: 4px;
}