/* Card-style Instant Quote for ridelinelimo.com page heroes (beside the photo, Blacklane-style).
   Address lists and menus open inside the card; the calendar floats over the fields below it.
   Either way body.scrollHeight covers them, so the iframe height always fits. */
:root, html, body, body.wgc { background: transparent !important; background-color: transparent !important; color-scheme: normal; margin: 0; padding: 0; }
body.wgc { --body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; font: 400 14px/1.35 var(--body); color: #fff; overflow: hidden; }
.wgc-card { background: rgba(15,15,15,.85); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(200,169,110,.35); max-width: 420px; margin: 0 auto; border-radius: 14px; padding: 16px; box-shadow: 0 20px 50px rgba(0,0,0,.45); container-type: inline-size; }
.wgc-h { margin: 0; font: 400 18px/1.2 Georgia, 'Times New Roman', serif; color: #c8a96e; }
/* title: "Get Instant Quote | Book Your Ride" on one line; on cards under 380px the second half wraps without the divider
   (container widths are the content box: 380px card - 2x16px padding - 2x1px border = 346px) */
.wgc-h-d { color: rgba(200,169,110,.5); margin: 0 6px; }
.wgc-h-b { color: #fff; }
@container (min-width: 346px) { .wgc-h { white-space: nowrap; } }
@container (max-width: 345.98px) { .wgc-h-d { display: none; } .wgc-h-b { display: block; } }
.wgc-sub { margin: 3px 0 10px; font-size: 11px; line-height: 1.3; color: rgba(255,255,255,.65); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* trip type: one row of 4 equal segments */
.wgc-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; padding: 2px; margin: 0 0 10px; border: 1px solid rgba(200,169,110,.35); border-radius: 8px; }
.wgc-tabs button { border: 0; border-radius: 6px; background: transparent; color: #fff; font: 600 11.5px/1 var(--body); height: 32px; padding: 0 2px; white-space: nowrap; letter-spacing: -.01em; cursor: pointer; }
.wgc-tabs button[aria-selected="true"] { background: #c8a96e; color: #0f0f0f; }

/* fields: 38px tall, label 4px above, 8px apart */
.wgc .bk-field { margin: 0 0 8px; gap: 4px; }
.wgc .bk-field label, .wgc .bk-lab { font-size: 10px; line-height: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.75); }
.wgc .bk-field input, .wgc .dt, .wgc .csel-btn { box-sizing: border-box; width: 100%; height: 38px; min-height: 38px; font-size: 14px; border-radius: 7px; }
.wgc .bk-field input { padding: 0 10px; }
.wgc .csel-btn { padding-top: 0; padding-bottom: 0; }

/* short fields side by side (date + time, return date + time) */
.wgc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 8px; position: relative; }
.wgc-row > .bk-field { position: static; min-width: 0; }
.wgc .dt { padding: 0 2px 0 7px; gap: 0; overflow: hidden; }
.wgc .dt input { height: 36px !important; min-height: 0; font-size: 13px; border-radius: 0; text-align: center; }
.wgc .dt .seg2 { width: 2em; } .wgc .dt .seg4 { width: 3.1em; }
.wgc .dt .sep { font-size: 13px; }
.wgc .cal-btn { padding: 3px; } .wgc .cal-btn svg { width: 16px; height: 16px; }
/* time: HH:MM box + small AM/PM pair, same 38px height */
.wgc .time-row { grid-template-columns: 1fr auto; gap: 4px; }
.wgc .time-row .dt { padding-left: 6px; }
.wgc .ampm { box-sizing: border-box; height: 38px; border-radius: 7px; overflow: hidden; }
.wgc .ampm button { min-width: 0; width: 30px; height: 36px; min-height: 0; padding: 0; font-size: 11px; }
.wgc .ampm button[aria-pressed="true"] { color: #0f0f0f; }

/* popups: address list and menus push the card down; the calendar floats across the whole row */
.wgc .bk-sugg, .wgc .csel-list { position: static; width: 100%; margin-top: 4px; border-radius: 8px; }
.wgc .csel-list { max-height: none; }
.wgc .csel-list, .wgc .csel-list li { color: #1a1a1a; }
.wgc .bk-sugg li { padding: 8px 10px; }
.wgc .cal { position: absolute; top: 100%; left: 0; width: 100%; margin-top: -4px; border-radius: 8px; z-index: 40; }

.wgc .bk-check { margin: 0; font-size: 12px; font-weight: 500; line-height: 16px; align-items: center; gap: 7px; }
.wgc .bk-check input { width: 14px; height: 14px; margin: 0; }
.wgc #retFields { margin-top: 8px; }
.wgc .bk-err { margin: 8px 0 0; padding: 7px 10px; font-size: 12px; }
.wgc-go { display: block; width: 100%; height: 42px; margin-top: 6px; border: 0; border-radius: 8px; background: #c8a96e; color: #0f0f0f; font: 700 15px var(--body); cursor: pointer; }
.wgc-go:hover { background: #d9bd86; }
.wgc-note { margin: 6px 0 0; text-align: center; font-size: 10px; line-height: 1.3; color: rgba(255,255,255,.55); }
