@import url("https://code.jquery.com/ui/1.14.1/themes/base/jquery-ui.css");
/* Quote concepts are isolated from both homepage designs. */
.quote-preview { flex: 1; background: #642c7b; }
.qp-switcher { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 18px; padding: 14px 5%; background: #faf8fc; color: #63566d; font-size: 12px; }
.qp-switcher > div { display: flex; gap: 5px; padding: 4px; border: 1px solid #e5ddea; border-radius: 30px; background: #fff; }
.qp-switcher button { border: 0; border-radius: 24px; background: transparent; padding: 9px 18px; color: #574761; font: inherit; font-weight: 600; }
.qp-switcher button[aria-pressed="true"] { background: #54256d; color: white; box-shadow: 0 3px 8px #54256d25; }
.qp-hero { min-height: calc(100vh - 210px); }
.qp-hero .hero-content { padding-top: 60px; padding-bottom: 30px; }
.qp-hero .hero-copy { width: 52%; max-width: 660px; }
.qp-hero .hero-copy h1 { font-size: clamp(38px, 4.5vw, 64px); font-weight: 800; }
.qp-hero .hero-copy > p { font-size: clamp(16px, 1.5vw, 21px); max-width: 530px; }
.qp-hero-note { display: flex; gap: 10px; align-items: center; color: #eee2f5; font-size: 14px; }
.qp-panel { margin-top: 42px; border-radius: 22px; background: #fff; color: #241335; border: 1px solid #e6d7ef; box-shadow: 0 24px 60px #230d3b40; padding: 26px 28px 0; }
.qp-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 25px; }
.qp-title { display: flex; align-items: center; gap: 15px; }
.qp-plane { width: 48px; height: 48px; display: grid; place-items: center; background: #f0e7f7; border-radius: 15px; color: #71318a; flex-shrink: 0; }
.qp-plane .icon { width: 26px; height: 26px; }
.qp-service { display: block; color: #74338d; font-size: 12px; font-weight: 700; margin-bottom: 5px; }
.qp-heading h2 { font-size: clamp(18px, 1.8vw, 25px); font-weight: 750; letter-spacing: -.5px; margin: 0 0 5px; }
.qp-heading p { font-size: 13px; color: #786b81; margin: 0; }
.qp-duration { background: #f7f2fb; color: #6e397f; border: 1px solid #e9dff0; border-radius: 22px; font-size: 12px; padding: 9px 14px; white-space: nowrap; }
.qp-fields { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(240px, 1.3fr) minmax(240px, 1.3fr) minmax(180px, 1fr); gap: 12px; align-items: stretch; }
.qp-field { min-width: 0; border: 1px solid #e1d8e8; border-radius: 12px; padding: 14px 12px 12px; background: #fdfcfe; transition: border-color .15s, box-shadow .15s; margin: 0; }
.qp-field:focus-within { border-color: #8d4cac; box-shadow: 0 0 0 3px #8d4cac18; background: #fff; }
.qp-field > label, .qp-field > legend { float: none; width: auto; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: #70577e; margin: 0 0 9px; padding: 0; }
.qp-field > legend { float: left; width: 100%; }
.qp-field .icon { width: 16px; height: 16px; }
.qp-date-time { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(72px, .8fr); gap: 5px; clear: both; }
.qp-date-time > div { min-width: 0; }
.qp-field .form-control, .qp-field .form-select { font-size: 14px; font-weight: 600; min-height: 34px; color: #281438; padding: 5px 2px; border: 0; border-radius: 4px; background-color: transparent; min-width: 0; width: 100%; }
.qp-field .form-select { padding-right: 25px; background-position: right 2px center; }
.qp-field .form-control:focus, .qp-field .form-select:focus { box-shadow: 0 0 0 2px #8d4cac40; }
.qp-field small { display: block; font-size: 10px; color: #8a7e91; margin-top: 7px; }
.qp-submit { border: 0; border-radius: 12px; background: #ffca20; color: #21122e; padding: 20px; display: flex; justify-content: center; align-items: center; gap: 14px; font-size: 15px; font-weight: 800; box-shadow: 0 5px 0 #eeb606; }
.qp-submit:hover { background: #ffd64a; }
.qp-submit .icon { width: 22px; height: 22px; }
.qp-bottom { display: flex; justify-content: space-between; gap: 15px; border-top: 1px solid #eee7f3; padding: 16px 0; margin-top: 22px; color: #83718d; font-size: 11px; }
.qp-bottom > span:first-child { display: flex; gap: 7px; align-items: center; }
.qp-bottom .icon { width: 15px; height: 15px; color: #87529a; }
.qp-feedback { padding: 14px; margin-bottom: 18px; border-radius: 8px; background: #f1eaf7; font-size: 14px; line-height: 1.5; color: #48265a; }
.qp-preview-note { color: #e3cfe9; text-align: center; font-size: 11px; margin: 18px 0 0; }
.qp-panel--journey { border-radius: 8px; border-top: 5px solid #ffca20; }
.qp-panel--journey .qp-plane { border-radius: 50%; background: #71318a; color: #fff; }
.qp-panel--journey .qp-fields { gap: 0; background: #f5f0f8; border: 1px solid #e8dfee; border-radius: 10px; padding: 9px; }
.qp-panel--journey .qp-field { background: transparent; border: 0; border-right: 1px dashed #cbb8d7; border-radius: 0; padding-inline: 18px; }
.qp-panel--journey .qp-submit { border-radius: 7px; box-shadow: none; }
.qp-panel--journey .qp-duration { border-radius: 5px; background: #fff6d2; border-color: #f3df91; color: #6b5210; }
.qp-panel--glass { background: #30163eeF; border-color: #b58bc055; color: #fff; backdrop-filter: blur(16px); box-shadow: 0 22px 70px #1d092b70; }
.qp-panel--glass .qp-plane { background: #73438b; color: #ffda58; }
.qp-panel--glass .qp-service { color: #e0b6f1; }
.qp-panel--glass .qp-heading p { color: #d4c0df; }
.qp-panel--glass .qp-duration { color: #f4ddff; background: #ffffff0b; border-color: #ae80c150; }
.qp-panel--glass .qp-field { background: #ffffff; border-color: transparent; }
.qp-panel--glass .qp-bottom { color: #dbc7e5; border-color: #ffffff20; }
.qp-panel--glass .qp-bottom .icon { color: #e0b6f1; }
.qp-panel--glass .qp-submit { box-shadow: 0 5px 25px #ffca2020; }
@media (max-width: 1100px) { .qp-fields { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .qp-hero .hero-copy { width: 100%; max-width: 550px; } .qp-hero .hero-content { padding-top: 35px; } .qp-heading { align-items: flex-start; flex-direction: column; gap: 12px; } .qp-panel { padding: 20px 18px 0; margin-top: 28px; } .qp-fields { grid-template-columns: 1fr 1fr; } .qp-airport { grid-column: 1 / -1; } .qp-panel--journey .qp-airport { border-right: 0; border-bottom: 1px dashed #cbb8d7; } .qp-title { align-items: flex-start; } .qp-switcher { gap: 8px; } .qp-switcher button { padding: 8px 10px; } .qp-bottom { flex-wrap: wrap; gap: 8px; } }
@media (max-width: 520px) { .qp-fields { grid-template-columns: 1fr; } .qp-panel--journey .qp-field { border-right: 0; border-bottom: 1px dashed #cbb8d7; padding-inline: 10px; } .qp-heading h2 { font-size: 19px; line-height: 1.25; } .qp-plane { width: 38px; height: 38px; border-radius: 10px; } .qp-title { gap: 10px; } .qp-switcher button { font-size: 11px; padding-inline: 9px; } }
@media (prefers-reduced-motion: reduce) { .qp-field { transition: none; } }

.quote-preview .qp-panel--glass h2 { color: #fff; }

/* Override the original quote-form shell only inside these concept panels. */
.quote-preview .qp-form { padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; color: inherit; }
.qp-date-time.input-group > div { width: auto; }
.qp-date-time.input-group { flex-wrap: nowrap; }
.qp-promo { min-width: 0; }
.qp-submit:disabled { opacity: .6; cursor: wait; }
.quote-preview ~ #ui-datepicker-div { z-index: 1100 !important; }
#ui-datepicker-div { border: 1px solid #d7c2e4; border-radius: 12px; box-shadow: 0 12px 35px #31123f30; padding: 12px; font: 14px Roboto, Arial, sans-serif; max-width: calc(100vw - 24px); }
#ui-datepicker-div .ui-datepicker-header { background: #71318a; color: white; border: 0; border-radius: 6px; }
#ui-datepicker-div .ui-state-active { background: #71318a; color: white; border-color: #71318a; }
#ui-datepicker-div .ui-state-highlight { background: #fff1b9; border-color: #ffca20; color: #241335; }
@media (min-width: 521px) and (max-width: 767px) { .qp-date-group, .qp-promo { grid-column: 1 / -1; } }

/* Separate action row leaves all available width for the travel fields. */
.qp-actions { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 24px; }
.qp-actions .qp-submit { min-width: 250px; min-height: 54px; padding: 15px 28px; }
.qp-panel--journey .qp-promo { border-right: 0; }
@media (max-width: 767px) { .qp-actions .qp-submit { width: 100%; min-width: 0; } }

/* Reuse homepage trust items, sized for the quote action row. */
.qp-actions .hero-trust { padding: 0; margin: 0; flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.qp-trust .trust-item { gap: 9px; font-size: 11px; color: #654376; }
.qp-trust .trust-item .icon { width: 30px; height: 30px; color: #71318a; --primary: #fff; }
.qp-panel--glass .qp-trust .trust-item, .qp-panel--glass .qp-trust .trust-item .icon { color: #f3e6fa; }
@media (max-width: 1250px) {
    .qp-actions { flex-wrap: wrap; justify-content: flex-end; }
    .qp-actions .hero-trust { flex-basis: 100%; }
    .qp-trust .trust-item { font-size: 12px; }
}
@media (max-width: 767px) {
    .qp-actions .hero-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .qp-trust .trust-item { font-size: 11px; }
}

.qp-panel--glass .qp-trust .trust-item .icon { --primary: #30163e; }