/* PC 항공권 목록(flightCrashP.apsl) — 2026-10-04
   검색 판 · 떠 있는 메뉴 · 달력 · 항공권 카드는 노선 페이지(flightRoute.css)를 그대로 쓴다. 여기엔 머리 · 도구 줄 · 상태만.
   거르기 트리거는 무재질(design-pc §12 — 재질은 액션 버튼 몫), 고른 줄은 면(--tint)으로만 표시하고 체크 표시를 따로 달지 않는다. */
.fcpTop { padding:40px var(--pc-gutter) 22px; }
.fcpHead { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.fcpHead h1 { color:var(--fr-ink); font-size:30px; line-height:1.2; font-weight:700; }
.fcpAlert { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 14px; border:1px solid var(--ctrl-line); border-radius:999px; background:#fff; font-size:13.5px; font-weight:600; color:var(--fr-ink); transition:border-color .14s; }
.fcpAlert:hover { border-color:var(--ctrl-line-2); }
.fcpAlert svg { width:15px; height:15px; fill:currentColor; stroke:none; }
.fcpTop .frBar { max-width:none; margin:18px 0 0; padding:0; background:transparent; border-radius:0; box-shadow:none; }
.fcpSwap { flex:none; align-self:center; display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; margin:0 -4px; border:1px solid var(--ctrl-line); border-radius:50%; background:#fff; color:var(--fr-ink); cursor:pointer; transition:border-color .14s; }
.fcpSwap:hover { border-color:var(--ctrl-line-2); }
.fcpSwap svg { width:16px; height:16px; }
.frMenu button small, .pkList a span small { margin-left:4px; font-size:12px; font-weight:500; color:var(--sub); }

/* 도구 줄 — 개수 + 거르기·정렬. 목록을 내려도 위에 붙어 있다 */
.fcpTools { position:sticky; top:0; z-index:30; padding:0 var(--pc-gutter); background:var(--bg); border-bottom:1px solid var(--line); }
.fcpTools .frIn { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:56px; }
.fcpCount { font-size:15px; font-weight:700; color:var(--fr-ink); }
.fcpFilters { display:flex; align-items:center; gap:2px; }
.fcpTrig { display:inline-flex; align-items:center; gap:4px; height:34px; padding:0 10px; border:0; border-radius:999px; background:transparent; font:inherit; font-size:14px; font-weight:500; color:var(--fr-ink); cursor:pointer; transition:background .14s; }
.fcpTrig:hover, .fcpTrig[aria-expanded=true] { background:var(--surface); }
.fcpTrig.on { font-weight:700; }
.frShell .fcpTrig svg { width:15px; height:15px; color:var(--sub); transition:transform .15s; }
.fcpTrig[aria-expanded=true] svg { transform:rotate(180deg); }

/* 거르기 메뉴 — 줄 = 이름 + 개수 */
.frMenu .fcpOpt { display:flex; align-items:baseline; justify-content:space-between; gap:18px; min-width:180px; }
.frMenu .fcpOpt small { margin:0; }
.frMenu .fcpOpt[aria-checked=true] { background:var(--tint); font-weight:700; }
.fcpMenuScroll { max-height:min(380px, 60vh); overflow-y:auto; }

/* 목록 */
.fcpBody { padding:22px var(--pc-gutter) 72px; }
.tDest { margin-bottom:5px; font-size:13px; font-weight:700; color:var(--sub); }
.fcpSk { height:104px; border-radius:16px; background:var(--surface); animation:fcpPulse 1.2s ease-in-out infinite; }
@keyframes fcpPulse { 50% { opacity:.5; } }
.fcpEmpty { display:flex; justify-content:center; padding:72px 0; font-size:15px; color:var(--sub); }
.fcpEmpty button { height:38px; padding:0 16px; border:1px solid var(--ctrl-line); border-radius:999px; background:#fff; font:inherit; font-size:14px; font-weight:600; color:var(--fr-ink); cursor:pointer; transition:border-color .14s; }
.fcpEmpty button:hover { border-color:var(--ctrl-line-2); }

/* 아래 검정 토스트(앱 목록과 같은 자리) */
.fcpToast { position:fixed; left:50%; bottom:28px; z-index:80; max-width:calc(100% - 48px); padding:12px 20px; border-radius:999px; background:#20212A; color:#fff; font-size:14px; font-weight:500; transform:translate(-50%, 10px); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; }
.fcpToast.on { opacity:1; transform:translate(-50%, 0); }

@media (max-width:1100px) {
	.fcpTop .frBar { flex-wrap:wrap; }
	.fcpSwap { display:none; }
}
@media (max-width:860px) {
	.fcpTop { padding:24px 16px 16px; }
	.fcpHead h1 { font-size:24px; }
	.fcpTools { padding:0 16px; }
	.fcpTools .frIn { flex-wrap:wrap; min-height:0; padding:8px 0; }
	.fcpFilters { flex-wrap:wrap; }
	.fcpBody { padding:16px 16px 56px; }
}
@media (prefers-reduced-motion:reduce) { .fcpSk { animation:none; } }