.booking-status {
  min-height: 15px;
  margin: 7px 0 0;
  color: #54635d;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
}

/* Home search and discounts: two independent cards, never one shared frame. */
#reserver.home-booking-layout {
  position: relative;
  z-index: 3;
  margin: 16px auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#reserver.home-booking-layout .booking-content { align-items: start; gap: 22px; }
#reserver .booking-search-panel {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 18px 20px 14px;
  border: 1px solid #ffd72e;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16,37,39,.08);
}
#reserver.home-booking-layout .home-duration-pricing {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(16,37,39,.05);
}
#reserver.home-booking-layout .booking-note { margin-top: 13px; line-height: 1.6; }
#reserver.home-booking-layout .booking-status:empty { display: none; }
#reserver.home-booking-layout .booking-content:has(> .home-duration-pricing[hidden]) { grid-template-columns: minmax(0,1fr); }
@media (min-width: 1200px) {
  #reserver.home-booking-layout { width: min(1380px, calc(100% - 48px)); }
  #reserver.home-booking-layout .booking-content,
  #reserver.home-booking-layout .booking-content:has(> .home-duration-pricing[hidden]) {
    grid-template-columns: 245px minmax(0,1fr) 245px;
  }
  #reserver .booking-search-panel { grid-column: 2; }
  #reserver.home-booking-layout .home-duration-pricing { grid-column: 3; }
}
@media (max-width: 900px) {
  #reserver.home-booking-layout .booking-content { gap: 12px; }
}
@media (max-width: 600px) {
  #reserver.home-booking-layout { margin-top: 9px; }
  #reserver .booking-search-panel { padding: 10px 11px 9px; border-radius: 12px; }
  #reserver.home-booking-layout .home-duration-pricing { padding: 10px; border-radius: 10px; }
}

.booking-page { background: #f7f9f6; }
.booking-chosen-car { display: grid; grid-template-columns: 128px minmax(0,1fr); gap: 18px; align-items: center; padding: 16px; margin-bottom: 22px; border: 1px solid #b9ded4; border-radius: 12px; background: #f0faf6; text-align: left; }
.booking-chosen-car img { display: block; width: 128px; height: 90px; object-fit: contain; border-radius: 8px; background: white; }
.booking-chosen-car p { margin: 0 0 5px; color: #526c61; font: 600 11px/1.4 'DM Sans',sans-serif; }
.booking-chosen-car h2 { margin: 0 0 6px; font: 600 22px/1.2 Outfit,sans-serif; color: #102527; overflow-wrap: anywhere; }
.booking-chosen-car strong { display: block; color: #116449; font: 700 14px/1.5 'DM Sans',sans-serif; }
.booking-chosen-car small { color: #60776c; font-size: 10px; font-weight: 400; }
.booking-chosen-car a { display: inline-flex; align-items: center; min-height: 32px; color: #087f7d; text-decoration: underline; font: 600 11px/1.4 'DM Sans',sans-serif; }
.booking-chosen-missing { grid-template-columns: 1fr; border-color: #e7d6b3; background: #fff9eb; }
.booking-page-main { width: min(1120px, 90vw); margin: auto; padding: 74px 0 80px; }
.booking-page-heading { display: grid; justify-items: center; max-width: 760px; margin: 0 auto 38px; text-align: center; }
.booking-page-heading h1 { max-width: 620px; margin: 0; font: 700 clamp(44px, 5vw, 66px)/.98 Outfit, sans-serif; letter-spacing: -2.7px; }
.booking-page-heading h1 em { font-weight: 500; }
.booking-page-heading > div > p:last-child { max-width: 560px; margin: 21px auto 0; color: #5b6a64; font-size: 15px; line-height: 1.65; }
.booking-steps { display: grid; grid-template-columns: repeat(3, 1fr); width: min(100%, 560px); gap: 9px; margin-top: 27px; padding: 15px 17px; border: 1px solid #dce7e1; border-radius: 13px; background: #fff; }
.booking-steps span { display: flex; align-items: center; gap: 9px; color: #52625c; font-size: 11px; font-weight: 700; }
.booking-steps b { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 999px; background: #e7f7f6; color: #087f7d; font: 700 11px Outfit, sans-serif; }
.booking-page .booking { width: 100%; margin: 0; padding: 27px 28px 15px; border-radius: 16px; box-shadow: 0 15px 35px rgba(16, 37, 39, .1); }
.booking-page .booking form { grid-template-columns: 1.25fr .75fr 1.25fr .75fr auto; gap: 13px; }
.booking-page .booking-note { margin-top: 13px; }
.booking-fleet-preview { margin-top: 22px; padding-top: 19px; border-top: 1px solid #e2e8e4; }
.booking-fleet-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 13px; }
.booking-fleet-head .eyebrow { margin: 0 0 6px; font-size: 9px; }
.booking-fleet-head strong { font: 600 18px Outfit, sans-serif; letter-spacing: -.6px; }
.booking-fleet-head > a { flex: none; border-bottom: 1px solid #102527; padding-bottom: 4px; font-size: 10px; font-weight: 700; }
.booking-fleet-head > a span { margin-left: 4px; font-size: 13px; }
.booking-preview-cars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.booking-preview-car { display: block; overflow: hidden; border: 1px solid #e3e8e5; background: #f9fbfa; transition: transform .15s ease, box-shadow .15s ease; }
.booking-preview-car:hover { transform: translateY(-2px); box-shadow: 0 7px 15px rgba(16, 37, 39, .1); }
.booking-preview-image { height: 82px; background-color: #fff; background-position: center; background-repeat: no-repeat; background-size: contain; }
.booking-preview-car > span { display: block; padding: 8px 9px; color: #43534d; font-size: 9px; line-height: 1.35; }
.booking-preview-car b { color: #102527; font: 700 10px Outfit, sans-serif; }
.booking-page-layout { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(280px, .58fr); gap: 20px; align-items: start; }
.booking-side { display: flex; flex-direction: column; padding: 30px; border-radius: 16px; background: #102527; color: #fff; box-shadow: 0 15px 35px rgba(16, 37, 39, .12); }
.booking-side .eyebrow { margin-bottom: 15px; color: #c7d7d2; }
.booking-side h2 { margin: 0 0 22px; font: 600 34px/.99 Outfit, sans-serif; letter-spacing: -1.5px; }
.booking-side h2 em { font-weight: 500; }
.booking-side > div { padding: 14px 0; border-top: 1px solid #38504e; }
.booking-side strong { font: 600 13px Outfit, sans-serif; }
.booking-side p { margin: 5px 0 0; color: #c3d0cb; font-size: 11px; line-height: 1.5; }
.booking-side a { color: #ffdd50; font-weight: 700; }
.booking-duration-pricing { margin:0; padding:14px 0; border-top:1px solid #38504e; }
.booking-duration-pricing > p { margin:0; color:#fff; font:600 15px/1.1 Outfit,sans-serif; }
.booking-duration-pricing > strong { display:block; margin:4px 0 9px; color:#9ad7d2; font:600 10px 'DM Sans',sans-serif; }
.booking-duration-pricing ul { display:grid; gap:5px; margin:0; padding:0; list-style:none; }
.booking-duration-pricing li { display:flex; justify-content:space-between; gap:10px; padding:6px 8px; border:1px solid #38504e; background:rgba(255,255,255,.04); color:#d8e5e1; font-size:10px; }
.booking-duration-pricing b { color:#ffdd50; font:700 11px Outfit,sans-serif; }
.booking-duration-mobile { display:none; }
.booking-reassurance { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 20px; }
.booking-reassurance > div { min-height: 108px; padding: 18px; border: 1px solid #e0e8e3; border-radius: 13px; background: #fff; }
.booking-reassurance strong { font: 600 15px Outfit, sans-serif; }
.booking-reassurance p { margin: 7px 0 0; color: #66746e; font-size: 11px; line-height: 1.5; }
.booking-reassurance a { color: #087f7d; font-weight: 700; }
.booking-footer { padding: 24px 6vw; border-top: 1px solid #e0e8e3; color: #6e7c76; background: #fffefa; font-size: 11px; text-align: center; }
.booking-footer a { color: #28433f; font-weight: 700; }

@media (max-width: 800px) {
  .booking-page-main { width: 90vw; padding: 38px 0 54px; }
  .booking-page-heading { display: grid; margin-bottom: 25px; }
  .booking-page-heading h1 { font-size: clamp(42px, 13vw, 56px); letter-spacing: -2.2px; }
  .booking-page-heading > div > p:last-child { margin-top: 17px; font-size: 14px; }
  .booking-steps { grid-template-columns: repeat(3, 1fr); gap: 7px; min-width: 0; margin-top: 23px; padding: 11px 10px; }
  .booking-steps span { align-items: flex-start; gap: 5px; font-size: 9px; line-height: 1.25; }
  .booking-steps b { width: 18px; height: 18px; flex: none; font-size: 9px; }
  .booking-page-layout { display: block; }
  .booking-page .booking { width: 100%; padding: 17px 13px 12px; border-radius: 14px; }
  .booking-page .booking form { grid-template-columns: minmax(0, 1.35fr) minmax(95px, .65fr); gap: 10px; }
  .booking-page .booking form > *, .booking-page .booking .field, .booking-page .booking input { min-width: 0; }
  .booking-page .booking .search { grid-column: span 2 !important; }
  .booking-page .booking-note { font-size: 9px; line-height: 1.55; }
  .booking-duration-desktop { display:none; }
  .booking-duration-mobile { display:block; margin-top:12px; padding:12px 13px; border:1px solid #d5e7e2; border-left:4px solid #0bb8bc; background:#f4fbf8; }
  .booking-duration-mobile > p { color:#102527; font-size:14px; }
  .booking-duration-mobile > strong { color:#177452; }
  .booking-duration-mobile li { border-color:#dceae5; background:#fff; color:#52635d; }
  .booking-duration-mobile b { color:#177452; }
  .booking-reassurance { grid-template-columns: 1fr; gap: 10px; margin-top: 14px; }
  .booking-reassurance > div { min-height: 0; padding: 15px; }
  .booking-side { display: none; }
  .booking-fleet-preview { display: none; }
}

@media (max-width: 370px) {
  .booking-page .booking form { grid-template-columns: 1fr; }
  .booking-page .booking .search { grid-column: auto !important; }
  .booking-steps { grid-template-columns: 1fr; }
}

/* Le formulaire dédié reste compact sur un téléphone standard. */
@media (min-width: 351px) and (max-width: 600px) {
  .booking-page-main { width: min(330px, 84vw); padding-top: 28px; }
  .booking-page .booking { padding: 8px 12px 6px; }
  .booking-page .booking form {
    width: calc(100% - 12px);
    margin: 0 auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 7px;
  }
  .booking-page .booking .search { grid-column: 1 / -1 !important; }
  .booking-page .booking .field label { margin-bottom: 2px; font-size: 8px; }
  .booking-page .booking .field input { height: 32px !important; min-height: 0; padding-right: 5px; padding-left: 5px; }
  .booking-page .booking .search { height: 34px; min-height: 34px; }
  .booking-page .booking-note { display: none; }
  .booking-page .booking-status:empty { display: none; }
}

/* Version téléphone : compacte, mais assez espacée pour être simple à utiliser. */
@media (max-width: 600px) {
  .booking-page-main { width: min(344px, calc(100% - 28px)); padding: 25px 0 38px; }
  .booking-page-heading { margin-bottom: 19px; }
  .booking-page-heading .eyebrow { margin-bottom: 10px; font-size: 9px; }
  .booking-page-heading h1 { font-size: clamp(37px, 11.5vw, 47px); letter-spacing: -1.8px; }
  .booking-page-heading > div > p:last-child { margin-top: 12px; font-size: 13px; line-height: 1.5; }
  .booking-steps { margin-top: 17px; padding: 9px 8px; gap: 4px; }
  .booking-steps span { gap: 4px; font-size: 8px; }
  .booking-steps b { width: 17px; height: 17px; font-size: 8px; }
  .booking-page .booking { padding: 10px 11px 9px; border-radius: 12px; }
  .booking-page .booking form { width: 100%; margin: 0; gap: 5px 7px; }
  .booking-page .booking .field label { margin-bottom: 3px; font-size: 9px; }
  .booking-page .booking .field input { height: 36px !important; padding: 7px 5px; font-size: 11px; }
  .booking-page .booking .search { height: 37px; min-height: 37px; font-size: 11px; }
  .booking-duration-mobile { margin-top: 9px; padding: 9px 10px; }
  .booking-duration-mobile > p { font-size: 12px; }
  .booking-duration-mobile > strong { margin: 2px 0 6px; font-size: 9px; }
  .booking-duration-mobile ul { gap: 4px; }
  .booking-duration-mobile li { padding: 5px 6px; font-size: 9px; }
  .booking-reassurance { margin-top: 11px; }
  .booking-reassurance > div { padding: 13px; }
}

@media (max-width: 600px) {
  .booking-duration-mobile {
    padding: 10px;
    border: 1px solid #cbe5de;
    border-left: 4px solid #0bb8bc;
    border-radius: 8px;
  }
  .booking-duration-mobile > p { font-size: 13px; }
  .booking-duration-mobile > strong { margin: 3px 0 8px; font-size: 9px; }
  .booking-duration-mobile ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  .booking-duration-mobile li {
    display: grid;
    min-height: 44px;
    place-content: center;
    gap: 2px;
    padding: 5px 3px;
    border: 1px solid #d7e9e3;
    border-radius: 6px;
    color: #52635d;
    font-size: 9px;
    text-align: center;
  }
  .booking-duration-mobile b { color: #177452; font-size: 13px; }
}

/* The car stays visible above its dates, without a second fleet underneath. */
.booking-page-focused .booking-page-main { padding-top: 32px; }
.booking-page-focused .booking-page-heading { margin-bottom: 22px; }
.booking-page-focused .booking-page-heading h1 { font-size: 46px; }
.booking-page-focused .booking-page-heading > div > p:last-child { margin-top: 13px; }
.booking-page-focused .booking-steps { margin-top: 18px; }
.booking-page-focused .booking .search { min-height: 44px; white-space: normal; line-height: 1.3; }
@media (max-width: 600px) {
  .booking-page-focused .booking-page-main { padding-top: 18px; }
  .booking-page-focused .booking-page-heading { margin-bottom: 14px; }
  .booking-page-focused .booking-page-heading h1 { font-size: 35px; }
  .booking-page-focused .booking-page-heading h1 br { display: none; }
  .booking-page-focused .booking-page-heading h1 em::before { content: ' '; }
  .booking-page-focused .booking-page-heading > div > p:last-child { margin-top: 9px; font-size: 12px; }
  .booking-page-focused .booking-steps { margin-top: 11px; }
  .booking-chosen-car { grid-template-columns: 88px minmax(0,1fr); gap: 10px; padding: 10px; margin-bottom: 13px; }
  .booking-chosen-car img { width: 88px; height: 72px; }
  .booking-chosen-car h2 { font-size: 17px; }
  .booking-chosen-car strong { font-size: 12px; }
  .booking-chosen-car small { display: block; }
  .booking-chosen-car a { min-height: 36px; font-size: 10px; }
  .booking-chosen-missing { grid-template-columns: 1fr; }
}
