/* Travel insurance search widget (components/insurance-search.html) */
.ins-search { --ins-blue: #1d4ed8; --ins-ink: #0f172a; --ins-muted: #64748b; --ins-line: #e2e8f0; color: var(--ins-ink); }
.ins-search .hidden { display: none !important; }

.ins-search-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ins-search-trip { display: flex; flex-wrap: wrap; gap: 10px; }
.ins-pill input, .ins-radio input { position: absolute; opacity: 0; pointer-events: none; }
.ins-pill span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px; font-weight: 600; font-size: 15px; cursor: pointer; color: #334155; }
.ins-pill span i { color: #cbd5e1; font-size: 18px; }
.ins-pill input:checked + span { background: #e0ecff; color: var(--ins-ink); font-weight: 700; }
.ins-pill input:checked + span i { color: var(--ins-blue); }
.ins-pill input:focus-visible + span, .ins-radio input:focus-visible + span { outline: 2px solid var(--ins-blue); outline-offset: 2px; }
.ins-search-tagline { font-weight: 700; font-size: 16px; color: #1e293b; }

.ins-search-grid { display: grid; grid-template-columns: 1.8fr 1fr 1fr 1.2fr; border: 1px solid var(--ins-line); border-radius: 14px; background: #fff; }
.ins-search-card { position: relative; border-right: 1px solid var(--ins-line); min-width: 0; }
.ins-search-card:last-child { border-right: 0; }
.ins-search-trigger { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 100%; height: 100%; padding: 16px 20px; text-align: left; background: none; border: 0; cursor: pointer; border-radius: 14px; position: relative; }
.ins-search-trigger:hover { background: #f8fbff; }
.ins-search-label { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #475569; }
.ins-search-label i { color: var(--ins-blue); font-size: 11px; margin-left: 4px; }
.ins-search-label--plain { text-transform: uppercase; }
.ins-search-value { font-size: 22px; font-weight: 700; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.ins-search-value b { font-size: 34px; font-weight: 800; }
.ins-search-sub { font-size: 14px; color: var(--ins-muted); }
.ins-search-card--dest .ins-search-value { font-size: 22px; }

/* Native date input stretched invisibly over the card: tapping anywhere opens the picker. */
.ins-search-date { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; border: 0; }
.ins-search-date::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.ins-search-trigger.is-disabled { cursor: default; background: #f8fafc; }
.ins-search-trigger.is-disabled .ins-search-date { pointer-events: none; }

.ins-search-popover { position: absolute; top: calc(100% + 6px); left: 0; z-index: 70; width: min(340px, 90vw); background: #fff; border: 1px solid var(--ins-line); border-radius: 14px; box-shadow: 0 18px 40px rgba(15, 23, 42, .15); padding: 12px; }
.ins-search-popover--right { left: auto; right: 0; }
.ins-search-filter { width: 100%; height: 42px; border: 1px solid var(--ins-line); border-radius: 10px; padding: 0 12px; font-size: 14px; }
.ins-search-filter:focus { outline: none; border-color: var(--ins-blue); }
.ins-search-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.ins-search-chips:empty { display: none; }
.ins-chip { display: inline-flex; align-items: center; gap: 6px; background: #e0ecff; color: var(--ins-blue); border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 600; border: 0; cursor: pointer; }
.ins-search-options { max-height: 230px; overflow-y: auto; list-style: none; margin: 8px 0 0; padding: 0; }
.ins-search-options li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 14px; }
.ins-search-options li:hover { background: #f1f5ff; }
.ins-search-options li[aria-selected="true"] { font-weight: 700; color: var(--ins-blue); }
.ins-search-options li .box { width: 16px; height: 16px; border: 1.5px solid #94a3b8; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; color: #fff; flex: 0 0 16px; }
.ins-search-options li[aria-selected="true"] .box { background: var(--ins-blue); border-color: var(--ins-blue); }
.ins-search-done { margin-top: 10px; width: 100%; height: 40px; border-radius: 10px; background: var(--ins-blue); color: #fff; font-weight: 700; border: 0; cursor: pointer; }
.ins-stepper { display: flex; align-items: center; justify-content: space-between; font-weight: 600; }
.ins-stepper div { display: flex; align-items: center; gap: 14px; }
.ins-stepper button { width: 34px; height: 34px; border-radius: 999px; border: 1px solid var(--ins-line); font-size: 18px; font-weight: 700; color: var(--ins-blue); background: #fff; cursor: pointer; }
.ins-stepper button:disabled { color: #cbd5e1; cursor: not-allowed; }
.ins-search-note { font-size: 12px; color: var(--ins-muted); margin-top: 8px; }

.ins-search-plan { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; }
.ins-radio span { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid var(--ins-line); border-radius: 10px; font-weight: 700; font-size: 15px; cursor: pointer; background: #fff; }
.ins-radio span::before { content: ""; width: 18px; height: 18px; border-radius: 999px; border: 2px solid #94a3b8; box-sizing: border-box; }
.ins-radio input:checked + span { border-color: var(--ins-blue); background: #eff5ff; color: var(--ins-blue); }
.ins-radio input:checked + span::before { border: 5px solid var(--ins-blue); }

.ins-search-error { color: #dc2626; font-size: 13px; font-weight: 600; margin-top: 10px; }
.ins-search-cta { display: flex; justify-content: center; margin-top: 18px; }
.ins-search-submit { min-width: min(420px, 100%); padding: 14px 40px; border-radius: 999px; border: 0; cursor: pointer; font-size: 20px; font-weight: 800; letter-spacing: .03em; color: #fff; background: linear-gradient(90deg, #53b2fe, #065af3); box-shadow: 0 10px 24px rgba(6, 90, 243, .3); }
.ins-search-submit:hover { filter: brightness(1.05); }
.ins-search-foot { text-align: center; font-size: 12px; color: var(--ins-muted); margin-top: 12px; }
.ins-search-foot i { color: var(--ins-blue); }

@media (max-width: 900px) {
    .ins-search-grid { grid-template-columns: 1fr 1fr; }
    .ins-search-card--dest { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--ins-line); }
    .ins-search-card--date + .ins-search-card--date { border-right: 0; }
    .ins-search-card:last-child { grid-column: 1 / -1; border-top: 1px solid var(--ins-line); }
    .ins-search-value b { font-size: 28px; }
    .ins-search-tagline { font-size: 14px; }
}