/* ==========================================================================
   Kit des espaces membres (11/09/2026)

   Un langage commun pour les pages de gestion : né de « Mes documents », repris
   page par page. Tout est préfixé `.li-es` — rien ne fuit hors des pages qui
   l'adoptent, et le header / le footer restent intacts.

   Univers Logement seul (staging, refonte R1 14/09/2026) : jetons framboise/or
   de la PROD par défaut (`.li-es--logement` conservé, mêmes valeurs). La marque Logement ne se retouche pas : on
   reprend ses jetons tels quels.
   ========================================================================== */

.li-es{
  --a:#EE3D6F; --a-d:#C92A58; --a-i:#3A1426; --a-s:#FFF1F5; --a-l:#F6D9E3;
  --a-g1:#EE3D6F; --a-g2:#D0861E;
  --es-ok:#1C7A4A; --es-oks:#E6F6EC; --es-am:#8A5A00; --es-ams:#FFF3D6; --es-bl:#1D4ED8; --es-bls:#E8F0FF;
  --es-mut:#6E6478; --es-r:22px;
  --es-sh:0 1px 2px rgba(58,20,38,.05),0 8px 24px -12px rgba(201,42,88,.16);
  color:var(--ink,#241726);
}
.li-es--logement{
  --a:var(--rasp,#EE3D6F); --a-d:#C92A58; --a-i:#3A1426; --a-s:#FFF1F5; --a-l:#F6D9E3;
  --a-g1:var(--rasp,#EE3D6F); --a-g2:#D0861E;
  --es-sh:0 1px 2px rgba(58,20,38,.05),0 8px 24px -12px rgba(201,42,88,.16);
}
.li-es *{box-sizing:border-box}
.li-es .li-es-h1,.li-es .li-es-sec__h h2{font-family:var(--serif,Georgia,serif);color:var(--a-i);letter-spacing:-.01em}

/* En-tête ---------------------------------------------------------------- */
.li-es-hero{position:relative;display:flex;gap:26px 36px;
  padding:clamp(22px,4vw,40px);margin:0 0 30px;border-radius:32px;overflow:hidden;
  background:radial-gradient(700px 320px at 100% 0%,color-mix(in srgb,var(--a) 20%,transparent),transparent 62%),
             radial-gradient(500px 260px at 0% 100%,rgba(208,134,30,.07),transparent 60%),
             linear-gradient(160deg,#FFFFFF,var(--a-s));
  border:1px solid var(--a-l);box-shadow:var(--es-sh)}
.li-es-hero--solo{grid-template-columns:1fr}
.li-es-eyebrow{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:.74rem;font-weight:800;
  letter-spacing:.05em;text-transform:uppercase;color:var(--a-d);background:var(--a-s);border:1px solid var(--a-l)}
.li-es-eyebrow--or{color:#8F5A0E;background:rgba(208,134,30,.13);border-color:rgba(208,134,30,.30)}
.li-es .li-es-h1{margin:12px 0 8px;font-size:clamp(2rem,4.2vw,2.9rem);line-height:1.04}
.li-es-lead{margin:0 0 20px;max-width:none;text-wrap:pretty;font-size:1.03rem;line-height:1.6;color:var(--es-mut)}
.li-es-cta{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.li-es-hero__txt{flex:1;min-width:0}
/* En flex, tout ce qui n'est ni le texte ni le visuel (compteurs, étapes…)
   passe sur sa propre ligne, pleine largeur — comme l'ancien grid-column:1/-1. */
.li-es-hero{flex-wrap:wrap}
.li-es-hero > :not(.li-es-hero__txt):not(.li-es-hero__side){flex:1 1 100%;min-width:0}
.li-es-hero__side{display:flex;flex:none;align-items:center;justify-content:flex-end}
.li-es-kpis{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.li-es-kpis--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.li-es-kpi{margin:0;padding:15px 18px;border-radius:18px;background:rgba(255,255,255,.88);border:1px solid var(--a-l);text-decoration:none!important;color:inherit;transition:transform .15s,box-shadow .15s}
a.li-es-kpi:hover{transform:translateY(-2px);box-shadow:var(--es-sh)}
.li-es-kpi dt,.li-es-kpi .li-es-kpi__l{display:block;font-size:.8rem;font-weight:600;color:var(--es-mut);line-height:1.3}
.li-es-kpi dd,.li-es-kpi .li-es-kpi__n{display:block;margin:6px 0 0;font-family:var(--serif,Georgia,serif);font-size:2.05rem;line-height:1;color:var(--a-i)}
.li-es-kpi--on{background:linear-gradient(135deg,var(--a-g1),var(--a-g2));border-color:transparent}
.li-es-kpi--on dt,.li-es-kpi--on .li-es-kpi__l{color:rgba(255,255,255,.86)}
.li-es-kpi--on dd,.li-es-kpi--on .li-es-kpi__n{color:#fff}

/* Illustration calendrier (réservations) */
.li-es-cal-art{position:relative;width:220px;height:190px}
.li-es-cal-art__p{position:absolute;inset:18px 10px 0 30px;border-radius:18px;background:#fff;border:1px solid var(--a-l);box-shadow:0 18px 36px -18px rgba(58,20,38,.4);transform:rotate(4deg)}
.li-es-cal-art__p::before{content:"";position:absolute;left:0;right:0;top:0;height:38px;border-radius:18px 18px 0 0;background:linear-gradient(135deg,var(--a-g1),var(--a-g2))}
.li-es-cal-art__g{position:absolute;left:18px;right:18px;top:52px;display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.li-es-cal-art__g i{height:17px;border-radius:5px;background:var(--a-s)}
.li-es-cal-art__g i.on{background:var(--a)}
.li-es-cal-art__g i.or{background:#F3C77A}
.li-es-cal-art__b{position:absolute;left:0;top:0;width:86px;height:64px;border-radius:14px;background:#fff;border:1px solid var(--a-l);box-shadow:0 10px 24px -12px rgba(58,20,38,.4);
  display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-7deg)}
.li-es-cal-art__b b{font-family:var(--serif,Georgia,serif);font-size:1.7rem;line-height:1;color:var(--a-i)}
.li-es-cal-art__b span{font-size:.7rem;font-weight:700;text-transform:uppercase;color:var(--a-d)}

/* Sections et groupes ------------------------------------------------------- */
.li-es-sec{margin:0 0 34px}
.li-es-sec__h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 14px}
.li-es .li-es-sec__h h2{margin:0;font-size:1.45rem}
.li-es-sec__h p{margin:0;color:var(--es-mut);font-size:.93rem}
.li-es-grp{margin:0 0 26px}
.li-es-grp__h{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--es-mut)}
.li-es-grp__h::after{content:"";flex:1;height:1px;background:var(--a-l)}
.li-es-grp__n{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--a-s);color:var(--a-d);font-size:.74rem;letter-spacing:0}
.li-es-grp--on .li-es-grp__h{color:var(--a-d)}
.li-es-grp--on .li-es-grp__n{background:var(--a);color:#fff}
details.li-es-grp > summary{list-style:none;cursor:pointer}
details.li-es-grp > summary::-webkit-details-marker{display:none}
details.li-es-grp > summary .li-es-grp__chev{margin-left:4px;transition:transform .2s}
details.li-es-grp[open] > summary .li-es-grp__chev{transform:rotate(180deg)}

/* Pastilles, boutons, états ------------------------------------------------- */
.li-es-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font-size:.76rem;font-weight:700;white-space:nowrap}
.li-es-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.li-es-pill--att{background:var(--es-ams);color:var(--es-am)}
.li-es-pill--ok{background:var(--es-oks);color:var(--es-ok)}
.li-es-pill--ko{background:#F2F0F5;color:#5E5668}
.li-es-pill--info{background:var(--es-bls);color:var(--es-bl)}
.li-es-pill--a{background:var(--a);color:#fff}
.li-es-btn{display:inline-flex;align-items:center;gap:.5em;padding:12px 20px;border-radius:999px;border:0;background:linear-gradient(135deg,var(--a-g1),var(--a-g2));
  color:#fff!important;font-weight:700;font-size:.95rem;text-decoration:none!important;box-shadow:0 8px 20px -8px color-mix(in srgb,var(--a-d) 60%,transparent);transition:transform .15s}
.li-es-btn:hover{transform:translateY(-1px)}
.li-es-btn--ghost{background:#fff;color:var(--a-d)!important;box-shadow:inset 0 0 0 1.5px var(--a-l)}
.li-es-btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--a)}
.li-es-calme{display:flex;align-items:center;gap:12px;margin:0;padding:16px 18px;border-radius:18px;background:var(--es-oks);color:var(--es-ok);font-weight:600}
.li-es-av{width:28px;height:28px;border-radius:50%;flex:none;display:inline-grid;place-items:center;font-size:.7rem;font-weight:800;color:var(--a-d);
  background:linear-gradient(135deg,var(--a-s),var(--a-l));vertical-align:middle}

@media (max-width:900px){
  .li-es-hero{grid-template-columns:1fr}.li-es-hero__side{display:none}
  .li-es-kpis,.li-es-kpis--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .li-es-hero{border-radius:24px}
  .li-es-kpi dd,.li-es-kpi .li-es-kpi__n{font-size:1.7rem}
}

/* Notifications (11/09/2026) --------------------------------------------- */
.li-es.li-nc{max-width:none}
.li-es .li-nc-hero{margin-bottom:22px}
.li-nc-hero__mail{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;padding:6px 13px;border:1px solid var(--a-l);border-radius:999px;background:#fff;font-size:.84rem;color:var(--a-i)}
.li-nc-hero__mail i{color:var(--a)}
.li-nc-art{position:relative;width:220px;height:190px}
.li-nc-art__cloche{position:absolute;left:20px;top:30px;display:flex;align-items:center;justify-content:center;width:92px;height:92px;border-radius:28px;
  background:linear-gradient(135deg,var(--a-g1),var(--a-g2));box-shadow:0 18px 34px -16px var(--a-d);transform:rotate(-8deg);font-size:2.3rem}
.li-nc-art__cloche i{color:#fff}
.li-nc-art__cloche b{position:absolute;top:-8px;right:-8px;min-width:30px;height:30px;padding:0 7px;border-radius:999px;background:#fff;color:var(--a-d);
  font:800 .9rem/30px Inter,system-ui,sans-serif;text-align:center;box-shadow:0 6px 14px -6px rgba(0,0,0,.3)}
.li-nc-art__l{position:absolute;left:96px;height:30px;border-radius:12px;background:#fff;border:1px solid var(--a-l);box-shadow:0 10px 22px -16px rgba(201,42,88,.5)}
.li-nc-art__l::before{content:"";position:absolute;left:10px;top:10px;width:10px;height:10px;border-radius:50%;background:var(--a)}
.li-nc-art__l--1{top:62px;width:118px}
.li-nc-art__l--2{top:104px;width:96px;opacity:.85}
.li-nc-art__l--3{top:146px;width:74px;opacity:.6}

/* Onglets : même barre que les autres espaces. */
.li-es .li-nc__tabs{display:flex;width:max-content;max-width:100%;margin:0 auto 20px;padding:5px;gap:4px;border:1px solid var(--a-l);border-radius:18px;
  background:rgba(255,255,255,.7);box-shadow:var(--es-sh);overflow-x:auto}
.li-es .li-nc__tab{border:0!important;border-radius:13px!important;padding:9px 18px!important;background:none!important;color:var(--es-mut)!important;font-weight:700;white-space:nowrap;box-shadow:none!important}
.li-es .li-nc__tab.is-active{background:linear-gradient(135deg,var(--a-g1),var(--a-g2))!important;color:#fff!important;box-shadow:0 6px 16px -8px var(--a-d)!important}
.li-es .li-nc__tab.is-active .li-nc__tabcount{background:#fff;color:var(--a-d)}

/* Boîte : intertitres de temps, lignes en cartes. */
.li-es .li-nc__items{display:flex;flex-direction:column;gap:8px;border:0;background:none;box-shadow:none;padding:0}
.li-es .li-nc__jour{list-style:none;margin:14px 0 2px;padding:0 4px;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--es-mut)}
.li-es .li-nc__jour:first-child{margin-top:0}
.li-es .li-nc__item{list-style:none;border:1px solid var(--a-l);border-radius:16px;background:#fff;overflow:hidden;transition:box-shadow .15s,border-color .15s}
.li-es .li-nc__item:hover{border-color:color-mix(in srgb,var(--a) 45%,var(--a-l));box-shadow:0 10px 24px -16px rgba(201,42,88,.45)}
.li-es .li-nc__item.is-unread{background:var(--a-s)} /* 14/09 : non lu = fond teinté + pastille, rien d'autre */
.li-es .li-nc__link{border:0!important;background:none!important}
.li-es .li-nc__title{color:var(--a-i)}
.li-es .li-nc__time{color:var(--es-mut)}
.li-es .li-nc__actions{display:flex;justify-content:flex-end;margin:0 0 10px}
.li-es .li-nc__empty{border:1px dashed var(--a-l);border-radius:20px;background:#fff}

/* Préférences : cartes. */
.li-es .li-nc__push{border:1px solid var(--a-l);border-radius:18px;background:#fff;box-shadow:var(--es-sh)}
.li-es .li-nc__form{border:1px solid var(--a-l);border-radius:22px;background:#fff;box-shadow:var(--es-sh);padding:20px 22px}
.li-es .li-nc__matrix thead th{font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;color:var(--es-mut)}
.li-es .li-nc__matrix-cat{color:var(--a-i)}
.li-es .li-nc__matrix tbody tr:hover{background:#FBF9FF}
.li-es .li-qp__submit{background:linear-gradient(135deg,var(--a-g1),var(--a-g2))!important;border:0!important;color:#fff!important}
.li-page:has(> .li-nc.li-es){max-width:none}
.li-nc-art__cloche i.hp-icon{font-size:2.4rem!important;width:auto!important;height:auto!important;line-height:1!important}
.li-es .li-nc__form.li-qp{max-width:none;margin-left:0;margin-right:0}
/* Notifications — archivage (11/09/2026). */
.li-es .li-nc__item{position:relative}
.li-es .li-nc__item .li-nc__link{padding-right:78px}
.li-nc__arch{position:absolute;top:50%;right:40px;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;
  border:1px solid transparent;border-radius:50%;background:transparent;color:var(--es-mut,#6E6478);cursor:pointer;opacity:.55;transition:opacity .15s,background .15s,border-color .15s}
.li-es .li-nc__item:hover .li-nc__arch,.li-nc__arch:focus-visible{opacity:1}
.li-nc__arch:hover{background:#fff;border-color:var(--a-l);color:var(--a-d)}
.li-nc__arch--back{font-size:1rem;font-weight:800;opacity:.9}
@media (hover:none){.li-nc__arch{opacity:.9}}
.li-es .li-nc__actions{gap:8px;flex-wrap:wrap}
.li-es .li-nc__actions--ar{justify-content:space-between;align-items:center}
.li-nc__retour{font-weight:700;color:var(--a-d)}
.li-nc__ar-note{font-size:.84rem;color:var(--es-mut)}
.li-nc__voir-ar{margin:16px 0 0;text-align:center;font-size:.9rem}
.li-nc__voir-ar a{color:var(--a-d);font-weight:700}

/* Mes annonces / Mes lieux (/compte/listings/, 11/09/2026) --------------- */
.hp-page__content:has(.li-myl-es) > .hp-page__title{display:none}
.li-myl-es .li-myl-hero{margin:6px 0 22px}
.li-myl-es .li-es-hero{grid-template-columns:1fr}
.li-myl-es .li-es-hero__side{display:none}
/* Ordre de lecture de /compte/listings/ (11/09/2026) : l'en-tête et les annonces
   d'abord, les encarts commerciaux et d'aide ensuite. On réordonne les blocs frères
   produits par d'autres modules sans toucher à ces modules. */
.hp-page__content:has(> .li-myl-es){display:flex;flex-direction:column}
.hp-page__content:has(> .li-myl-es) > *{order:5}
.hp-page__content:has(> .li-myl-es) > .li-myl-es{order:0}
.hp-page__content:has(> .li-myl-es) > .li-note{order:1}
.hp-page__content:has(> .li-myl-es) > .li-onb{order:2}
.hp-page__content:has(> .li-myl-es) > .li-upsell{order:7;margin-top:10px}
.hp-page__content:has(> .li-myl-es) > .li-res{order:8;margin-top:36px} /* 22/09 : décollé des Archives */
.hp-page__content:has(> .li-myl-es) > .li-plans{order:9}
.hp-page__content:has(> .li-myl-es) > script{order:10}

/* Mon abonnement (11/09/2026) ------------------------------------------- */
.li-es.li-abo-es{max-width:none}
.li-abo-es .li-abo-es__hero{grid-template-columns:1fr;margin:0 0 24px}
.li-abo-es .li-es-hero__side{display:none}
.li-abo-es .li-abo-es__v{font-size:1.35rem!important;line-height:1.15!important}
.li-abo-es .li-es-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:720px){.li-abo-es .li-es-kpis{grid-template-columns:1fr}}

/* Le titre « Mon abonnement » du module fait doublon avec l'en-tête. */
.li-abo-es .li-abo-h-masque{display:none} /* 22/09 : masque l'ancien titre par sa classe (plus « le premier titre venu ») */
.li-abo-es .li-abo-card,.li-abo-es .li-ref-stat,.li-abo-es .li-more-card{border-radius:20px}
.li-abo-es .li-abo-es__or{background:linear-gradient(135deg,#E9A53C,#C77A12);border-color:transparent;box-shadow:0 12px 26px -14px rgba(199,122,18,.7)}
.li-abo-es .li-abo-es__or .li-es-kpi__l,.li-abo-es .li-abo-es__or .li-es-kpi__n{color:#fff}

/* Mon profil (/compte/settings/, 11/09/2026) ----------------------------- */
.hp-page__content:has(> .li-pf-es){display:flex;flex-direction:column}
.hp-page__content:has(> .li-pf-es) > *{order:5}
.hp-page__content:has(> .li-pf-es) > .li-pf-es{order:0}
.hp-page__content:has(> .li-pf-es) > .hp-page__title{display:none}
.hp-page__content:has(> .li-pf-es) > .li-verif-cta{order:1}
/* Exception (17/09) : l'en-tête « Mon profil » garde sa grille — identité à
   gauche, cases (profil complété, identité, membre depuis) en colonne à droite. */
.li-pf-es .li-pf-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;margin:6px 0 20px}
.li-pf-id{display:flex;align-items:center;gap:18px;margin:0 0 12px}
.li-pf-av{flex:none;display:flex;align-items:center;justify-content:center;width:84px;height:84px;border-radius:50%;overflow:hidden;
  background:var(--a-s);border:3px solid #fff;box-shadow:0 10px 24px -12px rgba(0,0,0,.35);font:800 1.6rem/1 var(--serif,Georgia,serif);color:var(--a-d)}
.li-pf-av img{width:100%;height:100%;object-fit:cover}
.li-pf-es .li-pf-id .li-es-h1{margin:6px 0 0}
.li-pf-nom{margin:2px 0 0;font-weight:700;color:var(--a-i)}
.li-pf-es .li-es-kpis{grid-column:auto;grid-template-columns:1fr;align-content:center}
.li-pf-es .li-pf-v{font-size:1.3rem!important}
.li-pf-bar{display:block;height:7px;margin:10px 0 0;border-radius:9px;background:var(--a-l);overflow:hidden}
.li-pf-bar i{display:block;height:100%;width:0;border-radius:9px;background:linear-gradient(90deg,var(--a-g1),var(--a-g2));transition:width .3s}
.li-es-kpi--on .li-pf-bar{background:rgba(255,255,255,.35)}
.li-es-kpi--on .li-pf-bar i{background:#fff}
@media (max-width:860px){.li-pf-es .li-pf-hero{grid-template-columns:1fr}}
/* Formulaire : cartes par section + sommaire. Couleur de l'univers via le corps. */
.li-pf-nav{position:sticky;top:78px;z-index:6;display:flex;gap:6px;overflow-x:auto;margin:0 0 16px;padding:6px;border-radius:16px;
  background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #EFE6EA;box-shadow:0 8px 20px -16px rgba(0,0,0,.3)}
.li-pf-nav a{flex:none;padding:7px 13px;border-radius:11px;font-size:.84rem;font-weight:700;color:#5d4a55;text-decoration:none;white-space:nowrap}
.li-pf-nav a:hover{background:#FBF4F6}
.li-pf-nav a.is-active{background:var(--a-s,#FFF1F5);color:var(--a-d,#C92A58)}
.li-pf-nav{scrollbar-width:none}.li-pf-nav::-webkit-scrollbar{display:none}
.li-pf-card{margin:0 0 16px;padding:20px 22px;border:1px solid #EFE6EA;border-radius:22px;background:#fff;box-shadow:0 1px 2px rgba(58,20,38,.04),0 8px 24px -14px rgba(201,42,88,.14);scroll-margin-top:150px}
.li-pf-card > .li-sec{margin-top:0!important}
.li-pf-card > .hp-form__field:last-child{margin-bottom:0}
/* Barre d'enregistrement du profil : plus de bandeau blanc — seul le bouton
   flotte, centré, comme les pastilles flottantes du site (demande 16/09, reposé
   le 17/09 après écrasement). Le formulaire réserve la place dessous pour qu'il
   ne recouvre jamais un intertitre. */
.hp-form--user-update .hp-form__footer{position:sticky;bottom:16px;z-index:3;margin-top:16px;padding:0;
  justify-content:center;background:none;box-shadow:none;border-radius:0;
  -webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none}
.hp-form--user-update .hp-form__footer > *{pointer-events:auto}
.hp-form--user-update .hp-form__footer .hp-form__button{box-shadow:0 12px 30px -12px rgba(201,42,88,.55),0 2px 8px rgba(58,20,38,.12)}
/* Mon abonnement — panneau « Gérer mon abonnement » (11/09/2026). */
.li-abo-acts{margin:0 0 26px;scroll-margin-top:100px}
.li-es .li-abo-acts__h{margin:0 0 12px;font-family:var(--serif,Georgia,serif);font-size:1.4rem;color:var(--a-i)}
.li-abo-acts__g{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:12px}
.li-abo-act{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px 14px;padding:14px 16px;border:1px solid var(--a-l);border-radius:18px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.li-abo-act__i{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:var(--a-s);color:var(--a-d)}
.li-abo-act__t{display:flex;flex-direction:column;gap:2px;min-width:0}
.li-abo-act__t strong{color:var(--a-i);font-size:.96rem}
.li-abo-act__t span{font-size:.84rem;line-height:1.45;color:var(--es-mut)}
.li-abo-act__b{flex:none;padding:8px 14px;border-radius:999px;background:linear-gradient(135deg,var(--a-g1),var(--a-g2));color:#fff!important;font-weight:700;font-size:.84rem;text-decoration:none!important;white-space:nowrap}
.li-abo-act__b--danger{background:#fff;color:#B42318!important;border:1px solid #F1C4C0}
.li-abo-act__b--danger:hover{background:#FDECEC}
.li-abo-act--danger .li-abo-act__i{background:#FDECEC;color:#B42318}
.li-abo-act.is-off{background:#FCFBFD}
@media (max-width:560px){.li-abo-act{grid-template-columns:auto 1fr}.li-abo-act__b{grid-column:1/-1;justify-self:start}}
/* Badges de statut dans un en-tête : de l'air avant les boutons (11/09/2026). */
.li-es .li-es-hero .li-status{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 22px}
.li-es .li-es-hero .li-status + .li-es-cta{margin-top:0}
.li-es .li-pf-id{margin-bottom:16px}

/* Vérification d'un membre (/verification/, 11/09/2026) ----------------- */
.li-es.li-vm{max-width:none}
.li-vm .li-vs-hero{margin:0 0 22px}
.li-vm-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.li-vm-art{background:linear-gradient(135deg,#3B82F6,#1E4FBF)!important;box-shadow:0 24px 44px -20px rgba(30,79,191,.8)!important}
.li-vs-st.is-wait{background:#FFF8E6;border-color:#F0D9A8}
.li-vs-st.is-wait .li-vs-st__m{background:#D0861E;color:#fff}
.li-vs-st.is-ko{background:#FFF1F1;border-color:#F4C7C3}
.li-vs-st.is-ko .li-vs-st__m{background:#B42318;color:#fff}
.li-vs-st.is-ko .li-vs-st__t span{color:#B42318;font-weight:700}
@media (max-width:760px){.li-vm-steps{grid-template-columns:1fr}}
/* Étapes du module : cartes blanches, en-tête sobre (les marches sont déjà en haut). */
.li-vm .li-verif-steps{display:grid;gap:18px;max-width:980px;margin:0 auto}
.li-vm .li-vstep{margin:0!important;padding:0!important;border-radius:24px!important;background:#fff!important;border:1px solid var(--a-l)!important;box-shadow:var(--es-sh)!important;overflow:hidden}
.li-vm .li-vstep__head{padding:18px 24px!important;border-bottom:1px solid var(--a-l);background:var(--a-s)!important}
.li-vm .li-vstep__title h2{font-family:var(--serif,Georgia,serif);color:var(--a-i)}
.li-vm .li-vstep__num{background:linear-gradient(135deg,var(--a-g1),var(--a-g2))!important;color:#fff!important}
.li-vm .li-vstep.is-done .li-vstep__num{background:var(--trust-blue,#2563EB)!important}
.li-vm .li-vstep.is-locked{opacity:.75}
.li-vm .li-vstep__body{padding:20px 24px 24px!important}
.li-vm .li-vstep__body .li-note{border-radius:14px}
.li-vm input[type=file]{display:block;width:100%;box-sizing:border-box;padding:24px 18px;border:2px dashed var(--a-l);border-radius:18px;background:var(--a-s);cursor:pointer}
.li-vm input[type=file]:hover{border-color:var(--a)}
.li-vm input[type=file]::file-selector-button{margin-right:14px;padding:10px 18px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--a-g1),var(--a-g2));color:#fff;font-weight:800;cursor:pointer}
.li-vm .li-verif-form button[type=submit],.li-vm .li-verif-form .li-btn{border-radius:999px}
.li-vm .li-note--error{background:#FFF1F1!important;border-color:#F4C7C3!important;color:#8A1C12!important}
.li-vm .li-vstep__body label{font-weight:500;line-height:1.5;color:#4b4458}
.li-vm .li-vstep__body label strong,.li-vm .li-vstep__body label b{color:var(--a-i);font-weight:700}
.li-vm .li-vstep__body > .li-note,.li-vm .li-vstep__body form > .li-note{margin:0 0 12px}

/* Favoris (/compte/favorites/, 11/09/2026) ------------------------------- */
.hp-page__content:has(> .li-fav-es){display:flex;flex-direction:column}
.hp-page__content:has(> .li-fav-es) > *{order:5}
.hp-page__content:has(> .li-fav-es) > .li-fav-es{order:0}
.hp-page__content:has(> .li-fav-es) > .hp-page__title{display:none}
.li-fav-es .li-fav-hero{margin:6px 0 22px}
.li-fav-art{display:flex;align-items:center;justify-content:center;width:140px;height:140px;border-radius:42px;transform:rotate(-8deg);
  background:linear-gradient(135deg,var(--a-g1),var(--a-g2));box-shadow:0 24px 44px -22px var(--a-d)}
.li-fav-art i.hp-icon{color:#fff;font-size:3.6rem!important;width:auto!important;height:auto!important;line-height:1!important}
.li-fav__univers,.li-fav__city{scroll-margin-top:100px}
#li-fav-logts,#li-fav-lieux{scroll-margin-top:100px}
.li-fav__group{margin:0 0 26px}
.li-fav__city{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:.78rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#6E6478}
.li-fav__city .li-fav__n{padding:2px 9px;border-radius:999px;font-size:.72rem}
.li-fav-del{background:#fff!important;border:1px solid #F1D5DE!important;color:#B4235A!important;cursor:pointer}
.li-fav-del:hover{background:#FFF1F5!important}
.li-fav-del i{color:#EE3D6F!important}

/* =========================================================================
   Messagerie (11/09/2026) — 9 points validés sur maquette. Voir
   framboise sinon (couleurs de la prod côté Logement).
   ========================================================================= */
/* 1. En-tête de la boîte, et ordre de lecture. */
.hp-page__content:has(> .li-msg-es){display:flex;flex-direction:column}
.hp-page__content:has(> .li-msg-es) > *{order:5}
.hp-page__content:has(> .li-msg-es) > .li-msg-es{order:0}
.hp-page__content:has(> .li-msg-es) > .hp-page__title{display:none}
.li-msg-es .li-msg-hero{margin:6px 0 16px}
.li-msg-art{display:flex;align-items:center;justify-content:center;width:120px;height:120px;border-radius:36px;transform:rotate(-7deg);
  background:linear-gradient(135deg,var(--a-g1),var(--a-g2));box-shadow:0 22px 40px -22px var(--a-d)}
.li-msg-art i.hp-icon{color:#fff;font-size:3rem!important;width:auto!important;height:auto!important;line-height:1!important}
/* 2. Filtres et recherche (remplacent les onglets Conversations / Archivées). */
.hp-page__content:has(> .li-msg-es) .li-conv-tabs{display:none}
.li-msg-outils{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 14px}
.li-msg-chips{display:inline-flex;padding:4px;border-radius:14px;background:#fff;border:1px solid var(--a-l)}
.li-es .li-msg-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:0;border-radius:10px;background:none;font-family:inherit;font-size:.9rem;font-weight:700;line-height:1.2;color:var(--es-mut);text-decoration:none!important;cursor:pointer;box-shadow:none;min-height:0;text-transform:none;letter-spacing:0}
.li-es .li-msg-chip.is-on{background:var(--a-s);color:var(--a-d)}
.li-msg-chip i{font-style:normal;padding:0 7px;border-radius:999px;background:var(--a);color:#fff;font-size:.72rem;line-height:1.6}
.li-msg-chip span{padding:0 7px;border-radius:999px;background:#F1ECF6;color:var(--es-mut);font-size:.72rem;line-height:1.6}
.li-msg-search{flex:1;min-width:180px;display:flex;align-items:center;gap:8px;padding:0 14px;border-radius:14px;background:#fff;border:1px solid var(--a-l);color:var(--es-mut)}
.li-msg-search input{flex:1;min-width:0;height:42px;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;color:var(--a-i);padding:0!important}
.li-msg-vide{margin:0 0 12px;padding:18px;border:1px dashed var(--a-l);border-radius:16px;background:#fff;text-align:center;color:var(--es-mut)}
.li-conv__row[hidden]{display:none!important}
/* 3. Sujet d'un échange sans annonce. */
.li-conv__obj--ctx{font-style:normal!important;font-weight:600;color:#C92A58}
.li-conv__obj--ctx b{font-weight:800}
.li-conv__obj--ctx em{font-style:normal;font-weight:500;color:#6E6478}
/* 4. Avatars : violet dans l'univers Travail. */
/* 5. Non lus. */
.li-conv__row.is-unread{background:rgba(238,61,111,.055)!important;box-shadow:inset 3px 0 0 #EE3D6F}
.li-conv__row.is-unread .li-conv__name{font-weight:800!important}
.li-conv__row.is-unread .li-conv__name::before{content:"";display:inline-block;width:8px;height:8px;margin:0 7px 1px 0;border-radius:50%;background:#EE3D6F;vertical-align:middle}
.li-conv__row.is-unread .li-conv__prev{color:#241726!important}
/* 6. En-tête de conversation en carte. */
.li-msg-bar{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 14px;padding:16px 18px;border-radius:22px;
  border:1px solid #F6D9E3;background:radial-gradient(110% 90% at 100% 0%,rgba(238,61,111,.10),transparent 60%),linear-gradient(135deg,#fff,#FFF6F8)}
.li-msg-bar h1.li-msgux-title{flex:1 1 auto;margin:0;font-size:1.45rem}
.li-msg-bar .li-msg-back{order:-1}
.li-msgctx--sujet .li-msgctx__media--icon{background:#FFF1F5;color:#C92A58}
.li-msgctx__etat{display:inline-block;margin-top:2px;padding:1px 9px;border-radius:999px;background:#E8F0FF;color:#1D4ED8;font-weight:700;font-size:.74rem}
/* 9. Menu « ⋯ ». */
.li-msg-bar__acts{margin-left:auto}
.li-msg-more{position:relative}
.li-msg-more>summary{list-style:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid #F1D5DE;
  background:#fff;color:#C92A58;font-size:1.25rem;line-height:1;cursor:pointer}
.li-msg-more>summary::-webkit-details-marker{display:none}
.li-msg-more__m{position:absolute;right:0;top:46px;z-index:50;display:flex;flex-direction:column;min-width:240px;padding:6px;border-radius:14px;background:#fff;border:1px solid #EFE6EA;box-shadow:0 18px 40px -20px rgba(36,23,38,.45)}
.li-msg-more .li-msg-barbtn{display:flex!important;align-items:center;gap:8px;padding:10px 12px!important;border:0!important;border-radius:10px!important;background:none!important;color:#241726!important;font-size:.88rem;text-decoration:none!important;box-shadow:none!important}
.li-msg-more .li-msg-barbtn:hover{background:#F8F4F9!important}
.li-msg-more .li-msg-barbtn--del{color:#B42318!important}
/* 7. Saisie compacte sur ordinateur : une rangée champ + bouton. */
@media (min-width:641px){
  .li-msgux-panel--conv>form .hp-field__label{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
  .li-msgux-panel--conv>form .hp-form__field--textarea{display:flex;align-items:flex-end;gap:10px}
  .li-msgux-panel--conv>form .hp-form__field--textarea>textarea{flex:1;min-width:0;min-height:52px;height:52px;max-height:180px;resize:none;border-radius:16px;line-height:1.5;padding:13px 16px}
  .li-msgux-panel--conv>form .hp-form__field--textarea>.hp-form__button{flex:none;margin:0!important;height:52px;padding:0 22px!important;border-radius:16px!important}
}
/* 8. Repères de date dans le fil. */
.li-msg-day{grid-column:1/-1;display:flex;justify-content:center;margin:10px 0 4px}
.li-msg-day span{padding:4px 13px;border-radius:999px;background:#fff;border:1px solid #EFE6EA;font-size:.74rem;font-weight:700;color:#6E6478;letter-spacing:.01em}

/* Correctifs messagerie (11/09/2026, retour du user). */
.li-es .li-msg-search input[type=search],.li-es .li-msg-search input[type=search]:focus,.li-es .li-msg-search input[type=search]:hover{
  -webkit-appearance:none;appearance:none;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important;height:44px;min-height:0;padding:0!important;margin:0!important;font-size:.95rem}
.li-es .li-msg-search:focus-within{border-color:var(--a);box-shadow:0 0 0 3px color-mix(in srgb,var(--a) 16%,transparent)}
/* ⚠ `:not([hidden])` N'EST PAS DÉCORATIF (12/09/2026). Cette règle existe pour
   rendre le bloc au-dessus d'une liste qui, sans elle, restait en ligne. Mais
   `.li-msg-vide` (0,1,0) et `[hidden]` du navigateur (0,1,0) sont à égalité :
   la feuille du thème passe en dernier, donc elle gagnait — et « Aucune
   conversation ne correspond » s'affichait EN PERMANENCE, au-dessus de la liste
   complète des conversations, alors que le script le range bien par `hidden`.
   Le message ne se voit plus que quand il est réellement levé. */
.li-msg-vide:not([hidden]){display:block}
@media (min-width:641px){
  .li-msgux-panel--conv>form .hp-form__field--textarea>.hp-form__button{width:auto!important;min-width:0!important;max-width:none;flex:0 0 auto!important}
  .li-msgux-panel--conv>form .hp-form__field--textarea>textarea{width:auto!important;flex:1 1 auto!important}
}

.li-conv__av{position:relative;overflow:hidden}
.li-conv__av-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* Notifications — préférences (11/09/2026) : thèmes, « Tout » par colonne,
   fréquence en pastilles, icônes violettes (candidatures, créneaux). */
.li-es .li-nc__freq{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:10px 18px;align-items:center;padding:16px 18px!important;border-radius:18px!important;border:1px solid var(--a-l)!important;background:var(--a-s)!important}
.li-es .li-nc__freq-lbl strong{color:var(--a-i)}
.li-nc__freqs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:14px;background:#fff;border:1px solid var(--a-l)}
.li-es .li-nc__freqs button{border:0;background:none;padding:8px 14px;border-radius:10px;font-weight:700;font-size:.86rem;color:var(--es-mut);cursor:pointer;box-shadow:none}
.li-es .li-nc__freqs button[aria-checked="true"]{background:linear-gradient(135deg,var(--a-g1),var(--a-g2));color:#fff}
@media (max-width:720px){.li-es .li-nc__freq{grid-template-columns:1fr}}
.li-es .li-nc__matrix thead th{vertical-align:bottom}
.li-es .li-nc__col{display:block;margin:6px auto 0;padding:3px 10px;border-radius:999px;border:1px solid var(--a-l);background:#fff;color:var(--a-d);font-size:.68rem;font-weight:800;letter-spacing:.04em;cursor:pointer}
.li-es .li-nc__col:hover{background:var(--a-s)}
.li-es .li-nc__sec th{padding:18px 0 6px!important;text-align:left;font-size:.7rem!important;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--a-d)!important;border:0!important;background:none!important}
.li-es .li-nc__sec:first-child th{padding-top:6px!important}

/* ==== Messagerie — onglet Infos (11/09/2026, inc/messages-infos-espace.php) ==== */
.li-mie{--m:#EE3D6F;--m-d:#C92A58;--m-i:#3A1426;--m-s:#FFF1F5;--m-l:#F6D9E3;--m-g:linear-gradient(135deg,#EE3D6F,#D0861E);--m-line:#F1E8EC}
.li-msgux-panel--infos>.li-mie{margin:0;padding:0;background:#fff;border-radius:22px;box-shadow:0 4px 18px rgba(36,23,38,.06)}
.li-msgux-panel--infos>.li-mie-recu{border:1.5px solid var(--m);padding:16px 18px}
.li-msgux-panel--infos>.li-mie-moi{border:1px solid var(--m-line)}
.li-mie-recu__h{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.li-mie-recu__h p{margin:0;color:#6E6478;font-size:.9rem}
.li-mie-recu__h b{color:var(--m-i)}
.li-mie-av{position:relative;flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--m-s);color:var(--m-d);font-weight:800;font-size:.9rem}
.li-mie-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.li-mie-cls{display:grid;gap:8px}
.li-mie-cl{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 12px;border-radius:14px;background:var(--m-s)}
.li-mie-cl__k{min-width:78px;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#6E6478}
.li-mie-cl__v{min-width:0;overflow-wrap:anywhere;font-weight:800;color:var(--m-d);font-size:1rem;font-variant-numeric:tabular-nums}
.li-mie-cl__v a{color:inherit;text-decoration:none}
.li-mie-cl__v small{display:block;font-weight:600;font-size:.76rem;color:#6E6478}
.li-mie-cl__v code{font:inherit;background:none;padding:0;color:inherit;letter-spacing:.02em}
.li-mie-cl__a{margin-left:auto;display:flex;flex-wrap:wrap;gap:6px}
.li-mie-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;border:1px solid var(--m-l);background:#fff;color:var(--m-d)!important;font:inherit;font-size:.82rem;font-weight:700;line-height:1.1;text-decoration:none!important;cursor:pointer;white-space:nowrap}
.li-mie-chip:hover{border-color:var(--m)}
.li-mie-chip--pri{background:var(--m-g);border-color:transparent;color:#fff!important}
.li-mie-chip.is-done{background:#1C7A4A;border-color:#1C7A4A;color:#fff!important}
.li-mie-recu__pay{margin-top:10px;border-radius:14px;border:1px solid var(--m-line)}
.li-mie-recu__pay>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:10px 12px;cursor:pointer}
.li-mie-recu__pay>summary::-webkit-details-marker{display:none}
.li-mie-recu__pay>summary b{display:block;color:var(--m-i);font-size:.9rem}
.li-mie-recu__pay>summary small{font-size:.8rem;color:#6E6478}
.li-mie-recu__pay[open]>summary small{visibility:hidden}
.li-mie-recu__pay>.li-mie-cls{padding:0 10px 10px}
.li-mie-recu__note{margin:0;padding:0 12px 12px;font-size:.8rem;color:#6E6478}
.li-mie-ic{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#F7F3F5;color:#6E6478;font-size:.95rem}
.li-mie-ic svg{width:17px;height:17px}
.li-mie-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto auto;gap:6px 12px;align-items:center;padding:13px 16px;border-top:1px solid var(--m-line)}
.li-mie-moi>.li-mie-row:first-child,.li-mie-moi>.li-mie-flash+.li-mie-row,.li-mie-moi>.li-mie-wait+.li-mie-row{border-top:0}
.li-mie-nm{min-width:0}
.li-mie-nm b{display:block;color:var(--m-i);font-size:.92rem}
.li-mie-nm span{display:block;font-size:.82rem;color:#6E6478;overflow-wrap:anywhere}
.li-mie-st{justify-self:end;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#F3F0F5;color:#7D7390;font-size:.76rem;font-weight:800;white-space:nowrap}
.li-mie-st--on{background:#E6F6EC;color:#1C7A4A}
.li-mie-st--on::before{content:"";width:7px;height:7px;border-radius:50%;background:#1C7A4A}
.li-mie-act{justify-self:end}
.li-mie-f{margin:0}
.li-mie-btn{display:inline-flex;align-items:center;justify-content:center;min-width:112px;padding:8px 14px!important;border-radius:999px!important;border:1px solid var(--m-l)!important;background:#fff!important;color:var(--m-d)!important;font:inherit;font-size:.84rem!important;font-weight:800!important;line-height:1.2!important;text-decoration:none!important;cursor:pointer;box-shadow:none!important;width:auto!important;height:auto!important}
.li-mie-btn--go{background:var(--m-g)!important;border-color:transparent!important;color:#fff!important}
.li-mie-btn--rm{color:#9B2C2C!important;border-color:#F0D2D2!important}
.li-mie-btn--rm:hover{background:#FDF3F3!important}
.li-mie-btn:disabled{opacity:.5;cursor:not-allowed}
.li-mie-btn.is-busy{opacity:.65;cursor:progress}
.li-mie-pick{grid-column:2/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:4px 0 0;padding:10px 12px;border-radius:12px;background:var(--m-s);font-size:.86rem;color:var(--m-i)}
.li-mie-pick[hidden]{display:none}
.li-mie-pick label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font-weight:700}
.li-mie-pick select{min-width:0;max-width:100%;padding:7px 10px;border-radius:10px;border:1px solid var(--m-l);background:#fff;font:inherit;color:#241726}
.li-mie-sub{margin:0;padding:12px 16px 4px;border-top:1px solid var(--m-line);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#6E6478}
.li-mie-sub+.li-mie-row{border-top:0}
.li-mie-flash{margin:12px 16px 4px;padding:9px 12px;border-radius:12px;background:#E6F6EC;color:#1C7A4A;font-size:.86rem;font-weight:700}
.li-mie-wait{margin:12px 16px 4px;padding:9px 12px;border-radius:12px;background:var(--m-s);color:var(--m-i);font-size:.86rem}
.li-mie-foot{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-top:1px solid var(--m-line);border-radius:0 0 22px 22px;background:#FAF8FB;color:#5A5066;font-size:.82rem;line-height:1.45}
.li-mie-foot--pay{background:#FFFBF2;color:#6B4E00}
.li-mie-foot>.hp-icon{flex:none;margin-top:2px}
.li-mie-plus{display:inline}
.li-mie-plus>summary{display:inline;list-style:none;font-weight:700;text-decoration:underline;cursor:pointer}
.li-mie-plus>summary::-webkit-details-marker{display:none}
.li-mie-plus[open]>summary{display:none}
.li-mie-plus p{margin:6px 0 0}
/* Outils repliés (rangés par messages.js) */
.li-mie-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;align-items:start}
.li-mie-tools>.li-mie-tool{margin:0;border-radius:18px!important;background:#fff!important;border:1px solid #F1E8EC!important;box-shadow:none!important;padding:0!important}
.li-mie-tool>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:14px 16px!important;cursor:pointer;font-size:inherit!important}
.li-mie-tool>summary::-webkit-details-marker{display:none}
.li-mie-tool>summary::after{content:"";flex:none;margin-left:auto;width:8px;height:8px;border-right:2px solid #8A8198;border-bottom:2px solid #8A8198;transform:rotate(45deg);transition:transform .15s}
.li-mie-tool[open]>summary::after{transform:rotate(-135deg)}
.li-mie-tool__t{min-width:0}
.li-mie-tool__t b{display:block;color:#241726;font-size:.92rem}
.li-mie-tool__t small{display:block;font-size:.8rem;color:#6E6478}
.li-mie-tag{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:rgba(208,134,30,.14);color:#8F5A0E;font-size:.66rem;font-weight:800;vertical-align:1px}
.li-mie-tool__in{padding:0 14px 14px}
.li-mie-tool__in>*{margin:0!important;border:0!important;box-shadow:none!important;padding:0!important;background:none!important}
.li-mie-tool__in .li-doc-panel__h,.li-mie-tool__in .li-msgux-iateaser__h{display:none}
.li-mie-tools>.li-res--compact>.li-res__summary .li-res__ico{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#F7F3F5;color:#6E6478}
.li-mie-tools>.li-res--compact>.li-res__body{padding:0 14px 14px}
@media (max-width:620px){
.li-mie-row{grid-template-columns:36px minmax(0,1fr) auto}
.li-mie-act{grid-column:2/-1;justify-self:start}
.li-mie-cl__a{margin-left:0}
}
@media (prefers-reduced-motion:reduce){.li-mie-tool>summary::after{transition:none}}
/* L'ancien habillage .li-coords-toggles (flex en ligne) ne doit pas s'appliquer à la liste d'états */
.li-msgux-panel--infos>.li-mie-moi,.li-mie-moi{display:block!important;flex-direction:column!important;flex-wrap:nowrap!important;gap:0!important;width:100%!important;max-width:none!important}
.li-mie-moi>.li-mie-row{display:grid!important;width:auto!important}
.li-mie-moi>.li-mie-sub{display:block!important;width:auto!important}
.li-mie-moi>.li-mie-foot{display:flex!important;width:auto!important}
.li-mie-nm,.li-mie-nm b,.li-mie-nm span{word-break:normal!important;writing-mode:horizontal-tb}

/* ==== Mes disponibilités (12/09/2026, inc/disponibilites-alertes-espace.php) ==== */
.li-dsp-es{margin:0 0 22px}
.li-dsp-art,.li-alr-es .li-dsp-art{display:grid;place-items:center;width:132px;height:132px;margin-left:auto;border-radius:36px;background:linear-gradient(135deg,var(--g1,#EE3D6F),var(--g2,#C92A58));color:#fff;font-size:3.2rem;box-shadow:0 18px 40px -18px rgba(36,23,38,.45);transform:rotate(-4deg)}
.li-es--logement .li-dsp-art{background:linear-gradient(135deg,#EE3D6F,#D0861E)}
.li-dsp-pick{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 10px;margin:18px 0 6px;scroll-snap-type:x proximity}
.li-dsp-pick__c{flex:0 0 auto;scroll-snap-align:start;display:flex;align-items:center;gap:10px;max-width:280px;padding:8px 14px 8px 8px;border-radius:16px;background:#fff;border:1px solid var(--line,#EFE6EA);color:var(--a-i,#241726);text-decoration:none!important}
.li-dsp-pick__c:hover{border-color:var(--a,#EE3D6F)}
.li-dsp-pick__c.is-on{border:2px solid var(--a,#EE3D6F);box-shadow:0 8px 20px -14px var(--a,#EE3D6F)}
.li-dsp-pick__img{flex:none;width:46px;height:46px;border-radius:11px;overflow:hidden;display:grid;place-items:center;background:var(--a-s,#FFF1F5);color:var(--a-d,#C92A58)}
.li-dsp-pick__img img{width:100%;height:100%;object-fit:cover}
.li-dsp-pick__t{min-width:0}
.li-dsp-pick__t b{display:block;font-size:.86rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.li-dsp-pick__t small{display:block;font-size:.76rem;color:var(--es-mut,#6E6478)}
.li-dsp-es .li-availpage__pick{display:none!important}
.li-dsp-es .li-availpage>.li-wz__sub{margin:10px 0 12px;padding:10px 14px;border-radius:14px;background:var(--a-s,#FFF1F5);color:var(--a-i,#241726);font-size:.88rem}
.li-dsp-es #li-avail,.li-dsp-sec--hrs .li-hrs,.li-dsp-sec--ical .li-ical{background:#fff!important;border:1px solid var(--line,#EFE6EA)!important;border-radius:24px!important;box-shadow:0 4px 18px rgba(36,23,38,.06)!important;padding:20px 22px!important;margin:0!important}
.li-dsp-sec--hrs .li-hrs__title,.li-dsp-sec--ical .li-ical__title{margin:0 0 6px!important;font-family:var(--serif,Georgia,serif);font-size:1.3rem!important;color:var(--a-i,#241726)!important}
.li-dsp-sec--hrs .li-wz__sub,.li-dsp-sec--ical .li-wz__sub{color:var(--es-mut,#6E6478);font-size:.9rem}
.li-dsp-sec--ical .li-input{border-radius:12px!important}
.li-dsp-es .li-availpage__status.is-ok{color:#1C7A4A;font-weight:700}
.li-dsp-es .li-availpage__status.is-err{color:#9B2C2C;font-weight:700}
@media (max-width:760px){.li-dsp-es #li-avail,.li-dsp-sec--hrs .li-hrs,.li-dsp-sec--ical .li-ical{padding:16px!important;border-radius:20px!important}}

/* ==== Mes alertes ==== */
.li-page:has(.li-alr-es)>.li-page__title,.li-page:has(.li-alr-es)>.li-page__lead{display:none}
.li-alr-es .li-es-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
.li-alr-list{margin:22px 0 0}
.li-alr-es .li-alert-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.li-alr-es .li-alert-item{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0;padding:14px 16px;background:#fff;border:1px solid var(--line,#EFE6EA);border-radius:18px}
.li-alr-es .li-alert-item__label{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 220px}
.li-alr-es .li-alert-item__label>.hp-icon{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#E6F4EA;color:#1F7A45} /* (17/09) vert : alerte active */
.li-alr-es .li-alert-item__name{font-weight:800;color:var(--a-i,#3A1426);font-size:1rem}
.li-alr-es .li-alert-item__actions{display:flex;gap:8px;flex-wrap:wrap}
.li-alr-es .li-alert-item__actions .hp-button{border-radius:999px!important;padding:8px 16px!important;font-size:.84rem!important;font-weight:800!important;margin:0!important}
.li-alr-es .li-alert-item__see{background:linear-gradient(135deg,#EE3D6F,#D0861E)!important;border:0!important;color:#fff!important}
.li-alr-es .li-alert-item__del{background:#fff!important;border:1px solid #F0D2D2!important;color:#9B2C2C!important}
/* (17/09) Mobile : la carte passe en colonne (hivepress.css) ; la base « flex:1 1 220px »
   du libellé devenait alors une HAUTEUR de 220 px → grand vide au milieu. Carte compacte :
   cloche + ville en ligne, puis les deux boutons côte à côte. */
@media (max-width:600px){
  .li-alr-es .li-alert-item{gap:12px;padding:14px}
  .li-alr-es .li-alert-item__label{flex:none;justify-content:flex-start}
  .li-alr-es .li-alert-item__actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .li-alr-es .li-alert-item__actions .hp-button{min-height:42px!important;padding:8px 14px!important;justify-content:center}
}
.li-alr-es .li-empty{padding:22px;border:1px dashed var(--line,#EFE6EA);border-radius:18px;background:#fff}
.li-alr-foot{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;color:var(--es-mut,#6E6478);font-size:.86rem}
.li-alr-foot .hp-icon{margin-top:3px;color:var(--a-d,#C92A58)}

/* ==== Pages de service au kit (12/09/2026, inc/pages-espace-kit.php) ==== */
.li-pgk{margin:0 0 26px}
/* ⚠ LE MÉDAILLON PARTAIT EN ROSE SUR LES PAGES TRAVAIL (12/09/2026, mesuré).
   Il se replie sur `var(--g1)` / `var(--g2)` — deux jetons qui n'existent nulle
   part : les jetons du kit s'appellent `--a-g1` / `--a-g2`. La valeur de repli
   faisait donc toute la couleur, et elle était écrite en framboise-or, donc en
   Logement. Ses deux voisins (`.li-dsp-art`, `.li-cl-duo__c`) ont la convention
   juste : repli VIOLET, puis surcharge explicite sous `.li-es--logement`. On
   l'aligne dessus plutôt que de renommer les jetons dans trois règles à la fois. */
.li-pgk-art{display:grid;place-items:center;width:120px;height:120px;margin-left:auto;border-radius:34px;background:linear-gradient(135deg,var(--a-g1,#EE3D6F),var(--a-g2,#C92A58));color:#fff;font-size:2.8rem;box-shadow:0 18px 40px -20px rgba(36,23,38,.45);transform:rotate(-4deg)}
.li-es--logement .li-pgk-art{background:linear-gradient(135deg,#EE3D6F,#D0861E)}
.li-pgk-art i.hp-icon{color:#fff!important;font-size:inherit!important;width:auto!important;height:auto!important;line-height:1!important;margin:0!important} /* staging 14/09 : médaillon, icône à la taille du médaillon */
.li-pgk .li-es-hero{align-items:center}
.li-page:has(.li-pgk)>h1.li-page__title,.li-page:has(.li-pgk)>p.li-page__lead{display:none}
@media (max-width:860px){.li-pgk-art{width:92px;height:92px;font-size:2.1rem;border-radius:26px;margin:14px 0 0}}

/* Rails qui défilent dans les espaces : même ombre de défilement (12/09/2026) */
@media(max-width:760px){
  .li-dsp-pick,.li-es .li-ong.is-actif .li-ong__bar{
    background-image:
      linear-gradient(90deg,var(--li-rail-bg,#FBF8F4) 38%,rgba(251,248,244,0)),
      linear-gradient(270deg,var(--li-rail-bg,#FBF8F4) 38%,rgba(251,248,244,0)),
      radial-gradient(farthest-side at 0 50%,rgba(36,23,38,.16),rgba(36,23,38,0)),
      radial-gradient(farthest-side at 100% 50%,rgba(36,23,38,.16),rgba(36,23,38,0));
    background-position:left center,right center,left center,right center;
    background-repeat:no-repeat;
    background-size:28px 100%,28px 100%,12px 100%,12px 100%;
    background-attachment:local,local,scroll,scroll;
  }
  .li-msgux-tabs{--li-rail-bg:#f7f0e7;overflow-x:auto;scrollbar-width:none}
  .li-msgux-tabs::-webkit-scrollbar{display:none}
  .li-dsp-pick{--li-rail-bg:#FBF8F4}
}

/* ==== Aperçu d'un document dans son volet d'édition (12/09/2026) ==== */
.li-doc-apercu{margin:0 0 16px;border:1px solid var(--line,#F6D9E3);border-radius:16px;background:#fff;overflow:hidden}
.li-doc-apercu>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;font-weight:700;color:#3A1426;font-size:.92rem}
.li-doc-apercu>summary::-webkit-details-marker{display:none}
.li-doc-apercu>summary small{font-weight:500;color:#6E6478;font-size:.82rem}
.li-doc-apercu>summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid #8A8198;border-bottom:2px solid #8A8198;transform:rotate(45deg);transition:transform .15s}
.li-doc-apercu[open]>summary::after{transform:rotate(-135deg)}
.li-doc-apercu>summary .hp-icon{color:#EE3D6F}
.li-doc-apercu__page{max-height:60vh;overflow:auto;padding:0 14px;background:#FBFAFD;border-top:1px solid var(--line,#F6D9E3)}
.li-doc-apercu__page .li-cv{background:#fff;margin:14px auto;padding:22px 20px;border-radius:12px;box-shadow:0 6px 22px -16px rgba(36,23,38,.6);max-width:720px}
.li-doc-apercu__n{margin:0;padding:9px 14px;border-top:1px solid var(--line,#F6D9E3);font-size:.8rem;color:#6E6478}
@media (max-width:640px){.li-doc-apercu__page{max-height:52vh;padding:0 8px}.li-doc-apercu__page .li-cv{padding:16px 14px}}

/* ==== Correctifs mobile (12/09/2026, relevés à l'écran) ==================== */

/* 4. Rail d'onglets des espaces : il s'étirait sur toute la largeur avec ses
   deux onglets serrés à gauche — un rail aux trois quarts vide se lit comme un
   conteneur cassé. Il se dimensionne sur ses onglets, comme côté Travail. */
.li-es .li-ong.is-actif .li-ong__bar{width:fit-content;max-width:100%;margin-inline:auto;justify-content:center}
@media (max-width:700px){
  /* ⚠ Pas de `width:auto` ici (retiré le 12/09/2026) : il annulait le
     `fit-content` de la règle au-dessus et rendait au rail toute la largeur,
     ses deux onglets serrés à gauche. `fit-content` + `max-width:100%`
     suffisent : le rail épouse ses onglets, et défile s'ils débordent. */
  .li-es .li-ong.is-actif .li-ong__bar{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .li-es .li-ong.is-actif .li-ong__bar::-webkit-scrollbar{display:none}
  .li-es .li-ong__t{flex:0 0 auto}
}

/* 5. Fréquence des e-mails : les trois choix s'empilaient en pleine largeur,
   seul l'actif ressemblant à un bouton. Ils forment un segment, actif ou non. */
@media (max-width:700px){
  .li-nc__freqs{display:grid;grid-template-columns:1fr;width:100%}
  .li-es .li-nc__freqs button{width:100%;text-align:left;border:1px solid transparent}
  .li-es .li-nc__freqs button[aria-checked="false"]{background:var(--a-s);border-color:var(--a-l);color:var(--a-i)}
}

/* 7. Composeur de message : jamais de bouton vide. La pastille ronde (avec son
   avion en papier) est posée dans le champ ; partout ailleurs, le bouton garde
   son libellé lisible — un aplat de couleur sans rien dessus n'est pas un
   bouton. */
.li-msgux-panel--conv>form .hp-form__footer>.hp-form__button{font-size:.95rem!important;line-height:1.2!important;color:#fff!important}

/* 8. Notifications sur mobile : l'intertitre de thème (« ÉCHANGES ») s'affichait
   dans une carte vide, aussi grande qu'un réglage. C'est un titre, pas une
   ligne de réglage. */
@media (max-width:760px){
  .li-es .li-nc__sec,.li-es .li-nc__sec th{background:none!important;border:0!important;box-shadow:none!important;padding:18px 2px 2px!important}
  .li-es .li-nc__sec th{font-size:.72rem!important;letter-spacing:.09em}
}


/* Sur téléphone, la tuile décorative de l'en-tête des pages laissait une bande
   vide sous le texte sans jamais s'afficher entièrement. L'icône du surtitre dit
   déjà de quoi parle la page : la tuile ne sert plus à rien ici (12/09/2026). */
@media (max-width:700px){
  .li-pgk .li-es-hero__side{display:none}
}

/* =========================================================================
   PAGES PUBLIQUES — le CORPS, pas seulement l'en-tête (12/09/2026)

   Ces pages n'avaient jamais été composées : un titre, puis du texte au fil de
   l'eau, sans hiérarchie entre les sections, sans respiration, sans mesure de
   lecture. Ce sont pourtant des pages qu'on LIT — des conditions générales, un
   guide, une explication du cadre légal.

   Le parti : un en-tête large, un texte étroit. La colonne de lecture est
   bornée à ~68 caractères (au-delà, l'œil perd la ligne suivante) ; chaque
   section s'ouvre sur un filet, qui fait le travail d'un blanc sans coûter un
   écran de défilement ; les listes reçoivent une puce dessinée plutôt que la
   puce du navigateur, qui ne suit ni la couleur ni la ligne de base du texte.
   ========================================================================= */
.li-pgk-page{max-width:1000px;padding-top:clamp(12px,2vw,20px)!important}
.li-pgk-page .li-pgk{margin:0 0 clamp(26px,4vw,42px)}
.li-pgk-body{max-width:68ch;margin:0 auto}

/* Les titres de section : le filet dit « nouvelle question » mieux qu'un vide.

   ⚠ `:not([class])` — SEULEMENT LES TITRES DE PROSE (12/09/2026). Cette règle
   visait tous les `h2` du corps ; or certaines pages du kit hébergent aussi des
   COMPOSANTS qui ont leurs propres titres : « Nouvelles demandes » sur
   /demandes/, le titre de la liste des villes sur /logements/<ville>/. Ces
   titres-là portent déjà leur filet (un trait qui part du titre vers la droite),
   et recevaient en plus celui-ci, pleine largeur, trente pixels au-dessus :
   deux barres parallèles, sans rapport l'une avec l'autre.
   Les titres écrits dans l'éditeur n'ont aucun attribut ; ceux des composants
   ont toujours une classe. La distinction est donc exacte, et gratuite. */
.li-pgk-body h2:not([class]){
  margin:clamp(34px,5vw,50px) 0 14px;
  padding-top:clamp(20px,3vw,28px);
  border-top:1px solid rgba(36,23,38,.1);
  line-height:1.14;
}
.li-pgk-body>h2:not([class]):first-child,
.li-pgk-body>*:first-child+h2:not([class]){margin-top:0;padding-top:0;border-top:0}
.li-pgk-body h3{margin:28px 0 8px;font-size:1.06rem;font-weight:700}

.li-pgk-body p{margin:0 0 14px;font-size:1.02rem;line-height:1.75;color:var(--ink-2,#3A3346)}
.li-pgk-body strong{color:var(--ink,#241726)}
.li-pgk-body a:not(.li-btn):not(.li-es-btn){
  color:var(--a-i,#B3164A);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:rgba(230,57,113,.4)
}
.li-pgk-body a:not(.li-btn):not(.li-es-btn):hover{text-decoration-color:currentColor}

.li-pgk-body ul,.li-pgk-body ol{margin:0 0 16px;padding-left:0;list-style:none}
.li-pgk-body ul li{position:relative;padding-left:22px;margin:0 0 9px;line-height:1.7;color:var(--ink-2,#3A3346)}
.li-pgk-body ul li::before{
  content:"";position:absolute;left:2px;top:.66em;width:6px;height:6px;border-radius:50%;
  background:var(--a,#E63971)
}
.li-pgk-body ol{counter-reset:li-pgk}
.li-pgk-body ol li{position:relative;counter-increment:li-pgk;padding-left:30px;margin:0 0 9px;line-height:1.7}
.li-pgk-body ol li::before{
  content:counter(li-pgk);position:absolute;left:0;top:.1em;width:21px;height:21px;
  display:grid;place-items:center;border-radius:50%;background:rgba(230,57,113,.1);
  color:var(--a-i,#B3164A);font-size:.74rem;font-weight:700
}

/* Renvoi éditorial (« Voir tout ce qu'on peut faire ici ») : c'était une phrase
   centrée flottant entre l'en-tête et le contenu, sans statut. C'est un renvoi :
   on lui donne la forme d'un renvoi. */
.li-pgk-body .li-page__more{
  display:flex;gap:10px;align-items:flex-start;margin:0 0 26px;padding:13px 16px;
  border-left:3px solid var(--a,#E63971);border-radius:0 12px 12px 0;
  background:rgba(230,57,113,.05);text-align:left;font-size:.95rem
}
.li-pgk-body .li-page__more a{font-weight:700}

/* Un tableau dans une page légale déborde sur téléphone : il défile seul. */
.li-pgk-body table{width:100%;border-collapse:collapse;font-size:.95rem}
.li-pgk-body table th,.li-pgk-body table td{padding:9px 10px;border-bottom:1px solid rgba(36,23,38,.1);text-align:left;vertical-align:top}
.li-pgk-body table:not(.li-cmp__table) th{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#6b6560)}

@media (max-width:700px){
  .li-pgk-body{max-width:none}
  .li-pgk-body p,.li-pgk-body ul li{font-size:1rem}
}

/* =========================================================================
   VALIDER SE FAIT À DROITE (12/09/2026)

   Règle de mise en page du site, qui n'était tenue qu'à moitié : le bouton qui
   VALIDE un formulaire — « Enregistrer », « Enregistrer les modifications »,
   « Publier » — se place à la fin de la colonne, donc à droite. Posé à gauche,
   il se lit avant qu'on ait fini de remplir, et il rompt l'alignement du reste.
   Constaté sur la barre collante des réglages de profil, et corrigé partout où
   nous posons nous-mêmes le conteneur d'actions.

   Exception assumée : sur téléphone, le bouton prend toute la largeur — c'est
   la cible la plus sûre au pouce, et l'alignement n'a plus de sens à une seule
   colonne.
   ====================================================================== */
/* ⚠ STAGING REFONTE (14/09/2026) : jamais les formulaires d'inscription, de
   connexion ni de mot de passe (y compris ceux de la modale, présente sur
   toutes les pages). Ils gardent leur rendu actuel, au pixel. */
:where(.hp-form:not(.hp-form--user-login):not(.hp-form--user-register):not(.hp-form--user-password-request):not(.hp-form--user-password-reset)) .hp-form__footer,
.li-sdoc-ed__a,
.li-conv-ed__a{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:flex-end;
}
/* Les mentions qui accompagnent parfois le bouton (légal, aide) restent à
   gauche : ce sont des phrases, pas des actions. */
:where(.hp-form:not(.hp-form--user-login):not(.hp-form--user-register):not(.hp-form--user-password-request):not(.hp-form--user-password-reset)) .hp-form__footer > .li-form-legal{margin-right:auto;text-align:left}
.li-conv-ed__a .li-conv-ed__f{margin-right:auto}

@media (max-width:600px){
  :where(.hp-form:not(.hp-form--user-login):not(.hp-form--user-register):not(.hp-form--user-password-request):not(.hp-form--user-password-reset)) .hp-form__footer,
  .li-sdoc-ed__a,
  .li-conv-ed__a{justify-content:stretch}
  :where(.hp-form:not(.hp-form--user-login):not(.hp-form--user-register):not(.hp-form--user-password-request):not(.hp-form--user-password-reset)) .hp-form__footer > .hp-form__button{width:100%}
}

/* =========================================================================
   LES RÉGLAGES DU COMPTE — le formulaire lui-même (12/09/2026)

   La page avait reçu son en-tête, ses onglets et ses cartes, mais le formulaire
   à l'intérieur était resté celui de HivePress : des étiquettes en CAPITALES
   GRASSES au-dessus de chaque champ, plus voyantes que les réponses qu'on y
   écrit, et des champs collés les uns aux autres. Sur une page de vingt champs,
   ce sont vingt titres qui crient là où il faudrait qu'on lise ce qu'on saisit.

   Les étiquettes repassent en casse normale, à la taille du texte ; l'aide
   passe dessous en gris ; les champs prennent la même respiration que dans le
   tunnel de publication, dont c'est exactement le même geste.
   ====================================================================== */
.hp-form--user-update .hp-field__label,
.li-pf-card .hp-field__label{
  text-transform:none!important;letter-spacing:0!important;
  font-size:.95rem!important;font-weight:600!important;color:var(--ink,#241726)!important;
  margin:0 0 4px!important;display:block;line-height:1.35
}
.hp-form--user-update .hp-field__description,
.li-pf-card .hp-field__description{
  display:block;margin:0 0 8px;font-size:.84rem;line-height:1.5;color:var(--muted,#6b6560)
}
.hp-form--user-update .hp-form__field,
.li-pf-card .hp-form__field{margin:0 0 20px}
.hp-form--user-update .hp-form__field:last-child{margin-bottom:0}
.hp-form--user-update input[type=text],
.hp-form--user-update input[type=email],
.hp-form--user-update input[type=url],
.hp-form--user-update input[type=tel],
.hp-form--user-update input[type=number],
.hp-form--user-update textarea,
.hp-form--user-update select{
  width:100%;padding:11px 14px;border:1px solid var(--a-l,#EFE0E6);border-radius:12px;
  font:inherit;font-size:.98rem;background:#fff;transition:border-color .15s,box-shadow .15s
}
.hp-form--user-update input:focus,
.hp-form--user-update textarea:focus,
.hp-form--user-update select:focus{
  /* Couleur de l'univers (12/09/2026) : `--li-ring` vaut le violet pour un compte
     Travail, la framboise côté Logement. L'ancien rgba framboise écrit en dur
     peignait en rose les réglages d'une structure Travail. */
  outline:0;border-color:var(--li-ring,var(--a,#E63971));box-shadow:0 0 0 3px color-mix(in srgb, var(--li-ring,#E63971) 14%, transparent)
}
/* L'astérisque des champs requis : une information, pas un accent de couleur. */
.hp-form--user-update .hp-field__label i,
.hp-form--user-update .hp-field__label .hp-field__required{color:var(--a,#E63971);font-style:normal}

/* =========================================================================
   « Générer un document » sans conversation : MONTRER plutôt qu'annoncer
   (12/09/2026). Trois colonnes — ce que le module reprend seul, ce qu'il
   déduit de la conversation, ce qui vous revient — construites sur le vrai
   schéma du document. Volontairement en retrait : c'est un exemple, pas un
   outil ; on ne doit pas essayer de cliquer dedans.
   ====================================================================== */
.li-docs-demo{margin:6px 0 0;padding:16px 18px;border:1px dashed var(--a-l,#EFE0E6);border-radius:16px;background:#FDFBFC}
.li-docs-demo__tag{display:inline-block;margin:0 0 14px;padding:3px 10px;border-radius:999px;
  background:rgba(36,23,38,.06);color:var(--muted,#6b6560);font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.li-docs-demo__g{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.li-docs-demo__c{padding:13px 14px;border-radius:13px;background:#fff;border:1px solid var(--a-l,#EFE0E6)}
.li-docs-demo__c h4{display:flex;align-items:center;gap:7px;margin:0 0 9px;font-size:.82rem;font-weight:700;line-height:1.3}
.li-docs-demo__c h4 i{font-size:.76rem}
.li-docs-demo__c ul{margin:0;padding:0;list-style:none}
.li-docs-demo__c li{position:relative;padding-left:14px;margin:0 0 5px;font-size:.84rem;line-height:1.45;color:var(--ink-2,#3A3346)}
.li-docs-demo__c li::before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.35}
.li-docs-demo__c--auto h4{color:#1C6B3C}
.li-docs-demo__c--auto{border-color:rgba(28,107,60,.22)}
.li-docs-demo__c--ia h4{color:#B3164A}
.li-docs-demo__c--ia{border-color:rgba(230,57,113,.24)}
.li-docs-demo__c--moi h4{color:var(--muted,#6b6560)}
.li-docs-demo__n{margin:13px 0 0;font-size:.84rem;line-height:1.55;color:var(--muted,#6b6560)}
.li-docs-demo__go{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:16px 0 0}
.li-docs-demo__why{flex:1;min-width:200px;font-size:.85rem;line-height:1.5;color:var(--muted,#6b6560)}
@media (max-width:600px){
  .li-docs-demo{padding:14px}
  .li-docs-demo__go .li-btn{width:100%}
}

/* « Mes documents » (Logement) : l'illustration de l'en-tête, dans le même
   esprit que celle de l'univers Travail — une pile de feuilles, pas un aplat.
   (12/09/2026) */
.li-docs-es{margin-bottom:26px}
.li-docs-art{position:relative;display:grid;place-items:center;width:112px;height:112px;margin-left:auto;
  border-radius:30px;background:linear-gradient(135deg,#EE3D6F,#D0861E);color:#fff;font-size:2.5rem;
  box-shadow:0 18px 40px -20px rgba(36,23,38,.45);transform:rotate(-4deg)}
@media (max-width:860px){.li-docs-art{width:88px;height:88px;font-size:2rem;border-radius:24px;margin:12px 0 0}}
@media (max-width:700px){.li-docs-es .li-es-hero__side{display:none}}

/* =========================================================================
   ANNONCE D'EXEMPLE — le bouton d'information (12/09/2026)

   Sur une annonce de démonstration, « Contacter l'hôte » est remplacé par un
   bouton qui explique qu'elle n'est pas réservable. Il gardait le gabarit par
   défaut de HivePress : deux fois plus petit et plus pâle que le vrai bouton,
   au point de se lire comme un bouton désactivé — alors qu'il est cliquable et
   qu'il a quelque chose à dire.

   Même encombrement que le vrai, donc, pour que la fiche ne paraisse pas
   cassée ; mais en teinte NEUTRE, parce qu'il ne mène pas à la messagerie.
   Promettre la même chose avec la même couleur serait pire que trop petit.
   ====================================================================== */
.li-example-cta{
  display:flex!important;align-items:center;justify-content:center;gap:9px;
  width:100%;min-height:46px;padding:11px 18px!important;
  border:1px solid rgba(36,23,38,.16)!important;border-radius:999px!important;
  background:#fff!important;background-image:none!important;
  color:var(--ink-2,#3A3346)!important;font:inherit;font-size:.95rem!important;font-weight:600!important;
  box-shadow:none!important;cursor:pointer;transition:border-color .15s,background .15s}
.li-example-cta:hover,.li-example-cta:focus-visible{
  border-color:rgba(36,23,38,.34)!important;background:#FBF8F4!important}
.li-example-cta i{font-size:.9rem;opacity:.7}

/* =========================================================================
   LE SÉJOUR, DANS LE FIL DE DISCUSSION (12/09/2026)
   Deux gestes : déclarer les dates, confirmer. L'encart reste sobre — c'est un
   constat, pas une réservation, et il ne doit pas prendre le pas sur la
   conversation elle-même.
   ====================================================================== */
.li-sej{margin:0 0 18px;padding:16px 18px;border:1px solid rgba(230,57,113,.2);border-radius:16px;background:#FDFBFC}
.li-sej__h{display:flex;align-items:center;gap:9px;margin:0 0 10px}
.li-sej__ico{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:rgba(230,57,113,.1);color:#B3164A;font-size:.8rem}
.li-sej__t{font-weight:700;font-size:1rem}
.li-sej__d{margin:0 0 12px;font-size:.92rem;line-height:1.55;color:var(--ink-2,#3A3346)}
.li-sej__dates{margin:0 0 10px;font-size:1rem;line-height:1.5}
.li-sej__dates--ok{color:#1C6B3C}
.li-sej__dates--ok i{margin-right:5px}
.li-sej__quoi{font-size:.86rem;color:var(--muted,#6b6560)}
.li-sej__f{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:0 0 10px}
.li-sej__l{display:flex;flex-direction:column;gap:4px;font-size:.8rem;font-weight:600;color:var(--ink-2,#3A3346)}
.li-sej__l input{padding:9px 11px;border:1px solid var(--a-l,#EFE0E6);border-radius:10px;font:inherit;font-size:.92rem;background:#fff}
.li-sej__l input:focus{outline:0;border-color:#E63971;box-shadow:0 0 0 3px rgba(230,57,113,.12)}
.li-sej__acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0}
.li-sej__non{font-size:.88rem;color:var(--muted,#6b6560);text-decoration:underline;text-underline-offset:2px}
.li-sej__non:hover{color:var(--ink,#241726)}
.li-sej__n{margin:0;font-size:.8rem;line-height:1.5;color:var(--muted,#6b6560)}
.li-sej-msg{margin:0 0 14px;padding:11px 14px;border-radius:12px;font-size:.92rem}
.li-sej-msg--ok{background:#E7F6EC;color:#14532d}
.li-sej-msg--ko{background:#FDECEC;color:#8A1C1C}

/* ── UN SÉJOUR QUI ATTEND MA CONFIRMATION (16/09/2026) ───────────────────
   Constaté en recette : la déclaration de l'un ne se lisait pas comme une
   action à faire chez l'autre. L'encart se distingue donc quand — et
   seulement quand — la balle est dans mon camp. */
.li-sej--todo{border-color:rgba(238,61,111,.55);background:#FFF5F8;box-shadow:0 6px 18px -14px rgba(238,61,111,.7)}
.li-sej--todo .li-sej__ico{background:#EE3D6F;color:#fff}
.li-sej__pourquoi{margin:0 0 12px;font-size:.9rem;line-height:1.5;font-weight:600;color:#B3164A}
.li-sej--todo .li-sej__acts{margin:0 0 10px}
/* Pastille des onglets : « il y a quelque chose à faire là-dedans ». */
.li-msgux-tab__dot{width:8px;height:8px;border-radius:50%;background:#EE3D6F;box-shadow:0 0 0 2px #fffdfa;flex:none}
.li-msgux-tab.is-active .li-msgux-tab__dot{background:#fff;box-shadow:none}
/* Mention « Séjour à confirmer » dans la liste des conversations. */
.li-conv__sej{display:inline-flex;align-items:center;gap:5px;margin-top:3px;padding:2px 9px;border-radius:999px;
  background:rgba(238,61,111,.12);color:#B3164A;font-size:.74rem;font-weight:700;line-height:1.5}
.li-conv__sej i{font-size:.8em}

/* ── LE REPÈRE « PARTAGER SES COORDONNÉES » DANS LE FIL (16/09/2026) ──────
   Depuis « Conversation », rien ne disait que l'échange de coordonnées se
   passe dans l'onglet « Infos & Compagnon IA ». Une ligne de service, pas une
   bulle de message : elle informe, elle ne parle pas à la place de personne. */
.li-coords-repere{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 7px;margin:14px 0 0;padding:10px 14px;
  border:1px dashed var(--a-l,#EFE0E6);border-radius:12px;background:#FDFBFC;
  font-size:.84rem;line-height:1.55;color:var(--muted,#6b6560)}
.li-coords-repere i{color:#B3164A}
.li-coords-repere a{color:#B3164A;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.li-coords-repere a:hover{color:var(--ink,#241726)}
.li-coords-repere__t{min-width:0;flex:1 1 220px}
/* L'ancre visée depuis le fil : ne pas atterrir sous l'en-tête collant. */
#li-infos-coords{scroll-margin-top:calc(var(--li-hdr-h,90px) + 64px)}
@media (max-width:520px){.li-coords-repere{padding:9px 11px;font-size:.8rem}}
@media (max-width:520px){
  .li-sej__f{flex-direction:row;flex-wrap:wrap;align-items:stretch;gap:10px}
  .li-sej__l{flex:1 1 calc(50% - 5px);min-width:0;align-items:stretch;text-align:left}
  .li-sej__l input{display:block;width:100%;min-width:0;min-height:46px;box-sizing:border-box;-webkit-appearance:none;appearance:none;text-align:left}
  .li-sej__f .li-btn{flex:1 1 100%;width:100%}
}

/* L'avis retenu jusqu'à la réciprocité : sans cette phrase, on dépose un avis
   et rien ne se passe à l'écran — le réflexe est de recommencer. (12/09/2026) */
.li-avs-att{display:flex;gap:9px;align-items:flex-start;margin:14px 0 0;padding:12px 14px;
  border-left:3px solid #C87D16;border-radius:0 11px 11px 0;background:rgba(200,125,22,.07);
  font-size:.9rem;line-height:1.55;color:var(--ink-2,#3A3346)}
.li-avs-att i{margin-top:3px;color:#A86A12}

/* « N séjours attendent votre avis » — rappel passif, jamais insistant.
   Il n'apparaît que s'il a quelque chose à dire (12/09/2026). */
.li-avrp{margin:0 0 22px;padding:16px 18px;border:1px solid rgba(200,125,22,.28);border-radius:16px;background:rgba(200,125,22,.06)}
.li-avrp__h{display:flex;align-items:center;gap:9px;margin:0 0 12px;font-weight:700;font-size:1rem;color:#8A5A00}
.li-avrp__h i{color:#C87D16}
.li-avrp__l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.li-avrp__i{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between;
  padding:11px 13px;border-radius:12px;background:#fff}
.li-avrp__t{display:flex;flex-direction:column;gap:2px;min-width:0}
.li-avrp__t b{font-size:.95rem}
.li-avrp__t small{font-size:.8rem;color:var(--muted,#6b6560)}
.li-avrp__b{flex:none;padding:7px 14px;border:1px solid #C87D16;border-radius:999px;
  font-size:.85rem;font-weight:600;color:#8A5A00;text-decoration:none;background:#fff}
.li-avrp__b:hover{background:#C87D16;color:#fff}
.li-avrp__n{margin:12px 0 0;font-size:.82rem;line-height:1.5;color:var(--muted,#6b6560)}
@media (max-width:520px){.li-avrp__i{flex-direction:column;align-items:stretch}.li-avrp__b{text-align:center}}

/* ==========================================================================
   RAIL D'ONGLETS — IL ÉPOUSE SES ONGLETS À TOUTES LES LARGEURS (12/09/2026)
   Sur grand écran il le faisait déjà (`width:fit-content`). Sur téléphone, la
   règle de défilement le repassait en `width:auto` : deux onglets serrés à
   gauche d'un rail pleine largeur, et un tiers de barre vide à droite — ce
   qu'on voyait sur « Candidatures / Réglages ».
   `fit-content` + `max-width:100%` répondent aux deux cas d'un coup : quand les
   onglets tiennent, le rail les épouse et se centre ; quand ils ne tiennent
   pas, il prend la largeur disponible et défile comme avant. Le sélecteur
   commence par `body` pour passer devant les règles de largeur des deux
   univers (creation-pro.css, plus haut dans cette feuille) sans surenchère de
   !important.
   ========================================================================== */
/* (La règle de largeur vit dans le bloc « Rail d'onglets » plus haut et dans
   creation-pro.css : une règle `body .li-ong…` posée ici perdait la bataille de
   spécificité contre `.li-es .li-ong.is-actif .li-ong__bar` — quatre classes
   contre trois classes et un élément. Constaté le 12/09/2026.) */

/* ==========================================================================
   « Répondre à une demande » sans numéro de demande (12/09/2026)
   La page affichait un grand titre suivi de « Demande introuvable » : on
   croyait à une panne alors qu'il manquait seulement un choix. Elle pose
   maintenant la question et donne la liste — voici son habillage.
   ========================================================================== */
.li-dchoix{max-width:760px;margin:22px auto 0}
.li-dchoix__t{margin:0 0 6px;font-size:1.15rem}
.li-dchoix__d{margin:0 0 16px;color:var(--muted,#6b6560);font-size:.92rem;line-height:1.55}
.li-dchoix__l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.li-dchoix__i{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  padding:14px 16px;background:#fff;border:1px solid var(--border,#EEE3DB);
  border-radius:14px;box-shadow:0 1px 2px rgba(58,20,38,.04);
}
.li-dchoix__txt{flex:1 1 200px;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.li-dchoix__ville{font-size:1rem}
.li-dchoix__quand{flex:1 1 100%;color:var(--muted,#6b6560);font-size:.84rem}
/* ⚠ Deux corrections vues à l'écran : le thème pose une puce sur les <li> de
   contenu (un point framboise apparaissait devant chaque demande), et `.li-btn`
   n'est pas habillé dans ce contexte — « Répondre » se lisait comme un simple
   lien alors que c'est l'action de la ligne. */
.li-dchoix__l>li::before,
.li-dchoix__l>li::marker{content:none !important;display:none !important}
.li-dchoix__b{
  flex:0 0 auto;margin-left:auto;padding:10px 20px;font-size:.9rem;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;border:0;text-decoration:none !important;
  /* ⚠ `!important` sur le FOND aussi : une règle `.li-btn` plus loin pose un
     `background:...!important` qui effaçait le mien, pendant que ma couleur de
     texte, elle, tenait — du blanc sur du transparent, soit une pastille vide.
     Le même défaut que le bouton d'envoi de la messagerie. Toujours vérifier la
     paire fond + texte, jamais l'une sans l'autre. */
  background-image:linear-gradient(135deg,var(--rasp,#EE3D6F),#D0861E) !important;
  background-color:var(--rasp,#EE3D6F) !important;
  color:#fff !important;
  box-shadow:0 6px 16px -10px rgba(238,61,111,.8);
}
.li-dchoix__b:hover,.li-dchoix__b:focus-visible{filter:brightness(1.05);color:#fff !important}
.li-dchoix__cp{color:var(--muted,#6b6560);font-size:.86rem}
.li-dchoix__all{margin:16px 0 0;font-size:.9rem}
@media (max-width:520px){
  .li-dchoix__b{flex:1 1 100%;margin-left:0;justify-content:center;text-align:center}
}

/* Qui sommes-nous ? (14/09/2026) : photo ronde + texte, en colonne sur mobile. */
.li-qsn{display:flex;gap:28px;align-items:flex-start;margin:8px 0 12px}
.li-qsn__photo{flex:0 0 160px;width:160px;height:160px;border-radius:50%;object-fit:cover;box-shadow:0 8px 24px rgba(36,23,38,.12)}
.li-qsn__texte p{margin:0 0 14px;line-height:1.65}
.li-qsn__photo{margin:0!important}.li-qsn__texte{flex:1;min-width:0}.li-qsn__signature{font-weight:700;color:var(--rasp,#EE3D6F)}
@media (max-width:640px){.li-qsn{flex-direction:column;align-items:center;gap:18px}.li-qsn__photo{width:128px;height:128px;flex-basis:auto}}

.li-pgk-body .li-qsn>*{margin:0!important}.li-pgk-body .li-qsn .li-qsn__signature{color:var(--rasp,#EE3D6F)!important;margin:0!important}

.li-qsn__role{display:block;font-weight:400;font-style:italic;color:var(--ink-2,#6B5A6E)}


/* ==========================================================================
   Refonte Logement R3 « Espace membre » (STAGING 14/09/2026, inc/refonte-logement-espace.php)
   ========================================================================== */
/* Vérification d'un membre : marches de l'en-tête (repris de DEV, sans gris ni violet). */
.li-vs-art{display:flex;align-items:center;justify-content:center;width:150px;height:150px;border-radius:44px;transform:rotate(-6deg);
  background:linear-gradient(135deg,#14B8A6,#0F766E);color:#fff;box-shadow:0 24px 44px -20px rgba(15,118,110,.8)}
.li-vs-art svg{width:78px;height:78px;stroke-width:1.5}
.li-vs-art i.hp-icon{font-size:3.4rem!important;color:#fff}
.li-vs-steps{grid-column:1/-1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.li-vs-steps.li-vm-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.li-vs-st{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.88);border:1px solid var(--a-l)}
.li-vs-st__m{flex:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--a-s);color:var(--a-d);font-weight:800}
.li-vs-st__t{display:flex;flex-direction:column;gap:2px;min-width:0}
.li-vs-st__t strong{color:var(--a-i);font-size:.95rem}
.li-vs-st__t span{font-size:.8rem;color:var(--es-mut)}
.li-vs-st.is-ok.li-vs-st--verif{background:#EEF4FF;border-color:rgba(37,99,235,.25)}
.li-vs-st.is-ok.li-vs-st--verif .li-vs-st__m{background:var(--trust-blue,#2563EB);color:#fff}
.li-vs-st.is-ok.li-vs-st--conf{background:#E8F7F5;border-color:rgba(13,148,136,.28)}
.li-vs-st.is-ok.li-vs-st--conf .li-vs-st__m{background:var(--trust-teal,#0D9488);color:#fff}
.li-vs-st.is-ok .li-vs-st__m i{color:#fff}
.li-vs-st.is-cur{background:#fff;border-color:var(--a);box-shadow:0 10px 24px -14px var(--a-d)}
.li-vs-st.is-cur .li-vs-st__m{background:linear-gradient(135deg,var(--a-g1),var(--a-g2));color:#fff}
.li-vs-st.is-cur .li-vs-st__t span{color:var(--a-d);font-weight:700}
.li-vs-st.is-next{opacity:.75}
@media (max-width:760px){.li-vs-steps,.li-vs-steps.li-vm-steps{grid-template-columns:1fr}}

/* Notifications : l'en-tête du kit remplace le titre et le chapô de la page. */
.li-page:has(.li-nc-hero) > .li-page__title,
.li-page:has(.li-nc-hero) > .li-page__lead{display:none}
.li-page:has(.li-nc-hero){max-width:1200px}

/* Mes annonces : « Nouvelle annonce » est monté dans l'en-tête. */
.hp-page__content:has(.li-myl-es) .li-myl-top{display:none}

/* Médaillon calendrier / cloche : l'icône prenait la taille du thème (minuscule). */
.li-dsp-art i.hp-icon{color:#fff;font-size:3.2rem!important;width:auto!important;height:auto!important;line-height:1!important}
/* Compteur « Archivées » : jeton de l'univers plutôt qu'un gris-violet. */
.li-es .li-msg-chip span{background:var(--a-s);color:var(--a-d)}

/* ==== Refonte Logement R5 (staging 14/09/2026) — porté de DEV, sans l'univers Travail ==== */
/* Archives de « Mes annonces » : groupes Logements / Demandes, pastilles de nature (inc/archives.php). */
body.li-rl .li-myl-grp__t{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding-left:12px;border-left:3px solid var(--border);font-size:1.05rem;font-weight:700;line-height:1.3}
body.li-rl .li-myl-grp__n{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:11px;background:rgba(0,0,0,.06);font-size:.76rem;font-weight:700;color:var(--ink-2)}
body.li-rl .li-arch-grp{margin:0 0 22px}
body.li-rl .li-arch-grp:last-child{margin-bottom:0}
body.li-rl .li-arch-grp .li-myl-grp__t{font-size:.95rem}
body.li-rl .li-arch-grp--loge .li-myl-grp__t{border-left-color:var(--rasp,#EE3D6F)}
body.li-rl .li-arch-grp--dem .li-myl-grp__t{border-left-color:var(--gold,#D0861E)}
body.li-rl .li-arch-row__kind--loge{color:var(--rasp-deep,#C91E52);border-color:rgba(238,61,111,.34);background:rgba(238,61,111,.06)}
body.li-rl .li-arch-row__kind--dem{color:#9A6212;border-color:rgba(208,134,30,.36);background:rgba(208,134,30,.08)}
/* Écran d'erreur du kit (lien de signature manquant ou périmé, inc/doc-signature.php). */
.li-rj-es{max-width:640px;margin:0 auto}
.li-rj{display:grid;justify-items:center;text-align:center;gap:10px;padding:34px 28px;background:#fff;border:1px solid var(--border,#EEE3DB);border-radius:28px;box-shadow:0 18px 44px -34px rgba(36,23,38,.5)}
.li-rj__logo{position:relative;display:grid;place-items:center;width:76px;height:76px;border-radius:24px;overflow:hidden;background:rgba(238,61,111,.08);color:var(--rasp-deep,#C91E52);font-weight:800;font-size:1.5rem;margin-bottom:4px}
.li-rj__logo--ico{font-size:1.5rem}
.li-rj--ok .li-rj__logo{background:#E6F6EC;color:#1C7A4A}
.li-rj--err .li-rj__logo{background:#FDF3F3;color:#9B2C2C}
.li-rj .li-es-eyebrow{margin:0}
.li-rj__t{margin:0;font-family:var(--serif,Georgia,serif);font-size:clamp(1.4rem,3.4vw,1.9rem);line-height:1.2;color:var(--ink,#241726);text-wrap:balance}
.li-rj__p{margin:0;max-width:46ch;color:var(--ink-2,#7E6E80);line-height:1.55}
.li-rj__act{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:10px 0 0}
/* Tunnel de publication (/publier/) — habillage DEV du 12/09/2026, couleurs Logement PROD conservées. */
body.li-rl .li-wz-rail{max-width:860px}
body.li-rl .li-wz-rail__name{display:none}
@media (min-width:900px){
  body.li-rl .li-wz-rail__node{flex-direction:column;gap:6px;padding-bottom:0}
  body.li-rl .li-wz-rail__name{display:block;max-width:96px;font-size:.68rem;font-weight:600;line-height:1.25;text-align:center;color:var(--ink-2);hyphens:auto;transition:color .18s}
  body.li-rl .li-wz-rail__node:hover .li-wz-rail__name{color:var(--ink)}
  body.li-rl .li-wz-rail__node.is-current .li-wz-rail__name{color:var(--rasp-deep);font-weight:700}
  body.li-rl .li-wz-rail__track{align-items:start;min-height:62px}
  body.li-rl .li-wz-rail__line,body.li-rl .li-wz-rail__fill{top:18px}
  body.li-rl .li-wz-rail__tip{display:none}
}
/* Flèches natives des champs nombre masquées (hors compteur − / +). */
body.li-rl .li-wz input[type="number"]:not(.li-wz-stepper__ctl input)::-webkit-outer-spin-button,
body.li-rl .li-wz input[type="number"]:not(.li-wz-stepper__ctl input)::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
body.li-rl .li-wz input[type="number"]:not(.li-wz-stepper__ctl input){-moz-appearance:textfield;appearance:textfield}
/* « Enregistrer le brouillon » : zone de clic plus large (desktop). */
@media (min-width:560px){body.li-rl .li-wz-foot .li-wz-foot__draft{padding:10px 14px}}

/* (14/09/2026) Pause : les durées dans la carte d action */
.li-abo-act__bs{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
@media (max-width:560px){.li-abo-act__bs{grid-column:1/-1;justify-content:flex-start}}

/* =========================================================================
   (15/09/2026) LARGEURS COHÉRENTES — trois largeurs, pas plus.
   large 1200 (catalogue, fiche, espaces, tarifs) · standard 1000 (pages à en-tête)
   · lecture 68ch (prose seulement, calée à GAUCHE sur le bord de l'en-tête).
   Sur une page, l'en-tête et tout ce qui suit partagent les mêmes bords.
   ========================================================================= */
body.li-rl .li-pgk-page--entete{max-width:1000px}
body.li-rl.page-id-29 .li-pgk-page--entete{max-width:1440px}
body.li-rl .li-pgk-body{max-width:none;margin:0}
body.li-rl .li-pgk-body :is(.li-faq,.li-demandes,.li-demandes__bar){margin-inline:0}
body.li-rl .li-pgk-body .li-faq{max-width:none}
body.li-rl .li-page--wide:not(.li-pgk-page):not(.li-pgk-page--entete){max-width:1000px}
body.li-rl .li-page--wide:not(.li-pgk-page) > :is(.li-page__title,.li-page__lead,.li-faq,.li-qp){margin-inline:0;text-align:left}

/* (15/09/2026) Parrainage : UNE section — cagnotte à gauche, code à partager à droite
   (balisage regroupé par li_ref_duo, inc/pages-espace-kit.php). */
.li-ref-duo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:stretch;padding:22px}
.li-ref-duo__a{display:flex;flex-direction:column;gap:12px;min-width:0}
.li-ref-duo__a .li-ref-stats{margin:0}
.li-ref-duo__a p{margin:0;font-size:.92rem;line-height:1.5;color:var(--ink-2,#7E6E80)}
.li-ref-duo__b{display:flex;flex-direction:column;gap:12px;min-width:0;padding:18px 20px;border-radius:16px;
  background:linear-gradient(135deg,rgba(238,61,111,.07),rgba(208,134,30,.06));border:1px solid rgba(238,61,111,.16)}
.li-ref-duo__k{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--rasp-deep,#C91E52)}
.li-ref-duo__b .li-ref-code{align-self:flex-start;margin:0}
.li-ref-duo__b .li-ref-share{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.li-ref-duo__b .li-ref-share input{flex:1 1 200px;min-width:0;margin:0}
.li-ref-duo__b .li-ref-share .li-btn{flex:0 0 auto}
.li-ref-duo__b .li-abo-help{margin:0;font-size:.88rem;line-height:1.5}
@media (max-width:760px){.li-ref-duo{grid-template-columns:1fr;padding:16px}}
/* (15/09/2026) Largeurs cohérentes, suite de l'audit : blocs encore bridés dans le corps. */
body.li-rl .li-pgk-body :is(.cmplz-document,.li-dchoix,.li-demandes,.li-demandes__bar,.li-tl__intro){max-width:none;margin-inline:0}
body.li-rl .li-pgk-body .li-trust-cta p{max-width:none}
body.li-rl.page-id-29 .li-legend{max-width:none;margin-inline:0}
body.li-rl :is(.li-pgk-page,.li-pgk-page--entete) :is(.cmplz-document,.li-tl__intro){max-width:none!important;margin-inline:0!important}
body.li-rl :is(.li-pgk-page,.li-pgk-page--entete) .li-trust-cta p{max-width:none}
/* (15/09/2026) Espaces : les blocs sous l'en-tête prennent sa largeur. */
body.li-rl .li-abo > *{max-width:none;margin-inline:0}
body.li-rl .li-verif-steps{max-width:none;margin-inline:0}
body.li-rl .li-pgk-body :is(form.li-qp,.li-qp__note){max-width:none;margin-inline:0}
.li-abo-acts__g{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
/* (15/09/2026) Largeur « large » unique : Mes notifications, Mes alertes et Tarifs alignés sur les espaces (1216 px à 1280). */
body.li-rl:is(.page-id-114,.page-id-191,.page-id-29) .entry-content > .li-page,body.li-rl:is(.page-id-114,.page-id-191,.page-id-29) .li-page{max-width:1216px;padding-inline:0;margin-inline:auto}

/* =========================================================================
   (15/09/2026) MES ANNONCES — carte horizontale, toutes les actions visibles.
   La plupart des membres ont 1 ou 2 annonces : « Plus d'options » cachait la
   moitié des actions pour rien. Photo | identité | panneau d'actions.
   Le script (pages-espace-kit.php) ouvre les menus ; ici, on les met en page.
   ========================================================================= */
body.li-rl .li-myl{display:grid!important;grid-template-columns:1fr!important;gap:18px!important}
body.li-rl .li-myl-card{display:grid!important;grid-template-columns:200px minmax(0,1fr)!important;align-items:stretch;border-radius:22px!important;overflow:hidden;min-height:0!important;height:auto!important}
body.li-rl .li-myl-card__media{width:auto!important;height:100%!important;min-height:200px;aspect-ratio:auto!important;border-radius:0!important;background-size:cover;background-position:center}
body.li-rl .li-myl-card__body{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(300px,380px);grid-template-rows:auto auto 1fr;column-gap:24px;padding:22px 22px 22px 26px!important;height:auto!important}
body.li-rl .li-myl-card__head,body.li-rl .li-myl-card__title,body.li-rl .li-myl-card__meta{grid-column:1}
body.li-rl .li-myl-card__title{margin:10px 0 6px!important}
body.li-rl .li-myl-card__meta{margin:0!important;align-self:start}
body.li-rl .li-myl-card__acts{grid-column:2;grid-row:1 / span 3;margin:0!important;padding:14px!important;border-radius:16px;background:#FBF5EE;border:1px solid rgba(36,23,38,.06);display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;align-content:start}
body.li-rl .li-myl-card__acts > .li-myl-act{margin:0!important;width:100%!important;justify-content:center}
body.li-rl .li-myl-card__acts > .li-myl-act--primary{grid-column:1 / -1}
body.li-rl .li-myl-card__acts > .li-myl-act:not(.li-myl-act--primary):only-of-type{grid-column:1 / -1}
body.li-rl .li-myl-menu{grid-column:1 / -1;margin:4px 0 0!important;border:0!important;padding:0!important;background:none!important}
body.li-rl .li-myl-menu > summary{display:none!important}
body.li-rl .li-myl-menu__panel{display:grid!important;grid-template-columns:1fr 1fr;gap:6px;margin:0!important;padding:8px 0 0!important;border:0!important;border-top:1px solid rgba(36,23,38,.08)!important;border-radius:0!important;background:none!important;box-shadow:none!important;position:static!important}
body.li-rl .li-myl-mitem{display:flex!important;align-items:center;gap:8px;padding:9px 10px!important;border-radius:12px!important;background:#fff!important;border:1px solid rgba(36,23,38,.07)!important;font-size:.88rem;line-height:1.2;min-width:0;transition:border-color .15s,transform .15s}
body.li-rl .li-myl-mitem:hover{border-color:rgba(238,61,111,.35)!important;transform:translateY(-1px)}
body.li-rl .li-myl-mitem > i{flex:0 0 auto;width:18px;text-align:center;margin:0!important}
body.li-rl .li-myl-mitem__sub{display:none!important}
body.li-rl .li-myl-mitem__lbl{font-weight:600;white-space:normal}
body.li-rl .li-myl-mitem--del{grid-column:1 / -1;justify-content:center;background:transparent!important;border-style:dashed!important;color:var(--ink-2,#7E6E80)!important}
body.li-rl .li-myl-mitem--del i{color:var(--ink-2,#7E6E80)!important}
@media (max-width:900px){
  body.li-rl .li-myl-card{grid-template-columns:1fr!important}
  body.li-rl .li-myl-card__media{height:190px!important;min-height:0}
  body.li-rl .li-myl-card__body{grid-template-columns:1fr;padding:18px!important}
  body.li-rl .li-myl-card__acts{grid-column:1;grid-row:auto;margin-top:14px!important}
}
/* (15/09/2026) Mes annonces, finitions : un élément seul sur sa ligne prend toute la largeur ; ligne d'état. */
body.li-rl .li-myl-card__acts > .li-myl-act--primary + .li-myl-act:nth-last-child(2){grid-column:1 / -1}
body.li-rl .li-myl-menu__panel > .li-myl-mitem:not(.li-myl-mitem--del):nth-child(odd):nth-last-child(2){grid-column:1 / -1}
body.li-rl .li-myl-etat{grid-column:1;margin:14px 0 0;display:flex;gap:8px;align-items:flex-start;font-size:.9rem;line-height:1.45;color:var(--ink-2,#7E6E80);max-width:46ch}
body.li-rl .li-myl-etat i{margin-top:3px;color:var(--rasp,#EE3D6F)}
body.li-rl .li-myl-card__body{grid-template-rows:auto auto auto 1fr}
body.li-rl .li-myl-card__acts{grid-row:1 / span 4}
body.li-rl .li-myl-etat{align-self:start}
@media (max-width:900px){body.li-rl .li-myl-card__acts{grid-row:auto}}

/* ==========================================================================
   MODIFIER UN DOCUMENT — /mes-documents/?edit=ID (16/09/2026)

   L'écran alignait le titre « Modifier le document », une pastille, puis vingt
   champs identiques dans une seule colonne : rien pour se repérer, et
   « Enregistrer » tout en bas à gauche.

   Il reprend ici l'en-tête, les sections, les pastilles et les boutons du kit
   (`.li-es-hero`, `.li-es-sec`, `.li-es-pill`, `.li-es-btn`) : ce bloc ne pose
   QUE ce que le kit n'a pas — la grille des champs et la barre de validation.
   Les lignes de saisie elles-mêmes (`.li-edit-row`, `.li-edit-todo`) restent
   celles de inc/doc-assistant.php, inchangées.
   ========================================================================== */
.li-docedit{margin:0 0 clamp(48px,7vw,96px)}
.li-docedit__bread{display:block;width:fit-content;margin:0 0 10px;font-size:.8rem;font-weight:700;color:var(--a-d);text-decoration:none}
.li-docedit__bread:hover{text-decoration:underline}
.li-docedit .li-es-hero{margin-bottom:26px}
.li-docedit .li-es-sec__h{align-items:center}
.li-docedit .li-es-sec__h p{flex-basis:100%}

/* Deux colonnes dès qu'il y a la place : vingt champs en file indienne, c'est
   une page de défilement pour rien. Les champs longs (adresses, règles) tiennent
   la largeur entière. */
.li-docedit__grid{display:grid;gap:14px 20px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
  padding:20px 22px;border:1px solid var(--a-l);border-radius:var(--es-r);background:#fff;box-shadow:var(--es-sh)}
.li-docedit__grid .li-edit-row{margin:0;min-width:0}
.li-docedit__grid .li-edit-row:has(input[name="f[bien_adresse]"]),
.li-docedit__grid .li-edit-row:has(input[name="f[regles_autres]"]),
.li-docedit__grid .li-edit-row:has(input[name="doc_title"]){grid-column:1/-1}

/* La section où il reste quelque chose à faire porte le liseré ambre — repère
   discret, lisible d'un coup d'œil en descendant la page. */
.li-docedit__sec--todo .li-docedit__grid{border-color:rgba(208,134,30,.34);box-shadow:inset 3px 0 0 var(--gold,#E0A63C),var(--es-sh)}

/* Validation à DROITE (règle maison) ; l'avertissement reste à gauche : il se
   lit avant de valider, pas après. */
.li-docedit__bar{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin:26px 0 0;padding:18px 22px;
  border:1px solid var(--a-l);border-radius:var(--es-r);background:var(--a-s)}
.li-docedit__warn{flex:1 1 300px;margin:0;font-size:.85rem;line-height:1.5;color:var(--es-am)}
.li-docedit__acts{display:flex;flex-wrap:wrap;gap:10px;margin-left:auto}

/* `.li-es-btn` n'est pas durci pour <button> : le thème impose sa hauteur, ses
   majuscules et son fond aux boutons d'envoi. On neutralise ICI seulement —
   la règle n'a aucune portée hors de cet écran. */
.li-docedit__acts button.li-es-btn{-webkit-appearance:none;appearance:none;cursor:pointer;font-family:inherit;
  line-height:1.2;height:auto;min-height:0;text-transform:none;letter-spacing:normal;border:0!important;
  border-radius:999px!important;text-shadow:none;background:linear-gradient(135deg,var(--a-g1),var(--a-g2))!important}
.li-docedit__acts .li-es-btn:focus-visible{outline:2px solid var(--a-d);outline-offset:2px}

@media (max-width:600px){
  .li-docedit__grid{padding:16px 15px;border-radius:18px}
  .li-docedit__bar{padding:16px 15px;border-radius:18px}
  .li-docedit__acts{width:100%;margin-left:0}
  /* Au pouce, la validation prend la largeur : elle reste la dernière, donc
     toujours « à droite » dans l'ordre de lecture. */
  .li-docedit__acts .li-es-btn{flex:1 1 100%;justify-content:center}
}

/* Champ de saisie du message : fond blanc franc, pour ressortir sur le crème de
   la page (demande 16/09, constat mobile). Ombre douce plutôt qu'un trait dur. */
.li-msgux-panel--conv>form .hp-form__field--textarea>textarea,
.li-msgux-panel--conv>form .hp-form__field--textarea>input[type=text]{
  background:#fff;border:1px solid #EFE6EA;
  box-shadow:0 1px 2px rgba(58,20,38,.05),0 8px 20px -16px rgba(58,20,38,.28)}
.li-msgux-panel--conv>form .hp-form__field--textarea>textarea:focus{
  background:#fff;border-color:var(--a-i,#EE3D6F)}

/* Texte d'en-tête : en-tête en flex (17/09), le texte prend toute la place restante, le visuel de droite seulement la sienne ;
   toute la largeur sur téléphone (deux tiers d'un écran étroit serait illisible). */
@media (max-width:720px){.li-es-lead{max-width:none}}

/* (17/09/2026) MES ANNONCES — repère « ★ À la une » sur la photo de la carte.
   Badge du catalogue réutilisé tel quel (.li-boost-badges > .li-flag--featured,
   hivepress.css) ; ici seulement son ancrage coin haut gauche. Ombre renforcée +
   liseré clair : lisible sur une photo claire comme sombre. Aucun autre badge
   n'est posé sur la photo (statut et « Urgent » sont dans l'en-tête du corps). */
.li-myl-card__media{position:relative}
.li-myl-card__media>.li-myl-card__une{position:absolute;top:12px;left:12px;z-index:2;margin:0;pointer-events:none}
.li-myl-card__une .li-flag--featured{box-shadow:0 0 0 1.5px rgba(255,255,255,.85),0 3px 12px rgba(36,23,38,.38)}
@media (max-width:600px){.li-myl-card__media>.li-myl-card__une{top:10px;left:10px}}

/* Ligne de vues sur la carte d'une annonce (20/09/2026). Un chiffre, discret :
   c'est une information, pas une réclame. */
.li-vues{display:inline-flex;align-items:center;gap:6px;margin:0}
.li-vues i{color:var(--ink-3,#9A8C9B)}
.li-vues__eco{color:var(--ink-3,#9A8C9B);font-size:.88em}

/* Séparateur de la ligne de vues (20/09/2026). Décoratif : masqué aux lecteurs
   d'écran, qui entendent « 10 vues À la une » sans puce parasite. */
.li-vues__sep{color:var(--border,#EEE3DB);margin:0 1px}