/* long-layover-planner: this tool's own look, loaded only on its page (tools.css is shared and kept under 5 KB gz) */
.chqt-combo { position: relative; }
.chqt-combo-list { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; margin: 4px 0 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--chqt-line); border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.12); max-height: 320px; overflow-y: auto; }
.chqt-combo-list li { padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 15px; line-height: 1.3; }
.chqt-combo-list li b { display: inline-block; min-width: 3.2em; }
.chqt-combo-list li small { display: block; color: var(--chqt-muted); font-size: 13px; padding-left: 3.2em; }
.chqt-combo-list li[aria-selected="true"], .chqt-combo-list li:hover { background: var(--chqt-cream); }
/* a phone sees the answer first (the form follows it), as on the Layover Time Checker */
@media (max-width: 859px) { .chqt[data-tool="long-layover-planner"] .chqt-result { order: -1; } }
/* the hubs: one scrolling row, so a phone keeps the answer near the top */
.lp-chips { display: flex; gap: 6px; min-width: 0; overflow-x: auto; margin: 0 0 10px; padding: 2px 2px 6px; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.lp-chips button, .lp-pp button { flex: 0 0 auto; min-height: 44px; padding: 6px 14px; font-size: 16px; white-space: nowrap; background: #fff; border: 1px solid var(--chqt-line); border-radius: 999px; color: var(--chqt-ink); cursor: pointer; }
.lp-pp { display: flex; gap: 6px; }
.lp-pp button[aria-pressed="true"] { background: #d79d32; border-color: #d79d32; color: #1e1a1a; font-weight: 700; }
.lp-chips button:focus-visible, .lp-pp button:focus-visible { outline: 3px solid #d79d32; outline-offset: 2px; }
.lp-times { margin: 4px 0 8px; font-size: 15px; color: var(--chqt-muted); }
/* can a US passport step out: green no visa, amber apply first, red stay in */
.lp-entry { margin: 10px 0; padding: 10px 12px; border-radius: 10px; border-left: 5px solid #6b7280; background: #f3f4f6; font-size: 15px; line-height: 1.45; }
.lp-entry p { margin: 0 0 4px; }
.lp-eh { font-size: 16px; }
.lp-e-free, .lp-e-home { border-left-color: #1e7a46; background: #e3f3ea; }
.lp-e-eta, .lp-e-arrival, .lp-e-evisa { border-left-color: #9a6a00; background: #fcf3d6; }
.lp-e-before, .lp-e-suspended, .lp-e-restricted { border-left-color: #b3261e; background: #fdecea; }
.lp-q { font-style: italic; }
/* one card per program: a free tour green, a free hotel blue, a paid tour amber */
.lp-cards { display: grid; gap: 10px; margin: 10px 0; }
.lp-card { border: 1px solid var(--chqt-line); border-left-width: 5px; border-radius: 10px; padding: 10px 12px; background: #fff; font-size: 15px; line-height: 1.45; }
.lp-tour { border-left-color: #1e7a46; }
.lp-hotel { border-left-color: #1d5fa8; }
.lp-paid { border-left-color: #9a6a00; }
.lp-card:not(.is-ok) { border-left-color: #9ca3af; }
.lp-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0 0 6px; font-size: 17px; }
.lp-by { font-size: 15px; color: var(--chqt-muted); }
.lp-kind { margin-left: auto; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; background: #eef1f4; color: #374151; }
.lp-tour .lp-kind { background: #e3f3ea; color: #155b34; }
.lp-hotel .lp-kind { background: #e6f0fb; color: #174f8c; }
.lp-paid .lp-kind { background: #fcf3d6; color: #6b4b00; }
.lp-fits { margin: 0 0 6px; padding-left: 1.1em; }
.lp-fits li { margin: 0 0 4px; }
.lp-fits small { display: block; font-size: 14px; color: var(--chqt-muted); }
.lp-yes, .lp-none { margin: 0 0 6px; font-weight: 600; }
.lp-none { color: var(--chqt-muted); }
.lp-who, .lp-catch { margin: 0 0 6px; }
.lp-who { color: var(--chqt-muted); }
.lp-no summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.lp-no ul { margin: 0 0 6px; padding-left: 1.1em; font-size: 14px; }
.lp-src { display: inline-block; min-height: 44px; line-height: 44px; font-size: 15px; }
