/* GETCAB booking journey styles (Oct 2026). Loaded after modern.css.
   Step 1: the quote form and its address lookup (all pages).
   Step 2: vehicle list.  Step 3: checkout details.
   Styling only: no field, name, id or script is changed. Uses CSS nesting, like modern.css. */

/* ================= Step 1: quote form and address lookup ================= */
body:is(.gc-modern,.gc-lite){
/* address suggestions */
ul.list,ul.list1,ul.list2,ul.list3{
  background:#fff!important;color:var(--gc-navy);border:1px solid var(--gc-line);border-radius:14px;
  box-shadow:0 22px 48px rgba(12,37,69,.22);padding:6px;height:auto!important;max-height:300px;overflow-y:auto;
  min-width:min(380px,88vw);width:auto;margin-top:6px;scrollbar-width:thin}
ul.list li,ul.list1 li,ul.list2 li,ul.list3 li{
  position:relative;padding:11px 104px 11px 12px!important;border-radius:9px;font-size:14px;font-weight:500;line-height:1.35;
  color:var(--gc-navy);cursor:pointer;text-align:left}
ul.list li+li,ul.list1 li+li,ul.list2 li+li,ul.list3 li+li{margin-top:1px}
ul.list li:hover,ul.list1 li:hover,ul.list2 li:hover,ul.list3 li:hover{background:var(--gc-sky)!important;color:var(--gc-navy)!important}
ul.list li span{right:8px;top:50%;transform:translateY(-50%);width:auto;min-width:74px}
.address-badge-info{background:#e2edfb;color:var(--gc-blue);border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:700}
.address-badge-secondary{background:#eceff3;color:#5b6778;border-radius:999px;padding:4px 10px;font-size:11.5px;font-weight:700}
/* form fields on every quote form */
#form1 label{text-transform:capitalize}
.tabbg form.form-inline1 .form-control{border-radius:10px!important;box-shadow:none!important;font-size:14px}
.tabbg form.form-inline1 .form-control:focus{border-color:var(--gc-blue)!important;box-shadow:0 0 0 3px rgba(21,94,173,.16)!important;outline:0}
.icon-geolocation img{opacity:.55}
.icon-geolocation:hover img{opacity:1}
}

/* ================= Steps 2 and 3: shared ================= */
body.gc-lite{
&,p,li,h1,h2,h3,h4,h5,label,input,select,button,textarea,a,strong,td,th{font-family:var(--gc-font)}
&{background:#f4f7fb!important}
section.why-imperial{background:#f4f7fb;padding:34px 0 60px}

/* progress steps */
.steps-div{align-items:flex-start}
.steps-div span.fa{display:inline-grid;place-items:center;width:46px;height:46px;padding:0;border-radius:50%;font-size:19px}
.steps-div .flexer{height:4px;margin-top:21px;border-radius:2px}
.steps-div p{color:var(--gc-navy)!important;font-weight:700;font-size:14px;margin:6px 0 0}

/* ================= Step 2: vehicle list ================= */
.vehicles-list>ul>li{border:1px solid var(--gc-line);border-radius:18px;padding:24px 26px 20px;margin-bottom:18px;box-shadow:0 6px 20px rgba(12,37,69,.05);transition:border-color .15s,box-shadow .15s}
.vehicles-list>ul>li:hover{border-color:#b8cbe4;box-shadow:0 16px 34px rgba(12,37,69,.1)}
.vehicles-list ul li .info{margin-bottom:0}
.vehicles-list ul li .info h3{font-size:24px;font-weight:800;color:var(--gc-navy);margin-right:14px;letter-spacing:-.01em}
.vehicles-list ul li .info p span{display:inline-block;padding:6px 12px;margin:0 6px 6px 0;background:var(--gc-sky);border-radius:999px;font-size:13px;font-weight:600;color:var(--gc-navy)}
.vehicles-list ul li .info p.no-margin-bottom strong{font-weight:600;color:#5b6778;font-size:14.5px}
.vehicles-list>ul>li>br{display:none}
.vehicles-list .row{margin-top:14px!important}
.vehicles-list .vehicle-img img{display:block;max-height:150px;width:auto;margin:0 auto 12px}
.vehicles-list .vehicle-img>br{display:none}
.vehicles-list .vehicle-img p{display:inline-block;width:49%;vertical-align:top;margin:0 0 7px;font-size:13.5px;color:#42526a;line-height:1.4}
.vehicles-list .vehicle-img p i{color:#1f9d55;margin-right:5px}
.vehicles-list .book-info ul li.price p{font-size:32px;font-weight:800;color:var(--gc-navy);line-height:1.2;letter-spacing:-.02em}
.vehicles-list .book-info ul li.price del{font-size:17px;font-weight:600;color:#9aa7b8!important}
.vehicles-list .book-info ul li.highlight-text{margin:8px 0 0!important}
.vehicles-list .book-info ul li.highlight-text p{font-size:14px;font-weight:600;text-align:right;margin-bottom:3px}
.vehicles-list .book-info select.form-control{height:46px;border:1px solid #cfd9e6!important;border-radius:10px!important;font-size:14.5px!important;background-color:#fff;color:var(--gc-navy)}
.vehicles-list .book-btn button[type=button]{background:var(--gc-orange)!important;border-color:transparent!important;color:#fff!important;border-radius:12px;font-size:17px;font-weight:800;text-transform:none;text-shadow:none;letter-spacing:0;padding:14px 12px;box-shadow:0 10px 22px rgba(245,138,31,.3)}
.vehicles-list .book-btn button[type=button]:hover,.vehicles-list .book-btn button[type=button]:focus{background:var(--gc-orange-dk)!important}

/* journey summary */
.booking-details{border:1px solid var(--gc-line);border-radius:18px;padding:22px 20px 8px;box-shadow:0 6px 20px rgba(12,37,69,.05);position:sticky;top:96px}
.booking-details ul li{padding:0 0 16px 4px}
.booking-details h4{font-size:11.5px;font-weight:700;letter-spacing:.07em;color:#6b7a90}
.booking-details h4.text-info{font-size:17px;letter-spacing:-.01em;text-transform:none;color:var(--gc-navy)!important;font-weight:800}
.booking-details p{font-size:15px;font-weight:600;color:var(--gc-navy);line-height:1.4;padding-top:3px}
.booking-details hr{border-color:var(--gc-line)}

/* ================= Step 3: checkout ================= */
section.selected-plan .row.whole{border:1px solid var(--gc-line);border-radius:14px;overflow:hidden;margin:0;align-items:stretch}
section.selected-plan .red{background:#fff1ee}
section.selected-plan .green{background:#eaf6ec}
section.selected-plan .row.whole p{margin:0;padding:12px 6px;font-size:14.5px;font-weight:600;color:var(--gc-navy)}
section.selected-plan .row.whole p i{margin-right:8px}
section.selected-plan .desti hr{display:none}
h3.care-notice-text{font-size:clamp(20px,2.4vw,26px);font-weight:800;color:var(--gc-navy);text-transform:none;letter-spacing:-.01em;margin:6px 0 18px}

#sumitform .panel{border:1px solid var(--gc-line)!important;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 6px 20px rgba(12,37,69,.05)}
/* the heading carries an inline grey background; the gradient layer sits above it */
#sumitform .panel-heading{background-image:linear-gradient(var(--gc-navy),var(--gc-navy))!important;padding:16px 24px;border-radius:0}
#sumitform .panel-heading h3{margin:0;color:#fff;font-size:19px}
#sumitform .panel-heading h3 i{font-family:var(--gc-font)!important;font-style:normal;font-weight:800;color:#fff}
#sumitform .panel-heading h3 i::before{font-family:FontAwesome;font-weight:400;margin-right:10px;color:#ffc27d}
#sumitform .panel-body{padding:26px 24px 18px!important;font-size:14.5px;color:var(--gc-navy)}
#sumitform .panel-body>.row>.col-sm-8>.row{margin-bottom:6px;align-items:center}
#sumitform label{font-size:13px;font-weight:600;color:var(--gc-navy);margin-bottom:5px;text-transform:none}
#sumitform .col-md-2>label{font-size:14px;font-weight:700}
#sumitform .form-control{height:46px;border:1px solid #cfd9e6;border-radius:10px;background:#fff;font-size:14.5px;padding:10px 12px;color:var(--gc-navy);box-shadow:none;width:100%!important}
#sumitform textarea.form-control{height:auto;min-height:92px}
#sumitform .form-control:focus{border-color:var(--gc-blue);box-shadow:0 0 0 3px rgba(21,94,173,.16);outline:0}
#sumitform .form-control[readonly]{background:#f2f6fb!important;border-color:transparent;font-weight:600}
#sumitform .form-group{margin-bottom:14px}
#sumitform .form-control::placeholder{font-size:13.5px;color:#8a97a8}
#sumitform #my_error:empty{display:none}
@media (min-width:768px){
  #sumitform .col-sm-8 .col-sm-2{flex:0 0 27%;max-width:27%}
  #sumitform .col-sm-4.table-responsive{align-self:flex-start}
}
#sumitform p{font-size:14.5px;font-weight:600;color:var(--gc-navy);margin-bottom:10px}
#sumitform label[id^="err_msg"],#sumitform span[id^="err_msg"]{font-size:12px!important;font-weight:700}

/* right column: vehicle, extras, price */
#sumitform .col-sm-4.table-responsive{background:#f7f9fc;border:1px solid var(--gc-line);border-radius:16px;padding:16px 18px 18px;overflow:visible}
#sumitform table.table{margin-bottom:10px!important}
#sumitform table.table th{border:0;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6b7a90;padding:4px 8px}
#sumitform table.table td{border-top:1px solid var(--gc-line);font-size:14px;font-weight:600;color:var(--gc-navy);vertical-align:middle;padding:10px 8px}
#sumitform .col-sm-4 label{font-weight:600;font-size:13.5px;text-align:left}
#sumitform .col-sm-4 .col-md-6.text-center{text-align:left!important}
#sumitform .col-sm-4 input[type=checkbox]{width:17px;height:17px;vertical-align:-3px;margin-right:6px;accent-color:var(--gc-blue)}
#sumitform .payment-button{border-radius:10px!important;padding:10px 18px;font-weight:700;font-size:14.5px;border:0}
#sumitform .payment-button__active{background-color:var(--gc-navy)!important;color:#fff!important}
#sumitform #discountdiv .alert{border:0;border-radius:10px;width:100%!important;float:none!important;font-size:14px}
#sumitform #discountdiv .row{margin:0;gap:8px;flex-wrap:nowrap}
#sumitform #discountdiv [class*="col-"]{padding:0!important;flex:1 1 0;max-width:none}
#sumitform .cstSubmitBtn{width:100%!important;background:var(--gc-orange)!important;border:0!important;border-radius:14px!important;color:#fff!important;font-size:16px;font-weight:800;text-transform:none;letter-spacing:0;padding:12px 16px 14px;box-shadow:0 12px 26px rgba(245,138,31,.32)}
#sumitform .cstSubmitBtn:hover,#sumitform .cstSubmitBtn:focus{background:var(--gc-orange-dk)!important}
#sumitform .cstSubmitBtn #rental{font-weight:800;line-height:1.15;letter-spacing:-.02em}
#sumitform .panel-body>.row:last-child h4{background:var(--gc-sky);border-radius:12px;padding:14px 16px;font-size:13px!important;line-height:1.6;color:#42526a!important;margin-top:18px}

@media (max-width:767px){
  .vehicles-list .vehicle-img,.vehicles-list .book-info{float:none;width:100%;margin-right:0}
  .vehicles-list .book-info ul li.price p,.vehicles-list .book-info ul li.highlight-text p{text-align:left}
  .vehicles-list>ul>li{padding:20px 18px 16px}
  .booking-details{position:static;margin-top:8px}
  #sumitform .panel-body{padding:18px 14px 12px!important}
  #sumitform .col-sm-4.table-responsive{margin-top:14px}
  section.selected-plan .row.whole p{padding:9px 6px}
}
}
