/* =====================================================================
   IMMO-2026.11.02-02  —  style_espace_ecovacances.css
   Habillage EcoVacances des pages de l'application (espace annonceur,
   connexion). Chargee par I_Header.php EN DERNIER, uniquement quand
   marqueCourante() vaut 'ecovacances' : elle n'existe pas pour
   ImmoKitLoc, d'ou l'absence de prefixe de portee.
   Ne touche que le cadre (fond, polices, entete, pied, connexion,
   boutons principaux, titres des cartes). Les ecrans internes gardent
   leurs feuilles et sont repris au fil de l'eau si besoin.
   Couleurs : charte EcoVacances (voir style_site_public.css, --eco-*).
   ---------------------------------------------------------------------
   Historique (anti-chronologique) :
   - 2026.11.02-02 : ligne "+ Ajouter une annonce" en tete du menu
                     "Mon espace" (.menu-ajout).
   - 2026.11.02-01 : menu deroulant "Mon espace" de l'entete
                     (.eco-menu-compte, .eco-menu-liste, .eco-menu-sortie),
                     meme rendu que sur les pages publiques du portail.
   - 2026.10.29-01 : listes (style_listes.css) et cartes des logements
                     (style_liste_logement.css) aux couleurs EcoVacances :
                     titre de page, statut "Actif" en vert pin, carte
                     d'ajout et boutons en terre cuite, tableaux, filtres.
   - 2026.10.27-02 : lien "Supprimer mon compte" (pied secondaire de
                     l'espace) lisible sur le pied sombre.
   - 2026.10.27-01 : creation.
   ===================================================================== */

:root {
    --eco-encre: #2B2420;
    --eco-encre-sombre: #1E1916;
    --eco-texte: #3E3530;
    --eco-texte-doux: #6B5D52;
    --eco-terre: #B5532E;
    --eco-terre-fonce: #9A4424;
    --eco-terre-clair: #E07A52;
    --eco-terre-pale: #F6E3D8;
    --eco-pin: #1F4D3A;
    --eco-pin-pale: #DCEBE2;
    --eco-creme: #FBF6EE;
    --eco-sable: #F4EADB;
    --eco-ligne: #E8DDCD;
    --eco-champ: #D9CBB7;
    --eco-police-titre: 'Fraunces', Georgia, serif;
    --eco-police-texte: 'Manrope', system-ui, sans-serif;
}

/* ── Fond et typographie ─────────────────────────────────────────── */
body {
    background: var(--eco-creme);
    color: var(--eco-texte);
    font-family: var(--eco-police-texte);
}
h1, h2, h3,
.user-title,
.auth-title {
    font-family: var(--eco-police-titre);
    color: var(--eco-encre);
    letter-spacing: -0.01em;
}

/* ── Entete (I_MenuEcoVacances.php) ──────────────────────────────── */
header {
    background: var(--eco-creme);
    box-shadow: none;
    border-bottom: 1px solid var(--eco-ligne);
}
nav.eco-entete {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 28px;
    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
    padding: 14px 24px;
    background: transparent;
    border-bottom: none;
}
.eco-entete-logo { display: flex; align-items: center; }
.eco-entete-logo img { display: block; height: 38px; width: auto; }

.eco-entete-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 22px;
}
.eco-entete-menu a {
    color: var(--eco-texte-doux);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
}
.eco-entete-menu a:hover { color: var(--eco-encre); }

.eco-entete-compte {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 16px;
}
.eco-entete-nom {
    color: var(--eco-encre);
    font-weight: 700;
    font-size: 15px;
}
.eco-entete-sortie {
    color: var(--eco-terre-fonce);
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
}
.eco-entete-sortie:hover { color: var(--eco-encre); }
.eco-entete-publier {
    padding: 10px 16px;
    border-radius: 10px;
    background: var(--eco-terre);
    color: var(--eco-creme);
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    white-space: nowrap;
}
.eco-entete-publier:hover { background: var(--eco-terre-fonce); color: var(--eco-creme); }

/* Menu "Mon espace" (<details>) : bouton .eco-entete-publier, liste
   ouverte dessous, alignee a droite. Meme rendu que .pt-menu-compte des
   pages publiques (style_site_public.css). */
.eco-menu-compte { position: relative; }
.eco-menu-compte summary.eco-entete-publier {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    list-style: none;
}
.eco-menu-compte summary.eco-entete-publier::-webkit-details-marker { display: none; }
.eco-menu-compte summary.eco-entete-publier::after {
    content: "";
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .15s ease;
}
.eco-menu-compte[open] summary.eco-entete-publier::after { transform: translateY(1px) rotate(-135deg); }
.eco-menu-compte[open] summary.eco-entete-publier { background: var(--eco-terre-fonce); }

.eco-menu-liste {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 50;
    min-width: 220px;
    padding: 6px;
    border: 1px solid var(--eco-ligne);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(43, 36, 32, .14);
}
.eco-menu-liste a {
    display: block;
    padding: 10px 14px;
    border-radius: 8px;
    color: var(--eco-encre);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.eco-menu-liste a:hover,
.eco-menu-liste a:focus-visible { background: var(--eco-sable); }
.eco-menu-liste a.menu-ajout {
    margin-bottom: 4px;
    border-bottom: 1px solid var(--eco-ligne);
    border-radius: 8px 8px 0 0;
    color: var(--eco-terre);
    font-weight: 700;
}
.eco-menu-liste a.eco-menu-sortie {
    margin-top: 4px;
    border-top: 1px solid var(--eco-ligne);
    border-radius: 0 0 8px 8px;
    color: var(--eco-texte-doux);
    font-weight: 500;
}

@media (max-width: 640px) {
    /* Logo (symbole) et compte sur la 1re ligne, menu en dessous. */
    nav.eco-entete { padding: 12px 16px; gap: 10px 16px; }
    .eco-entete-logo img { width: 38px; height: 38px; }
    .eco-entete-menu { order: 3; flex-basis: 100%; gap: 6px 18px; }
    .eco-masque-mobile { display: none; }
}

/* ── Pied (I_PiedEcoVacances.php) ────────────────────────────────── */
footer {
    background: var(--eco-encre-sombre);
    color: #C9BBAA;
}
.eco-pied {
    max-width: 1140px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.eco-pied-logo { display: block; height: 32px; width: auto; }
.eco-pied-liens {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 22px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.eco-pied-liens a { color: #E3D6C2; text-decoration: none; font-size: 0.9em; }
.eco-pied-liens a:hover { color: var(--eco-creme); }
footer p,
.eco-pied p { color: #C9BBAA; }
footer a { color: #E3D6C2; }
footer .account-secondary-actions { margin-top: 16px; text-align: center; }
footer a.account-delete-link { color: #C9BBAA; font-size: 0.85em; text-decoration: underline; }
footer a.account-delete-link:hover { color: var(--eco-terre-clair); }

/* ── Connexion (I_ConnexionUtilisateur.php) ──────────────────────── */
.auth-container {
    background: #FFFFFF;
    border: 1px solid var(--eco-ligne);
    border-radius: 18px;
    box-shadow: 0 2px 10px rgba(43, 36, 32, .07), 0 12px 30px rgba(43, 36, 32, .06);
}
.auth-title { margin-bottom: 8px; }
.auth-title:after { background: var(--eco-terre); }
.auth-sous-titre {
    text-align: center;
    color: var(--eco-texte-doux);
    margin: 0 0 24px;
}
.form-group label { color: var(--eco-encre); font-weight: 600; }
.form-group input {
    border-color: var(--eco-champ);
    border-radius: 10px;
    font-family: inherit;
}
.form-group input:focus {
    border-color: var(--eco-terre);
    box-shadow: 0 0 0 3px rgba(181, 83, 46, .18);
}
.auth-button {
    background: var(--eco-terre);
    border-radius: 10px;
    font-family: inherit;
    font-weight: 700;
}
.auth-button:hover { background: var(--eco-terre-fonce); }
.auth-links a,
.switch-link a { color: var(--eco-terre-fonce); font-weight: 700; }
.switch-link { color: var(--eco-texte-doux); }
.form-message { color: var(--eco-pin); }

/* ── Espace : titres, cartes et boutons principaux ───────────────── */
body .user-card h2 { color: var(--eco-encre); }
body .btn-submit,
body .btn-ajouter,
body .subscription-button.prolong-button {
    background: var(--eco-terre);
    color: var(--eco-creme);
    border-color: var(--eco-terre);
    border-radius: 10px;
}
body .btn-submit:hover,
body .btn-ajouter:hover,
body .subscription-button.prolong-button:hover {
    background: var(--eco-terre-fonce);
    border-color: var(--eco-terre-fonce);
    color: var(--eco-creme);
}
body .badge-actif { color: var(--eco-pin); }
body .msg-success { color: var(--eco-pin); }

/* Carte d'appel vers ImmoKitLoc (I_EspaceUtilisateur.php, annonceur) */
.eco-carte-immokitloc {
    background: var(--eco-sable);
    border: 1px solid var(--eco-ligne);
}
.eco-carte-immokitloc ul { margin: 8px 0 14px; padding-left: 20px; }

/* ── Listes (style_listes.css) ───────────────────────────────────── */
.entete { border-bottom-color: var(--eco-ligne); }
.titre-page {
    font-family: var(--eco-police-titre);
    color: var(--eco-encre);
    font-weight: 700;
    letter-spacing: -0.01em;
}
.liste-intro { color: var(--eco-texte-doux); text-align: center; }
.conteneur-listes {
    border: 1px solid var(--eco-ligne);
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(43, 36, 32, .06);
}
.tableau-listes th {
    background: var(--eco-sable);
    color: var(--eco-encre);
}
.tableau-listes th,
.tableau-listes td { border-bottom-color: var(--eco-ligne); }
.tableau-listes tr:hover { background: var(--eco-creme); }
.filtres-liste label { color: var(--eco-encre); }
.filtres-liste select { border-color: var(--eco-champ); border-radius: 8px; font-family: inherit; }
.filtres-reset { color: var(--eco-terre-fonce); }
.conteneur-listes .btn-ajouter-compact {
    background: var(--eco-terre);
    border-radius: 10px;
    font-weight: 700;
}
.conteneur-listes .btn-ajouter-compact:hover { background: var(--eco-terre-fonce); }
.icone-voir { color: var(--eco-pin); }
.icone-voir:hover { background: var(--eco-pin-pale); }

/* ── Cartes des logements (style_liste_logement.css) ─────────────── */
.llc-carte { border-color: var(--eco-ligne); }
.llc-carte:hover { border-color: var(--eco-champ); box-shadow: 0 10px 24px rgba(43, 36, 32, .12); }
.llc-carte:focus-visible { outline-color: var(--eco-terre); }
.llc-photo { background: var(--eco-sable); }
.llc-photo-vide { color: var(--eco-champ); }
.llc-statut-actif { color: var(--eco-pin); }
.llc-nom { font-family: var(--eco-police-titre); color: var(--eco-encre); font-size: 1rem; }
.llc-adresse,
.llc-meta { color: var(--eco-texte-doux); }
.llc-meta i { color: var(--eco-champ); }
.llc-ajout {
    border-color: var(--eco-champ);
    background: var(--eco-creme);
    color: var(--eco-terre-fonce);
    font-weight: 700;
}
.llc-ajout:hover { background: var(--eco-terre-pale); border-color: var(--eco-terre); }
.llc-vide { color: var(--eco-texte-doux); }
