/* HIVTC 1.99.28 — Pages publiques : pictogrammes, images, formulaires intelligents et confort mobile.
   Chargée après les feuilles existantes ; ne modifie que des éléments ciblés. */
:root{--p28-navy:#012351;--p28-ink:#102a4c;--p28-blue:#249BE1;--p28-cyan:#20E7F6;--p28-muted:#5b6b80;--p28-line:#dbe7f0;--p28-soft:#eef7fd;--p28-ok:#0f9f6e;--p28-err:#c62828}

/* ---------- Pictogrammes ---------- */
.hv-ico{width:1.25em;height:1.25em;flex:none;display:inline-block;vertical-align:-.2em}
.p28-ico-box{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#e9fbff,#e7f1ff);color:var(--p28-blue)}
.p28-ico-box .hv-ico{width:26px;height:26px}
.hv-feature-icon .hv-ico{width:26px;height:26px;color:var(--p28-blue)}
.hv-step .p28-step-ico{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(32,231,246,.12);color:var(--p28-cyan);margin:12px 0 4px}
.hv-step .p28-step-ico .hv-ico{width:24px;height:24px}
/* Accueil : les anciens symboles texte (◇ ▦ ✉ ◎…) deviennent des pictogrammes */
.trust-icon .hv-ico{width:21px;height:21px}
.step-icon .hv-ico{width:28px;height:28px}
.integration-grid article>span .hv-ico{width:20px;height:20px}
.mobile-benefits span .hv-ico,.resource-card>span .hv-ico{width:22px;height:22px}
.check-list li>span .hv-ico{width:13px;height:13px;stroke-width:2.6}

/* ---------- Images ---------- */
.hv-page-media img,.dashboard-frame img,.hv-media-img{max-width:100%;height:auto}
.hv-page-media.is-photo img{object-fit:cover;aspect-ratio:4/3}
.hv-media{position:relative;display:block;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:linear-gradient(145deg,#eef7fd,#f8fbff)}
.hv-media>.hv-media-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
a:hover .hv-media>.hv-media-img,label:hover .hv-media>.hv-media-img{transform:scale(1.03)}
.hv-media-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--p28-blue);background:radial-gradient(circle at 30% 20%,rgba(32,231,246,.18),transparent 55%),linear-gradient(145deg,#e9f6fe,#f6fbff)}
.hv-media-fallback-ico{width:46%;max-width:92px;height:auto;aspect-ratio:1;stroke-width:1.4}
.hv-media-fallback small{font:700 11px Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#6b8199}
.hv-avatar{--av:56px;width:var(--av);height:var(--av);flex:0 0 var(--av);border-radius:calc(var(--av) * .3);display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,var(--p28-navy),var(--p28-blue));color:#fff;font:800 calc(var(--av) * .36)/1 "Plus Jakarta Sans",Inter,sans-serif;letter-spacing:.02em;box-shadow:0 9px 18px rgba(8,121,184,.18)}
.hv-avatar-driver{border-radius:50%}
.hv-avatar.has-img{background:#fff;border:1px solid var(--p28-line)}
.hv-avatar.has-img img{width:100%;height:100%;object-fit:cover}
.hv-avatar-company.has-img img{object-fit:contain;padding:12%}
/* Annuaire : cartes et fiches */
.card2 .c-top{align-items:center}
.p28-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:12px}
.p28-vcard{display:flex;flex-direction:column;border:1px solid var(--p28-line);border-radius:18px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s}
.p28-vcard:hover{box-shadow:0 16px 34px rgba(1,35,81,.10);transform:translateY(-2px)}
.p28-vcard .hv-media{border-radius:0}
.p28-vcard-body{padding:12px 14px 14px;display:grid;gap:4px}
.p28-vcard-body b{color:var(--p28-ink);font-size:15px}
.p28-vcard-body small{color:var(--p28-muted);font-size:12.5px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.p28-vcard-body small .hv-ico{width:15px;height:15px;color:var(--p28-blue)}
.p28-vcard-cta{margin-top:6px;font-weight:800;font-size:13px;color:#0c89c6;display:flex;align-items:center;gap:6px}
.p28-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.p28-chip{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:var(--p28-soft);color:#16507e;font-size:13px;font-weight:700}
.p28-chip .hv-ico{width:16px;height:16px}

/* ---------- Pages : FAQ et contact ---------- */
.p28-faq{display:grid;gap:12px;max-width:860px;margin:0 auto}
.p28-faq details{border:1px solid var(--p28-line);border-radius:16px;background:#fff;padding:0 18px;transition:box-shadow .2s}
.p28-faq details[open]{box-shadow:0 12px 30px rgba(1,35,81,.07)}
.p28-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;min-height:58px;font-weight:750;color:var(--p28-ink);font-size:15.5px}
.p28-faq summary::-webkit-details-marker{display:none}
.p28-faq summary:after{content:"";margin-left:auto;width:10px;height:10px;border-right:2px solid var(--p28-blue);border-bottom:2px solid var(--p28-blue);transform:rotate(45deg);transition:transform .2s;flex:none}
.p28-faq details[open] summary:after{transform:rotate(225deg)}
.p28-faq summary .p28-ico-box{width:38px;height:38px;border-radius:11px}
.p28-faq summary .p28-ico-box .hv-ico{width:20px;height:20px}
.p28-faq details p{margin:0 0 18px 50px;color:var(--p28-muted);line-height:1.7;font-size:14.5px}
.p28-contact{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;align-items:start}
.p28-card{border:1px solid var(--p28-line);border-radius:22px;background:#fff;padding:26px;box-shadow:0 18px 50px rgba(1,35,81,.06)}
.p28-card h2,.p28-card h3{margin:0 0 6px;color:var(--p28-ink)}
.p28-card>p{color:var(--p28-muted);margin:0 0 18px;line-height:1.6}
.p28-ways{display:grid;gap:10px}
.p28-way{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--p28-line);border-radius:14px;text-decoration:none;color:var(--p28-ink);min-height:56px}
.p28-way:hover{border-color:#a7ddeb;background:#f8fcff}
.p28-way small{display:block;color:var(--p28-muted);font-size:12.5px}
.p28-way .p28-ico-box{width:42px;height:42px;border-radius:12px}
.p28-way .p28-ico-box .hv-ico{width:21px;height:21px}
.p28-flash{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:14px;margin-bottom:16px;font-weight:600;line-height:1.5}
.p28-flash.ok{background:#e9f9f2;color:#0b6b4b;border:1px solid #bfe9d6}
.p28-flash.err{background:#fdeeee;color:#9f1d1d;border:1px solid #f4c7c7}
.p28-flash .hv-ico{width:20px;height:20px;margin-top:1px}

/* ---------- Formulaires intelligents ---------- */
.p28-form{display:grid;gap:14px}
.p28-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.p28-field{display:grid;gap:7px;position:relative}
.p28-field>label,.p28-legend{font-size:13px;font-weight:700;color:#3d5168}
.p28-field input,.p28-field select,.p28-field textarea{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--p28-line);border-radius:12px;background:#fff;color:var(--p28-ink);font:16px/1.4 Inter,sans-serif;transition:border-color .15s,box-shadow .15s}
.p28-field textarea{min-height:130px;resize:vertical}
.p28-field input:focus,.p28-field select:focus,.p28-field textarea:focus{outline:none;border-color:var(--p28-blue);box-shadow:0 0 0 4px rgba(36,155,225,.14)}
.p28-hint{font-size:12.5px;color:var(--p28-muted);line-height:1.45}
[data-p28-invalid] input,[data-p28-invalid] select,[data-p28-invalid] textarea,input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--p28-err)!important;box-shadow:0 0 0 4px rgba(198,40,40,.10)!important}
input[data-p28-ok="1"]{border-color:#9fdcc4!important}
.p28-err{display:flex;gap:6px;align-items:flex-start;color:var(--p28-err);font-size:12.5px;font-weight:650;line-height:1.4}
.p28-err .hv-ico{width:15px;height:15px;margin-top:1px}
.p28-err[hidden]{display:none}
.p28-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.p28-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 24px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--p28-blue),#0b74c9);color:#fff;font:800 15px Inter,sans-serif;cursor:pointer;box-shadow:0 12px 26px rgba(36,155,225,.28)}
.p28-btn[disabled]{opacity:.65;cursor:wait}
.p28-btn .hv-ico{width:19px;height:19px}
.p28-seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.p28-seg label{position:relative;display:flex;align-items:center;gap:10px;min-height:54px;padding:10px 12px;border:1.5px solid var(--p28-line);border-radius:14px;background:#fff;cursor:pointer;font-weight:700;color:var(--p28-ink);font-size:14px;transition:border-color .15s,background .15s}
.p28-seg input{position:absolute;opacity:0;pointer-events:none}
.p28-seg label .p28-ico-box{width:34px;height:34px;border-radius:10px}
.p28-seg label .p28-ico-box .hv-ico{width:19px;height:19px}
.p28-seg label:has(input:checked){border-color:var(--p28-blue);background:#f1f9ff;box-shadow:0 0 0 3px rgba(36,155,225,.12)}
.p28-seg label:has(input:focus-visible){outline:3px solid rgba(36,155,225,.35);outline-offset:2px}
.p28-stepper{display:flex;align-items:center;border:1.5px solid var(--p28-line);border-radius:12px;background:#fff;min-height:50px;overflow:hidden}
.p28-stepper button{width:50px;height:50px;border:0;background:#f4f9fd;color:var(--p28-blue);display:grid;place-items:center;cursor:pointer;flex:none}
.p28-stepper button:active{background:#e3f1fb}
.p28-stepper button .hv-ico{width:20px;height:20px}
.p28-stepper input{border:0!important;box-shadow:none!important;text-align:center;font-weight:800;min-height:48px!important;-moz-appearance:textfield;padding:0!important}
.p28-stepper input::-webkit-outer-spin-button,.p28-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.p28-pass{position:relative}
.p28-pass input{padding-right:52px!important}
.p28-pass-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;background:none;color:#6b8199;display:grid;place-items:center;cursor:pointer;border-radius:10px}
.p28-pass-toggle .hv-ico{width:21px;height:21px}
.p28-meter{height:6px;border-radius:6px;background:#e7eef5;overflow:hidden;margin-top:2px}
.p28-meter i{display:block;height:100%;width:0;border-radius:6px;transition:width .2s,background .2s}
/* Suggestions d'adresses */
.p28-ac{position:relative}
.p28-ac-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--p28-line);border-radius:14px;box-shadow:0 22px 50px rgba(1,35,81,.16);max-height:320px;overflow:auto}
.p28-ac-list[hidden]{display:none}
.p28-ac-list li{display:flex;gap:10px;align-items:flex-start;padding:11px 10px;border-radius:10px;cursor:pointer;min-height:48px;line-height:1.35}
.p28-ac-list li[aria-selected="true"],.p28-ac-list li:hover{background:#eef7fd}
.p28-ac-list li .hv-ico{width:18px;height:18px;color:var(--p28-blue);margin-top:2px}
.p28-ac-list li b{display:block;font-size:14.5px;color:var(--p28-ink)}
.p28-ac-list li small{display:block;font-size:12.5px;color:var(--p28-muted)}
.p28-ac-list .p28-ac-foot{min-height:0;padding:6px 10px 2px;font-size:11px;color:#8a9bb0;cursor:default;background:none!important}
.p28-auto{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--p28-ok);font-weight:700}
.p28-auto .hv-ico{width:15px;height:15px}
.p28-auto[hidden],.p28-hint[hidden],.p28-flash[hidden]{display:none!important}
.p28-draft{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border:1px dashed #9fd2ef;border-radius:14px;background:#f5fbff;color:#16507e;font-size:13.5px;margin-bottom:14px}
.p28-draft button{border:0;background:none;color:#0c89c6;font-weight:800;cursor:pointer;padding:8px 4px;min-height:40px}
[data-p28-show][hidden]{display:none!important}

/* Réservation : choix du service par pictogrammes, compteurs, carte véhicule */
.booking-v2 .vehicle-photo{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;display:block;background:#eef7fd}
.booking-v2 .vehicle-photo .hv-media-img{width:100%;height:100%;object-fit:cover}
.booking-v2 .booking-vehicle em .hv-ico{width:15px;height:15px;color:var(--p28-blue);margin-right:2px}
.booking-v2 .booking-card-title>span .hv-ico{width:22px;height:22px}
.booking-v2 .booking-options label .hv-ico{width:18px;height:18px;color:var(--p28-blue);flex:none}

/* ---------- Confort mobile ---------- */
@media (max-width:760px){
  .p28-row,.p28-contact{grid-template-columns:1fr}
  .p28-card{padding:20px;border-radius:18px}
  .p28-faq details p{margin-left:0}
  /* 16 px minimum : l'iPhone ne zoome plus à chaque saisie */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}
  .booking-field input,.booking-field select,.dsearch input,.dsearch select{min-height:50px}
  .p28-seg{grid-template-columns:1fr 1fr}
  .booking-shell{padding-bottom:110px}
  .p28-gallery{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.hv-media>.hv-media-img,.p28-vcard{transition:none}}

/* Annuaire : pictogrammes et avatars */
.directory-v2 .c-sub .hv-ico,.directory-v2 .phead p .hv-ico{width:14px;height:14px;color:#0c89c6;vertical-align:-2px}
.directory-v2 .c-meta .hv-ico{width:15px;height:15px;color:#0c89c6;vertical-align:-3px;margin-right:2px}
.directory-v2 .card-link b .hv-ico{width:17px;height:17px;vertical-align:-3px}
.directory-v2 .dir-trust span{display:inline-flex;align-items:center;gap:5px}
.directory-v2 .dir-trust .hv-ico{width:15px;height:15px;color:#0f9f6e}
.directory-v2 .dsearch button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.directory-v2 .dsearch button .hv-ico{width:18px;height:18px}
.directory-v2 .verified .hv-ico{width:14px;height:14px;vertical-align:-2px}
.big-av{border-radius:20px}
.hv-avatar-driver.big-av{border-radius:50%}
@media (max-width:640px){.big-av{--av:58px!important}}
/* Accueil : cartes « Ressources » avec pictogramme */
.resource-card>span{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#e9fbff,#e7f1ff);color:var(--p28-blue)}
.resource-card h3{margin-top:20px}
.mobile-benefits>div>span{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#e9fbff,#e7f1ff)}
/* Inscription : choix du profil avec pictogrammes */
.role-tab span .hv-ico{width:26px;height:26px;color:var(--p28-blue)}
.role-tab span{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,#e9fbff,#e7f1ff)}
.auth-field .p28-pass{width:100%}
.booking-v2 [hidden]{display:none!important}
.booking-v2 .vehicle-photo .hv-media-fallback small{display:none}
/* Connexion / inscription sur mobile : le panneau ne dépasse plus de l'écran (la rangée des profils défile à l'intérieur). */
@media (max-width:960px){
  .auth-v2 .auth-grid{grid-template-columns:minmax(0,1fr)!important}
  .auth-v2 .auth-panel,.auth-v2 .auth-card{min-width:0;max-width:100%}
  .auth-v2 .role-tabs{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
.cell-user .hv-media-fallback small,.ib-photo .hv-media-fallback small{display:none}