/* ============================================================
   RETOUR SUR LE SITE — téléphone en portrait ET en paysage (retour client du 21/09/2026)
   1) Fenêtres (Réserver / Louer un véhicule / Commander) : la croix « × » était absolue dans une fenêtre qui défile ;
      dès qu'on descendait dans le formulaire elle disparaissait (mesuré : y = -574 px). Barre haute FIXE avec
      « ‹ Retour » + « × ».
   2) Catalogues : photos avec flèches, compteur, tapotement gauche/droite = photo précédente/suivante, tapotement
      au centre = agrandir ; l'agrandissement se referme d'un simple tapotement.
   ============================================================ */

/* --- Barre haute des fenêtres du site --- */
#reservationDialog,#rentalDialog{--dpx:36px;--dpy:36px;padding:var(--dpy) var(--dpx)}
@media (max-width:760px){#reservationDialog,#rentalDialog{--dpx:18px;--dpy:26px}}
.dialog-close{
  position:sticky;top:calc(-1 * var(--dpy));right:auto;max-width:none;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:calc(-1 * var(--dpy)) calc(-1 * var(--dpx)) 12px;padding:8px var(--dpx);
  background:#fff;border-bottom:1px solid #e3ecea;
}
.dialog-close .dialog-back{
  min-height:44px;padding:0 12px 0 2px;border:0;background:none;cursor:pointer;
  color:var(--teal,#073f3e);font-weight:800;font-size:16px;
}
.dialog-close .dialog-x{
  width:44px;height:44px;border:0;border-radius:50%;background:#eef4f3;cursor:pointer;
  color:#243a38;font-size:28px;line-height:1;display:grid;place-items:center;padding:0 0 3px;
}
#reservationDialog .dialog-head:focus,#rentalDialog .dialog-head:focus{outline:none}
.dialog-close button:focus-visible{outline:3px solid var(--mint,#4bd2bc);outline-offset:1px}

/* --- Retour à la liste des véhicules (fenêtre de location) --- */
.rental-vehicle-details .rental-back-search{
  grid-column:1/-1;justify-self:start;display:inline-flex;align-items:center;gap:6px;
  min-height:40px;padding:0 16px 0 12px;border:1px solid #cbdad8;border-radius:999px;background:#fff;
  color:#074f4c;font-weight:800;font-size:14px;cursor:pointer;
}
.rental-vehicle-details .rental-back-search:focus-visible{outline:3px solid #f0791d;outline-offset:2px}

/* --- Photos de catalogue --- */
.cat-wrap{position:relative;min-width:0}
.cat-wrap .gallery img,.cat-wrap .rental-gallery img{cursor:pointer;-webkit-tap-highlight-color:transparent}
.cat-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:38px;height:38px;padding:0 0 3px;border:0;border-radius:50%;
  display:grid;place-items:center;background:#000000a8;color:#fff;font-size:26px;line-height:1;cursor:pointer;
}
.cat-nav:focus-visible{outline:3px solid #fff;outline-offset:2px}
.cat-prev{left:6px}.cat-next{right:6px}
.cat-count{
  position:absolute;right:8px;bottom:8px;z-index:2;padding:4px 10px;border-radius:99px;pointer-events:none;
  background:#000000a8;color:#fff;font:700 12px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* --- Photo agrandie : un tapotement n'importe où la referme --- */
.cat-lightbox{
  position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;
  border:0;border-radius:0;background:#020c0cf5;color:#fff;overflow:hidden;
}
.cat-lightbox::backdrop{background:#000}
.cat-lightbox[open]{display:flex;flex-direction:column}
.cat-lb-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;
  padding:max(8px,env(safe-area-inset-top,0px)) max(10px,env(safe-area-inset-right,0px)) 6px max(10px,env(safe-area-inset-left,0px));
}
.cat-lb-bar button{
  min-height:44px;border:0;background:none;color:#fff;cursor:pointer;font-weight:800;font-size:16px;
}
.cat-lb-back{padding:0 12px 0 4px}
.cat-lb-x{width:44px;border-radius:50%;background:#ffffff1f!important;font-size:28px!important;padding-bottom:3px!important}
.cat-lb-count{font:700 13px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;color:#ffffffd0}
.cat-lb-stage{flex:1;min-height:0;display:grid;place-items:center;padding:0 8px max(12px,env(safe-area-inset-bottom,0px));cursor:zoom-out;touch-action:pan-y pinch-zoom}
.cat-lb-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:8px;user-select:none;-webkit-user-drag:none}
.cat-lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:46px;height:46px;padding:0 0 4px;border:0;border-radius:50%;
  display:grid;place-items:center;background:#ffffff40;color:#fff;font-size:30px;line-height:1;cursor:pointer;
}
.cat-lb-prev{left:8px}.cat-lb-next{right:8px}
.cat-lb-seul .cat-lb-nav{display:none}
.cat-lb-bar button:focus-visible,.cat-lb-nav:focus-visible{outline:3px solid #fff;outline-offset:2px}
