/* CanadaFlorida — UI search (v4) */

/* ── Hub/hero search (home + chapter index pages) ────────────────────────── */
.cf-search{position:relative;max-width:680px;margin:0 auto 36px}
.cf-search .search-wrap{position:relative}
.cf-search input[data-cf-search-input]{width:100%;padding:14px 18px 14px 48px;font-size:16px;font-family:var(--cf-font-sans);border:1.5px solid var(--cf-rule);border-radius:12px;background:var(--cf-surface);color:var(--cf-ink);box-shadow:0 1px 3px rgba(0,0,0,.04);transition:border-color .15s,box-shadow .15s}
.cf-search input[data-cf-search-input]:focus{outline:none;border-color:var(--cf-coral);box-shadow:0 2px 8px rgba(229,90,75,.12)}
.cf-search .search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:20px;height:20px;opacity:.5;pointer-events:none}
.cf-search .search-hint{font-family:var(--cf-font-mono);font-size:11.5px;color:var(--cf-muted);text-transform:uppercase;letter-spacing:.06em;margin:8px 0 0;text-align:center}

/* ── Shared results dropdown ─────────────────────────────────────────────── */
[data-cf-search-results]{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--cf-bg);border:1px solid var(--cf-rule);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.14);max-height:480px;overflow-y:auto;z-index:300;text-align:left;text-transform:none;letter-spacing:0;font-family:var(--cf-font-sans)}
[data-cf-search-results].open{display:block}
[data-cf-search-results] .search-results{margin:0;padding:0;list-style:none}
[data-cf-search-results] .search-results li{border-bottom:1px solid var(--cf-rule)}
[data-cf-search-results] .search-results li:last-child{border:none}
[data-cf-search-results] .search-results li a{display:block;padding:12px 18px;text-decoration:none;color:var(--cf-ink);transition:background-color .15s;outline:none}
[data-cf-search-results] .search-results li a:hover,
[data-cf-search-results] .search-results li a:focus{background:var(--cf-bg-2)}
[data-cf-search-results] .search-meta{font-family:var(--cf-font-mono);font-size:10.5px;color:var(--cf-coral);text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}
[data-cf-search-results] .search-title{font-size:14px;font-weight:600;line-height:1.3;margin-bottom:3px;color:var(--cf-ink)}
[data-cf-search-results] .search-lede{font-size:12.5px;line-height:1.4;color:var(--cf-ink-2)}
[data-cf-search-results] .search-empty{padding:18px;text-align:center;color:var(--cf-muted);font-size:14px}

/* ── Topbar (every page) ─────────────────────────────────────────────────── */
.topbar{display:flex !important;justify-content:space-between;align-items:center;padding:10px 56px;background:var(--cf-bg-2);border-bottom:1px solid var(--cf-rule);font-size:12.5px;color:var(--cf-muted);font-family:var(--cf-font-mono);text-transform:uppercase;letter-spacing:.06em;gap:16px}
.topbar .topbar-search{position:relative;flex:1;min-width:0}
.topbar .topbar-search .topbar-search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;opacity:.5;pointer-events:none;color:var(--cf-ink-2)}
.topbar .topbar-search input[data-cf-search-input]{width:100%;padding:7px 12px 7px 30px;font-size:12.5px;font-family:var(--cf-font-mono);text-transform:uppercase;letter-spacing:.04em;border:1px solid var(--cf-rule);border-radius:999px;background:var(--cf-surface);color:var(--cf-ink);outline:none;transition:border-color .15s}
.topbar .topbar-search input[data-cf-search-input]:focus{border-color:var(--cf-coral);box-shadow:0 0 0 2px rgba(229,90,75,.12)}
.topbar .topbar-search input[data-cf-search-input]::placeholder{color:var(--cf-muted);opacity:1}
.topbar .topbar-search [data-cf-search-results]{top:calc(100% + 8px)}
/* Chapters link — simple, no dropdown */
.topbar .chapters-link{flex-shrink:0;font-family:var(--cf-font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--cf-ink-2);text-decoration:none;white-space:nowrap;padding:5px 14px;border:1px solid var(--cf-rule);border-radius:999px;transition:border-color .15s,color .15s}
.topbar .chapters-link:hover{border-color:var(--cf-coral);color:var(--cf-coral)}

@media (max-width:768px){
  .topbar{padding:8px 18px;gap:10px}
  .topbar .chapters-link{font-size:11px;padding:4px 10px}
}