/* Support RU - Portail public, theme clair et propre */
/* Livraison 6 (règle RU Design : aucune priorité forcée) : les règles qui devaient
   battre le thème ou un autre logiciel portent :not(#mhhs-sans-id) sur leur
   premier sélecteur. Cet identifiant n'existe nulle part : la règle s'applique
   partout, avec la force d'un identifiant, sans priorité forcée. */
body.mhhs-standalone{margin:0;background:#f4f5f7}
.mhhs-portal{--y:var(--ru-accent,#1d5c8f);--yd:var(--ru-accent,#1d5c8f);--bg:#f4f5f7;--w:#fff;--bd:var(--ru-bord,rgba(0,0,0,.10));--tx:var(--ru-texte,#0e2438);--mu:var(--ru-discret,#6b7280);--dark:var(--ru-surface,#F6F6F4);font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);font-size:16px;color:var(--tx);max-width:980px;margin:20px auto;background:var(--w);border:1px solid var(--bd);border-radius:18px;box-shadow:0 10px 40px rgba(0,0,0,.06)}
/* Pas d'overflow:hidden sur la carte, sinon le menu deroulant est coupe. On arrondit
   plutot les coins du premier et du dernier bloc. */
.mhhs-portal .mhhs-p-top{border-radius:18px 18px 0 0}
.mhhs-portal .mhhs-p-body{border-radius:0 0 18px 18px}
.mhhs-portal *{box-sizing:border-box}
.mhhs-p-top{display:flex;align-items:center;gap:16px;padding:0 22px;height:60px;border-bottom:1px solid var(--bd);background:#fff}
.mhhs-p-brand{flex:1;font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);font-weight:800;letter-spacing:.04em;font-size:20px}
.mhhs-p-brand b{color:var(--yd);font-weight:800}
.mhhs-p-login{border:1px solid var(--bd);background:#fff;border-radius:8px;padding:8px 15px;font-size:13px;font-weight:600;color:var(--tx);text-decoration:none}
.mhhs-p-login:hover{border-color:var(--y)}
.mhhs-p-faq{border:1px solid var(--bd);background:#fff;border-radius:100px;padding:9px 16px;font-size:13px;font-weight:700;color:var(--tx);text-decoration:none;transition:.16s}
.mhhs-p-faq:hover{border-color:var(--y)}
.mhhs-p-hero{background:var(--dark);color:var(--tx);border-bottom:1px solid var(--bd);padding:40px 34px 34px;position:relative;overflow:hidden}
.mhhs-p-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 100% 0,var(--ru-accent-doux,rgba(44,111,181,.12)),transparent 60%)}
.mhhs-p-hero>*{position:relative;z-index:1}
.mhhs-p-eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--mu);margin-bottom:12px}
.mhhs-p-hero h1{font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);font-size:clamp(34px,6vw,58px);letter-spacing:.02em;line-height:.95;margin:0 0 10px}
.mhhs-p-hero p{color:var(--mu);max-width:560px;font-size:14px;line-height:1.6;margin:0}
.mhhs-p-hint{margin-top:18px}
.mhhs-p-badge{display:inline-flex;align-items:center;gap:8px;background:var(--ru-accent-doux,rgba(44,111,181,.12));border:1px solid var(--ru-accent-filet,rgba(44,111,181,.45));color:var(--y);border-radius:100px;padding:7px 14px;font-size:12px;font-weight:600}
.mhhs-p-tabs{display:flex;gap:2px;padding:0 20px;border-bottom:1px solid var(--bd);background:#fff;flex-wrap:wrap}
.mhhs-tab{border:none;background:none;padding:16px 18px;font-size:14px;font-weight:600;color:var(--mu);cursor:pointer;border-bottom:3px solid transparent;font-family:inherit}
.mhhs-tab:hover{color:var(--tx)}
.mhhs-tab.is-active{color:var(--tx);border-bottom-color:var(--y)}
.mhhs-pin{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.05em;background:var(--y);color:var(--ru-sur-accent,#FFFFFF);border-radius:100px;padding:2px 7px;margin-left:6px;vertical-align:middle}
.mhhs-p-body{padding:26px 30px 34px;background:#fff}
.mhhs-panel{display:none}.mhhs-panel.is-active{display:block;animation:mhhsf .2s ease}
@keyframes mhhsf{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.mhhs-lead,.mhhs-fl{font-size:13px;color:var(--mu);margin:0 0 16px}
.mhhs-fl{font-weight:600;color:var(--tx)}
.mhhs-req{color:#d63638}

.mhhs-dd{position:relative;margin-bottom:22px;max-width:520px}
.mhhs-dd-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--bd);background:#fff;border-radius:10px;padding:13px 15px;font-size:14px;cursor:pointer;font-family:inherit;color:var(--tx)}
.mhhs-dd-btn:hover{border-color:var(--y)}.mhhs-dd-btn .ph{color:var(--mu)}
.mhhs-dd.open .mhhs-dd-btn{border-color:var(--y);box-shadow:0 0 0 3px var(--ru-accent-doux,rgba(44,111,181,.12))}
.mhhs-dd-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--bd);border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.14);z-index:10;overflow:hidden}
.mhhs-dd.open .mhhs-dd-menu{display:block}
.mhhs-dd-opt{display:flex;align-items:center;gap:12px;padding:12px 15px;cursor:pointer;font-size:14px}
.mhhs-dd-opt:hover{background:#fafafa}.mhhs-dd-opt .ic{font-size:18px;width:22px;text-align:center}

.mhhs-field{margin-bottom:18px}
.mhhs-field label.q{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
.mhhs-field .mhhs-help{font-size:12.5px;color:var(--mu);margin:-2px 0 8px;line-height:1.5}
.mhhs-field input,.mhhs-field select,.mhhs-field textarea{width:100%;padding:11px 13px;border:1px solid var(--bd);border-radius:9px;font-size:14px;font-family:inherit;background:#fff}
.mhhs-field input:focus,.mhhs-field select:focus,.mhhs-field textarea:focus{outline:none;border-color:var(--y);box-shadow:0 0 0 3px var(--ru-accent-doux,rgba(44,111,181,.12))}
.mhhs-field textarea{min-height:90px}
.mhhs-radios{display:flex;flex-direction:column;gap:8px}
.mhhs-radios label{display:flex;align-items:center;gap:9px;font-size:14px;padding:11px 14px;border:1px solid var(--bd);border-radius:9px;cursor:pointer}
.mhhs-radios label:hover{border-color:var(--y)}
.mhhs-cond{border-left:3px solid var(--y);padding-left:14px;margin-left:2px}
.mhhs-cond-tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--yd);background:var(--ru-accent-doux,rgba(44,111,181,.12));border-radius:100px;padding:2px 8px;margin-bottom:8px}
.mhhs-filebox{border:1px dashed var(--bd);border-radius:9px;padding:12px 14px;font-size:13px;color:var(--mu)}
.mhhs-account{background:#f7f8fa;border:1px solid #e6e7ea;border-radius:14px;padding:16px 18px;margin:20px 0}
.mhhs-account h4{margin:0 0 10px;font-size:14px}
.mhhs-account .note{font-size:12.5px;color:var(--tx);opacity:.75;margin-bottom:12px}
.mhhs-accept{display:flex;align-items:flex-start;gap:9px;font-size:13px;margin-top:6px}
.mhhs-accept a{color:var(--yd);font-weight:600}
.mhhs-btn{display:inline-flex;align-items:center;gap:8px;background:var(--y);color:var(--ru-sur-accent,#FFFFFF);border:none;border-radius:10px;padding:13px 26px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.mhhs-btn:hover{background:var(--ru-accent-fonce,#174a73)}
.mhhs-msg{margin-top:14px;font-size:13px}.mhhs-msg.err{color:#a61b1d}.mhhs-msg.ok{color:#137a3a}
.mhhs-success{text-align:center;padding:36px 20px}.mhhs-success .ic{font-size:52px}.mhhs-success h3{margin:14px 0 6px;font-size:20px}
.mhhs-success code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#f0f0f0;padding:4px 10px;border-radius:6px;display:inline-block;margin-top:6px}

.mhhs-empty{text-align:center;padding:34px;color:var(--mu);border:1px dashed var(--bd);border-radius:12px}
.mhhs-login-prompt{text-align:center;padding:40px 24px;border:1px dashed var(--bd);border-radius:12px}
.mhhs-login-prompt p{margin:0 0 16px;color:var(--mu);font-size:15px}
/* Encart « allez dans votre hub » (membres connectes / renvoi Mes demandes) */
.mhhs-hub-invite{text-align:center;max-width:560px;margin:8px auto;padding:34px 24px}
.mhhs-hub-invite .ic{font-size:34px;margin-bottom:10px}
.mhhs-hub-invite h3{font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);font-size:26px;letter-spacing:.01em;margin:0 0 8px;color:var(--tx)}
.mhhs-hub-invite p{color:var(--mu);font-size:15px;line-height:1.6;margin:0 auto 18px;max-width:460px}
.mhhs-hub-invite .mhhs-p-cta{margin:0 auto}
.mhhs-hub-invite-note:not(#mhhs-sans-id){font-size:12.5px;color:var(--mu);margin-top:14px}
.mhhs-tickets-list{display:flex;flex-direction:column;gap:10px}
.mhhs-ticket-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fafafa;border:1px solid var(--bd);border-radius:10px;padding:13px 15px}
.mhhs-ticket-row:hover{border-color:var(--y)}
.mhhs-ticket-title{font-weight:600;font-size:14px}
.mhhs-ticket-meta{font-size:12px;color:var(--mu);margin-top:3px}
.mhhs-badge{font-size:11px;font-weight:700;padding:4px 10px;border-radius:100px;background:#eee;color:#333}
.mhhs-badge-nouveau{background:#e7f0ff;color:#1565C0}
.mhhs-badge-ouvert{background:#d8f0f3;color:#0e6f79}
.mhhs-badge-en_attente{background:#f0f0ec;color:#4a4a44}
.mhhs-badge-resolu,.mhhs-badge-ferme{background:#e3f6e9;color:#137a3a}
.mhhs-my-back{display:inline-block;margin-bottom:12px;color:var(--mu);text-decoration:none;font-size:13px;cursor:pointer}
/* Fil de conversation facon messagerie : membre a droite (or), equipe a gauche (acier).
   Cloisonne sous #mhhs-portal pour ne pas deborder sur d'autres modules. */
#mhhs-portal .mhhs-thread{display:flex;flex-direction:column;gap:14px}
/* Espacement uniforme : la seule distance entre bulles vient du gap du fil ;
   on neutralise les marges internes (paragraphes wpautop) qui rendaient
   l'espacement irregulier (parfois colle, parfois trop distance). */
#mhhs-portal .mhhs-bubble{margin:0}
#mhhs-portal .mhhs-bubble-b > :first-child{margin-top:0}
#mhhs-portal .mhhs-bubble-b > :last-child{margin-bottom:0}
#mhhs-portal .mhhs-bubble{display:flex;flex-wrap:wrap;gap:11px;max-width:82%;background:#fff;border:1px solid #e8eaed;border-radius:16px;padding:11px 15px;font-size:13px;line-height:1.6;box-shadow:0 1px 2px rgba(0,0,0,.05)}
#mhhs-portal .mhhs-bubble.is-agent{background:#f5f8fb;border-color:#e2eaf2;align-self:flex-start}
#mhhs-portal .mhhs-bubble.is-client{background:#f6f6f4;border-color:#e9e7de;align-self:flex-end;flex-direction:row-reverse}
#mhhs-portal .mhhs-b-av{flex:none;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12.5px;color:#fff}
#mhhs-portal .mhhs-b-av.ag{background:linear-gradient(135deg,#3a4657,#1f2733)}
#mhhs-portal .mhhs-b-av.cl{background:linear-gradient(135deg,var(--ru-accent,#1d5c8f),#f5a300);color:var(--ru-accent,#1d5c8f)}
#mhhs-portal .mhhs-b-av.has-photo{background:none;color:transparent;overflow:hidden;box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(0,0,0,.06)}
#mhhs-portal .mhhs-b-av img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
#mhhs-portal .mhhs-b-main{flex:1;min-width:0}
#mhhs-portal .mhhs-bubble-h{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
#mhhs-portal .mhhs-bubble-h strong{font-size:12.5px;color:var(--ru-texte,#0e2438);font-weight:800}
#mhhs-portal .mhhs-role{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:2px 7px;border-radius:100px}
#mhhs-portal .mhhs-role.r-ag{background:#e7edf3;color:#274b6b}
#mhhs-portal .mhhs-role.r-cl{background:#f0f0ec;color:#4a4a44}
#mhhs-portal .mhhs-b-time .mhhs-bubble-edited{color:#9aa0a8;font-size:11px;font-style:italic}
#mhhs-portal .mhhs-bubble-b{color:#2a2f3c}
#mhhs-portal .mhhs-bubble-b p{margin:0 0 8px}#mhhs-portal .mhhs-bubble-b p:last-child{margin-bottom:0}
#mhhs-portal .mhhs-bubble-acts{display:flex;gap:12px;margin-top:6px}
#mhhs-portal .mhhs-bubble-act{border:none;background:none;color:#9aa0a8;font-size:11px;font-weight:700;cursor:pointer;padding:0}
#mhhs-portal .mhhs-bubble-act:hover{color:var(--ru-texte,#0e2438)}
#mhhs-portal .mhhs-b-seen{display:block;margin-top:5px;font-size:10.5px;font-weight:800;letter-spacing:.02em;color:#137a3a;text-align:right}
#mhhs-portal .mhhs-b-seen::before{content:"\2713 ";}
/* Colonne/pastille « Réponse » dans la liste des demandes */
#mhhs-portal .mhhs-ticket-badges{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}
#mhhs-portal .mhhs-resp{display:inline-block;font-size:11px;font-weight:700;border-radius:100px;padding:3px 9px;white-space:nowrap}
#mhhs-portal .mhhs-resp-a_lire{background:var(--ru-accent-doux,rgba(44,111,181,.12));color:var(--ru-accent,#1d5c8f)}
#mhhs-portal .mhhs-resp-attente_equipe{background:#eef2f6;color:#4a5666}
#mhhs-portal .mhhs-resp-repondu,#mhhs-portal .mhhs-resp-resolu{background:#e3f6e9;color:#137a3a}
#mhhs-portal .mhhs-resp-ferme{background:#f0f0ec;color:#6b6b63}
/* Vérification d'identité (#17) : carte « Action sécurisée » cote membre */
#mhhs-portal .mhhs-secure{border:1px solid #e7e9ef;background:#fafbfd;border-radius:14px;padding:14px 16px;margin:0 0 16px}
#mhhs-portal .mhhs-secure.is-ok{background:#f3fbf5;border-color:#cfe8d6}
#mhhs-portal .mhhs-sec-h{font-weight:800;font-size:14px;color:var(--ru-texte,#0e2438)}
#mhhs-portal .mhhs-sec-d{font-size:13px;color:#5b6472;margin:5px 0 11px;line-height:1.5}
#mhhs-portal .mhhs-sec-btns{display:flex;gap:9px;flex-wrap:wrap}
#mhhs-portal .mhhs-sec-badge{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:13px;color:#137a3a}
#mhhs-portal .mhhs-sec-badge::before{content:"\2713";font-weight:900}
#mhhs-portal .mhhs-sec-badge em{font-style:normal;font-weight:600;color:#4a7a55}
#mhhs-portal .mhhs-sec-area{margin-top:11px}
#mhhs-portal .mhhs-sec-code{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#mhhs-portal .mhhs-sec-code-in{padding:9px 12px;border:1px solid #d5dae2;border-radius:9px;font-size:16px;letter-spacing:.25em;width:150px;text-align:center;font-variant-numeric:tabular-nums}
#mhhs-portal .mhhs-sec-enroll{background:#fff;border:1px solid #e7e9ef;border-radius:10px;padding:11px 13px}
#mhhs-portal .mhhs-sec-eh{font-weight:800;font-size:13px;margin-bottom:4px}
#mhhs-portal .mhhs-sec-ed{font-size:12.5px;color:#5b6472;line-height:1.5;margin-bottom:9px}
#mhhs-portal .mhhs-sec-msg{font-size:12.5px;color:#5b6472;margin-top:8px}
#mhhs-portal .mhhs-sec-msg.err{color:#b3261e}
#mhhs-portal .mhhs-typing{align-self:flex-start;display:inline-flex;align-items:center;gap:9px;background:#f5f8fb;border:1px solid #e2eaf2;border-radius:16px;padding:9px 14px;font-size:12px;color:#6b7280}
#mhhs-portal .mhhs-typing-dots{display:inline-flex;gap:3px}
#mhhs-portal .mhhs-typing-dots i{width:6px;height:6px;border-radius:50%;background:#9aa7b6;display:block;animation:mhhs-typ 1.2s infinite ease-in-out}
#mhhs-portal .mhhs-typing-dots i:nth-child(2){animation-delay:.2s}
#mhhs-portal .mhhs-typing-dots i:nth-child(3){animation-delay:.4s}
@keyframes mhhs-typ{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
#mhhs-portal .mhhs-bubble-edit{flex-basis:100%;width:100%;margin-top:8px}
@media(max-width:640px){.mhhs-p-body{padding:20px 16px}.mhhs-p-hero{padding:28px 20px}}

/* =====================================================================
   Durcissement : la page autonome charge encore les styles du theme
   (Zox News) via wp_head(). On protege l apparence du portail contre
   les regles du theme (titres noirs, champs pleine largeur, etc.).
   ===================================================================== */
.mhhs-portal:not(#mhhs-sans-id) .mhhs-p-hero h1{color:var(--tx)}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-p-hero p{color:var(--mu)}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-p-eyebrow{color:var(--mu)}
.mhhs-portal .mhhs-p-hero,.mhhs-portal .mhhs-p-hero *{text-align:left}

/* Cases radio / cases a cocher : ne jamais les etirer sur toute la largeur */
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=radio],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=checkbox]{
  width:auto;flex:0 0 auto;margin:0;box-shadow:none;min-width:0;accent-color:var(--yd)}

/* Options : boutons standard, une par ligne, hauteur normale. On neutralise toute
   hauteur imposee par le theme (min-height/height/line-height). */
.mhhs-portal .mhhs-radios{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-radios label{
  display:flex;align-items:center;justify-content:flex-start;text-align:left;gap:10px;
  width:100%;height:auto;min-height:0;
  background:#fff;color:var(--tx);font-weight:500;margin:0;
  padding:12px 14px;border:1px solid var(--bd);border-radius:10px;cursor:pointer;
  line-height:1.35;font-size:14px}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-radios label:hover{border-color:var(--y);background:#f6f6f4}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-radios label:has(input:checked){border-color:var(--y);background:#f6f6f4;box-shadow:0 0 0 2px var(--ru-accent-doux,rgba(44,111,181,.12))}

/* ===== Formulaire compact : colonne de lecture resserree et centree =====
   On borne le contenu de chaque panneau a une largeur confortable et on le centre :
   fini la grande bande blanche a droite des cartes d'options, rendu plus pro. */
.mhhs-portal--open .mhhs-p-body .mhhs-panel{max-width:720px;margin-left:auto;margin-right:auto}
.mhhs-portal--open .mhhs-p-body{padding:20px 26px 26px}
.mhhs-portal--open .mhhs-field{margin-bottom:12px}
.mhhs-portal--open .mhhs-field label.q{font-size:14px;margin-bottom:5px}
.mhhs-portal--open .mhhs-field input,
.mhhs-portal--open .mhhs-field select,
.mhhs-portal--open .mhhs-field textarea{padding:9px 12px;font-size:14px}
.mhhs-portal--open .mhhs-field textarea{min-height:74px}
.mhhs-portal--open .mhhs-radios{gap:6px}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-radios label{padding:9px 13px;font-size:14px}
.mhhs-portal--open .mhhs-p-tabs{padding:0 20px}
.mhhs-portal--open .mhhs-tab{padding:13px 16px}
@media(max-width:640px){.mhhs-portal--open .mhhs-p-body{padding:16px 14px 20px}}

/* Menu deroulant de division : toujours au-dessus du contenu qui suit.
   Le theme du site (Zox News) impose un z-index eleve aux champs de formulaire
   (input/select), ce qui les faisait passer AU-DESSUS du menu deroulant : le menu
   s ouvrait mais restait cache derriere la boite du dessous. Correction a la source :
   on isole le conteneur du formulaire dans son propre contexte d empilement, bas et
   ferme. Son contenu ne peut alors plus remonter au-dessus du menu, quel que soit le
   z-index impose par le theme. */
.mhhs-portal .mhhs-dd{position:relative;z-index:5}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-dd.open{z-index:200}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-dd-menu{z-index:1000}
.mhhs-portal #mhhs-p-aide{position:relative;z-index:0;isolation:isolate}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-dd-menu .mhhs-dd-opt{color:var(--tx);background:#fff}
.mhhs-portal .mhhs-dd-menu .mhhs-dd-opt:hover{background:#fafafa}

/* Champs texte : garder le style du portail meme si le theme s en mele */
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=text],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=email],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=tel],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=url],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field input[type=date],
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field select,
.mhhs-portal:not(#mhhs-sans-id) .mhhs-field textarea{width:100%;background:#fff;color:var(--tx)}

/* Invitation a se connecter (onglet Mes demandes, visiteur non connecte) */
.mhhs-portal .mhhs-login-cta{text-align:center;padding:30px 22px;border:1px dashed var(--bd);border-radius:12px;background:#fafafa}
.mhhs-portal .mhhs-login-cta p{font-size:14px;color:var(--tx);margin:0 0 14px}
.mhhs-portal .mhhs-login-cta .mhhs-btn{text-decoration:none}

/* Champ liens multiples (liens cloud illimites) */
.mhhs-portal .mhhs-links{display:flex;flex-direction:column;gap:8px}
.mhhs-portal .mhhs-link-row{display:flex;gap:8px;align-items:center}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-link-row input[type=url]{flex:1 1 auto;width:auto}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-link-del{flex:0 0 auto;width:40px;height:42px;border:1px solid var(--bd);background:#fff;border-radius:9px;cursor:pointer;font-size:20px;line-height:1;color:var(--mu)}
.mhhs-portal .mhhs-link-del:hover{border-color:#d63638;color:#d63638}
.mhhs-portal:not(#mhhs-sans-id) .mhhs-link-add{align-self:flex-start;background:#fff;border:1px dashed var(--bd);border-radius:9px;padding:9px 15px;font-size:13px;font-weight:700;cursor:pointer;color:var(--yd)}
.mhhs-portal .mhhs-link-add:hover{border-color:var(--y)}

/* Ecran de confirmation, plus soigne */
.mhhs-portal .mhhs-success{max-width:520px;margin:10px auto;padding:40px 26px;text-align:center;background:#fff;border:1px solid var(--bd);border-radius:16px}
.mhhs-portal .mhhs-success .ic{font-size:56px;line-height:1}
.mhhs-portal .mhhs-success h3{margin:14px 0 8px;font-size:22px;color:var(--tx)}
.mhhs-portal .mhhs-success p{color:var(--mu);font-size:14px;line-height:1.6;margin:0 auto 14px;max-width:400px}
.mhhs-portal .mhhs-success code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#f6f6f4;border:1px solid #e9e7de;color:var(--yd);padding:6px 12px;border-radius:8px;display:inline-block;font-weight:700}

/* =====================================================================
   Portail : variante CLAIRE et OUVERTE (sans gros cadre), avec bouton
   d'appel en haut, défilement fluide vers le formulaire et flèche de
   retour en haut. Le fond noir est retiré au profit d'un thème clair.
   ===================================================================== */
.mhhs-portal--open:not(#mhhs-sans-id){max-width:1080px;margin:0 auto;background:transparent;border:none;box-shadow:none;border-radius:0;font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif)}

/* Barre du haut : collante, claire, avec le bouton d'appel */
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--bd);border-radius:0;height:auto;padding:12px 22px;gap:14px;flex-wrap:wrap}
.mhhs-portal--open .mhhs-p-brand{font-size:19px}

/* Bouton d'appel (CTA) */
.mhhs-p-cta{display:inline-flex;align-items:center;gap:9px;background:var(--y);color:var(--ru-sur-accent,#FFFFFF);border:none;border-radius:100px;padding:10px 18px;font-weight:800;font-size:13px;line-height:1.15;text-decoration:none;cursor:pointer;box-shadow:0 4px 14px var(--ru-accent-filet,rgba(44,111,181,.45));transition:transform .16s,box-shadow .16s,background .16s}
.mhhs-p-cta:hover{background:var(--ru-accent-fonce,#174a73);box-shadow:0 6px 22px var(--ru-accent-filet,rgba(44,111,181,.45))}
.mhhs-p-cta .ic{font-size:15px;line-height:1}
.mhhs-p-cta-lg{font-size:15px;padding:15px 30px}
.mhhs-p-cta-lg .arr{font-size:16px}
@keyframes mhhs-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@media(max-width:720px){.mhhs-portal--open .mhhs-p-top .mhhs-p-cta{display:none}}

/* Hero clair */
.mhhs-portal--open .mhhs-p-hero{background:transparent;color:var(--tx);padding:56px 24px 42px;text-align:center;overflow:visible}
.mhhs-portal--open .mhhs-p-hero::after{display:none}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-eyebrow{color:var(--yd);justify-content:center;letter-spacing:.2em}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-hero h1{font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);color:var(--tx);font-size:clamp(46px,8vw,86px);line-height:.92;letter-spacing:.02em;margin:0 0 14px;text-align:center}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-hero p{color:var(--mu);max-width:600px;margin:0 auto;font-size:15px;line-height:1.75;text-align:center}
.mhhs-p-hero-actions{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:32px}
.mhhs-p-hero-actions .mhhs-p-badge{background:var(--ru-accent-doux,rgba(44,111,181,.12));border:1px solid var(--ru-accent-filet,rgba(44,111,181,.45));color:var(--yd);border-radius:100px;padding:7px 15px;font-size:12px;font-weight:600}

/* Section formulaire : carte blanche propre (ancre du défilement) */
.mhhs-portal--open .mhhs-p-form{scroll-margin-top:76px;background:#fff;border:1px solid var(--bd);border-radius:18px;box-shadow:0 12px 44px rgba(0,0,0,.06);overflow:visible;margin:6px 0 64px}
.mhhs-portal--open .mhhs-p-tabs{border-radius:18px 18px 0 0}
.mhhs-portal--open .mhhs-p-body{border-radius:0 0 18px 18px}

/* Flèche « remonter en haut » flottante à droite */
.mhhs-totop{position:fixed;right:20px;bottom:24px;z-index:80;width:46px;height:46px;border-radius:50%;background:var(--y,var(--ru-accent,#1d5c8f));color:var(--ru-sur-accent,#FFFFFF);display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.2);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .22s,transform .22s,visibility .22s,background .16s}
.mhhs-totop.show{opacity:1;visibility:visible;transform:translateY(0)}
.mhhs-totop:hover{background:var(--ru-accent-fonce,#174a73)}
@media(max-width:680px){.mhhs-totop{right:14px;bottom:16px;width:42px;height:42px;font-size:20px}}

/* ===== Lot visuel : logo, boutons haut-droite, trust en premier, CTA noir ===== */
/* Barre du haut : logo a gauche, boutons a droite */
.mhhs-portal--open .mhhs-p-logo{display:inline-flex;align-items:center;flex:0 0 auto;text-decoration:none}
.mhhs-portal--open .mhhs-p-logo img{height:46px;width:auto;display:block}
.mhhs-portal--open .mhhs-p-topright{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
/* Bouton Hub des abonnes : fond bleu (accent), texte blanc FORCE (le theme ne doit
   jamais le repasser en noir sur bleu). On monte la specificite (:not(#mhhs-sans-id))
   sur la couleur du texte, sur le lien ET sur ses enfants (texte + fleche). */
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-topright .mhhs-p-hub,
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-topright a.mhhs-p-hub{display:inline-flex;align-items:center;gap:7px;background:var(--ru-accent,#1d5c8f);color:var(--ru-sur-accent,#FFFFFF);border:1px solid var(--ru-accent,#1d5c8f);border-radius:100px;padding:9px 16px;font-size:13px;font-weight:800;text-decoration:none;transition:.16s}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-topright .mhhs-p-hub *{color:var(--ru-sur-accent,#FFFFFF)}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-topright .mhhs-p-hub:hover{background:var(--ru-accent-fonce,#174a73);color:var(--ru-sur-accent,#FFFFFF)}
.mhhs-p-hub .arr{transition:transform .16s}
.mhhs-p-hub:hover .arr{transform:translateX(3px)}

/* Boutons d'appel (CTA) : fond bleu (accent), texte blanc (force de la meme facon) */
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-cta{background:var(--ru-accent,#1d5c8f);color:var(--ru-sur-accent,#FFFFFF);box-shadow:0 6px 18px rgba(0,0,0,.22)}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-cta *{color:var(--ru-sur-accent,#FFFFFF)}
.mhhs-portal--open:not(#mhhs-sans-id) .mhhs-p-cta:hover{background:var(--ru-accent-fonce,#174a73);color:var(--ru-sur-accent,#FFFFFF);box-shadow:0 8px 24px rgba(0,0,0,.3)}

/* Section « Ils nous font confiance » (en premier, en haut de page) */
.mhhs-portal--open .mhhs-p-trust{padding:52px 24px 10px;text-align:center}
.mhhs-p-trust-head{max-width:720px;margin:0 auto 26px}
.mhhs-p-trust-head h2{font-family:var(--ru-police,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif);font-size:clamp(32px,4.8vw,56px);line-height:1.02;letter-spacing:.015em;margin:6px 0 12px;color:var(--tx)}
.mhhs-p-trust-head p{color:var(--mu);font-size:16px;line-height:1.6;margin:0 auto;max-width:600px}
/* Le bouton d'appel vit maintenant juste sous le texte de la section confiance */
.mhhs-p-trust-head .mhhs-p-hero-actions{margin-top:22px}
.mhhs-p-trust-lbl{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--mu);margin:22px 0 14px}
.mhhs-p-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:0 auto}
.mhhs-portal--open .mhhs-chip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--bd);border-radius:100px;padding:9px 16px;font-size:13px;font-weight:600;color:var(--tx);text-decoration:none;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:.14s}
.mhhs-portal--open .mhhs-chip:hover{border-color:var(--y)}
.mhhs-portal--open .mhhs-chip.ag{border-color:var(--ru-accent-filet,rgba(44,111,181,.45))}
.mhhs-portal--open .mhhs-chip .dot{width:6px;height:6px;border-radius:50%;background:var(--y);flex:0 0 auto}

/* ===== Formulaire en assistant (etapes) ===== */
.mhhs-stepper{display:flex;align-items:flex-start;gap:0;margin:0 0 6px}
.mhhs-stp{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;text-align:center}
.mhhs-stp::before{content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:var(--bd);z-index:0}
.mhhs-stp:first-child::before{display:none}
.mhhs-stp.done::before,.mhhs-stp.cur::before{background:var(--y)}
.mhhs-stp .num{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;background:#fff;border:2px solid var(--bd);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--mu)}
.mhhs-stp.cur .num,.mhhs-stp.done .num{border-color:var(--y);background:var(--y);color:var(--ru-sur-accent,#FFFFFF)}
.mhhs-stp .lb{font-size:11px;font-weight:600;margin-top:7px;color:var(--mu);letter-spacing:.02em;max-width:120px}
.mhhs-stp.cur .lb{color:var(--tx)}
@media(max-width:560px){.mhhs-stp .lb{display:none}}
.mhhs-stepcount{text-align:center;font-size:12px;color:var(--mu);margin:8px 0 14px;font-weight:600}
.mhhs-stepcount b{color:var(--yd)}
.mhhs-step{animation:mhhsf .2s ease}
.mhhs-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}
.mhhs-btn.mhhs-ghost{background:#fff;border:1px solid var(--bd);color:var(--tx)}
.mhhs-btn.mhhs-ghost:hover{border-color:var(--y);background:#fff}
.mhhs-nav .mhhs-next{margin-left:auto}

/* Lot 3 : validation en direct (rouge/vert) */
.mhhs-field.mhhs-err:not(#mhhs-sans-id) input,.mhhs-field.mhhs-err:not(#mhhs-sans-id) textarea,.mhhs-field.mhhs-err:not(#mhhs-sans-id) select,input.mhhs-input-err:not(#mhhs-sans-id){border-color:#e23b3b;box-shadow:0 0 0 2px rgba(226,59,59,.10)}
.mhhs-field.mhhs-ok:not(#mhhs-sans-id) input,.mhhs-field.mhhs-ok:not(#mhhs-sans-id) textarea,.mhhs-field.mhhs-ok:not(#mhhs-sans-id) select{border-color:#2e9e5b}
.mhhs-field-msg{color:#e23b3b;font-size:12px;margin-top:5px}

/* ---- Autocompletion (villes Bottin, recherche artiste) + bandeau membre ---- */
.mhhs-field{position:relative}
.mhhs-ac-menu{position:absolute;left:0;right:0;top:100%;z-index:60;background:#fff;border:1px solid #e2e2e2;border-top:none;border-radius:0 0 10px 10px;box-shadow:0 12px 28px rgba(0,0,0,.14);max-height:280px;overflow:auto}
.mhhs-ac-opt{padding:9px 12px;cursor:pointer;font-size:14px;display:flex;justify-content:space-between;gap:10px;align-items:center;color:var(--ru-texte,#0e2438)}
.mhhs-ac-opt:hover{background:#f4f4f6}
.mhhs-ac-reg{color:#888;font-size:12px;white-space:nowrap}
.mhhs-ac-hint{padding:7px 12px;font-size:11.5px;color:#4a4a44;background:#f6f6f4;border-top:1px solid #e9e7de}
.mhhs-me-note{margin:0 0 14px;padding:10px 14px;background:#eef6ff;border:1px solid #cfe3fb;border-radius:10px;font-size:13px;color:#1c3d5a}
.mhhs-me-mail{color:#5a7a99}

/* Champs Phase 1b : evaluation (etoiles), NPS, curseur (pur CSS, sans JS) */
.mhhs-stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;}
.mhhs-stars input{position:absolute;opacity:0;width:0;height:0;}
.mhhs-stars label{font-size:30px;line-height:1;color:#d3d7dc;cursor:pointer;padding:0 2px;transition:color .12s;}
.mhhs-stars label:hover,.mhhs-stars label:hover ~ label,.mhhs-stars input:checked ~ label{color:var(--ru-accent,#1d5c8f);}
.mhhs-nps{display:flex;flex-wrap:wrap;gap:6px;}
.mhhs-nps input{position:absolute;opacity:0;width:0;height:0;}
.mhhs-nps label{min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid #e6e8eb;border-radius:8px;font-weight:700;cursor:pointer;transition:.12s;}
.mhhs-nps label:hover{border-color:var(--ru-accent,#1d5c8f);}
.mhhs-nps input:checked + label{background:var(--ru-accent,#1d5c8f);color:var(--ru-sur-accent,#FFFFFF);border-color:var(--ru-accent,#1d5c8f);}
.mhhs-range{display:inline-flex;align-items:center;gap:10px;}
.mhhs-range b{min-width:22px;display:inline-block;font-weight:700;color:var(--ru-texte,#0e2438);}

/* Elements de mise en page (Phase 2) */
.mhhs-field.mhhs-layout{border:0;padding:0;background:none;}
.mhhs-secttl{font-size:19px;font-weight:800;color:var(--ru-texte,#0e2438);border-left:4px solid var(--ru-accent,#1d5c8f);padding:2px 0 2px 12px;margin:14px 0 6px;}
.mhhs-sep{border:0;border-top:1px solid #e6e8eb;margin:16px 0;}
.mhhs-textblock{background:#f9fafb;border:1px solid #eef0f2;border-radius:10px;padding:12px 14px;color:#3a3e44;font-size:14px;line-height:1.6;margin:8px 0;}

/* Champ signature electronique (Phase 4) */
.mhhs-sign-wrap{max-width:100%}
.mhhs-sign{border:1.5px dashed #cfd3d8;border-radius:10px;background:#fff;width:100%;max-width:600px;height:auto;touch-action:none;cursor:crosshair;display:block}
.mhhs-sign-clr{margin-top:6px;border:1px solid #e6e8eb;background:#fff;border-radius:8px;padding:6px 12px;cursor:pointer;font-size:12px}
.mhhs-sign-clr:hover{border-color:var(--ru-accent,#1d5c8f)}

/* Icones de division dessinees au trait (2026-08-29) : alignement du SVG
   dans le menu deroulant, a la place des emojis. */
.mhhs-dd-opt .ic{display:flex;align-items:center;justify-content:center}
.mhhs-dd-opt .ic svg{display:block;color:#3c3c43}

/* Delai annonce + suggestions de la FAQ (2026-08-29). */
.mhhs-delai{background:#f6f6f4;border:1px solid #e9e7de;border-radius:10px;padding:9px 13px;
  font-size:13px;color:var(--ru-accent,#1d5c8f);margin:0 0 14px}
.mhhs-delai b{color:#3d3300}
.mhhs-sugg{margin-top:8px;background:#f6f9ff;border:1px solid #d6e3f7;border-radius:10px;padding:10px 12px}
.mhhs-sugg-h{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:12.5px;font-weight:700;color:#274c85;margin-bottom:4px}
.mhhs-sugg-x{border:0;background:transparent;color:#274c85;font-size:16px;cursor:pointer;line-height:1;padding:2px}
.mhhs-sugg-item{border-top:1px solid #e3ecf9;padding:6px 0}
.mhhs-sugg-item summary{cursor:pointer;font-size:13px;font-weight:600;color:#1d2b45}
.mhhs-sugg-body{font-size:13px;line-height:1.55;color:#333;padding:6px 0 2px}
.mhhs-sugg-body p{margin:0 0 8px}
.mhhs-print-link{font-size:12.5px;font-weight:600;color:#5d5d64;text-decoration:underline}
.mhhs-print-link:hover{color:var(--ru-texte,#0e2438)}

/* Lisibilite mobile : bulles de conversation plus grandes sur telephone.
   Le texte des messages passe de 13px a 15px et occupe plus de largeur. */
@media(max-width:640px){
  #mhhs-portal .mhhs-bubble{max-width:92%;font-size:15px;padding:12px 15px;line-height:1.55}
  #mhhs-portal .mhhs-bubble-b{font-size:15px;line-height:1.55}
  #mhhs-portal .mhhs-bubble-h strong{font-size:13.5px}
  #mhhs-portal .mhhs-b-av{width:32px;height:32px;font-size:12px}
  #mhhs-portal .mhhs-bubble-act{font-size:12.5px}
}

/* Toast « bien connecté » (arrivee depuis le courriel de confirmation d'identite) */
.mhhs-toast{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:100001;background:var(--ru-texte,#0e2438);color:#fff;font-weight:700;font-size:14px;padding:12px 18px;border-radius:12px;border:2px solid var(--ru-accent,#1d5c8f);box-shadow:0 12px 34px rgba(0,0,0,.35);max-width:92vw;text-align:center;transition:opacity .5s ease,transform .5s ease}
.mhhs-toast.is-out{opacity:0;transform:translateX(-50%) translateY(-10px)}

/* Bulles membre (portail) : contenu qui ne deborde pas + actions revelees au survol */
#mhhs-portal .mhhs-bubble-b{overflow-wrap:anywhere;word-break:break-word}
#mhhs-portal .mhhs-bubble-b a,#mhhs-portal .mhhs-bubble-b code{overflow-wrap:anywhere;word-break:break-all}
#mhhs-portal .mhhs-bubble-acts{justify-content:flex-end;width:100%;margin-top:8px;padding-top:8px;border-top:1px solid rgba(0,0,0,.06)}
@media(hover:hover) and (pointer:fine){
  #mhhs-portal .mhhs-bubble-acts{opacity:0;transition:opacity .14s ease}
  #mhhs-portal .mhhs-bubble:hover .mhhs-bubble-acts,#mhhs-portal .mhhs-bubble:focus-within .mhhs-bubble-acts{opacity:1}
}

/* Standard mobile RU (2026-10-04) : champs à 16 px sur écran tactile (pas de zoom au focus). */
@media (max-width:999px) and (pointer:coarse){:is(.mhhs-portal,.mhhs-mod,.mhhs-faq,.mhhs-rte,.mhhs-prio,[class*="mhhs-prio-"]):not(#mhhs-sans-id) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea){font-size:16px}}

/* Livraison 6 : sortis des balises (style="..."). Piège à robots du formulaire, lignes de billets cliquables. */
.mhhs-hp-wrap{position:absolute;left:-9999px;top:-9999px;height:0;width:0;overflow:hidden}
.mhhs-ticket-row.mhhs-clic{cursor:pointer}

/* Standard mobile RU (livraison 6) : cibles de 44 px au téléphone. */
@media (max-width:782px){
.mhhs-portal :is(button,.mhhs-btn,.mhhs-p-cta,.mhhs-tab,.mhhs-link-add){min-height:44px}
.mhhs-portal .mhhs-link-del{min-width:44px;min-height:44px}
}
