
/* ── City search tip — full width below form row ─────────────────────────── */
.saf-city-tip {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 14px 0 0;
    padding: 8px 12px;
    background: #fff8f0;
    border: 1px solid #fde8cc;
    border-radius: 7px;
    font-size: 12px;
    color: #7a4a1e;
    line-height: 1.5;
}
.saf-city-tip svg { margin-top: 2px; color: #FF914C; flex-shrink: 0; }
.saf-city-tip strong { color: #c4520a; }
.saf-city-tip em { font-style: normal; font-weight: 600; color: #a0440a; }
/* Hide when single-city mode is not active */
.saf-city-tip.saf-single-field { display: flex; }

/* ============================================================
   Service Area Finder – Frontend Styles v2.11.8
   Poppins loaded via wp_enqueue_style — no CSS import needed — for
   Elementor CSP compatibility.
   ============================================================ */

.saf-wrapper {
    --saf-accent:      #FF914C;
    --saf-accent-dk:   #e67535;
    --saf-accent-lt:   rgba(255,145,76,.12);
    --saf-accent-glow: rgba(255,145,76,.28);
    --saf-bg:          #ffffff;
    --saf-surface:     #fafafa;
    --saf-border:      #ebebeb;
    --saf-text:        #1a1a2e;
    --saf-mid:         #4a4a6a;
    --saf-muted:       #9a9ab0;
    --saf-r:           8px;
    --saf-r-lg:        12px;
    --saf-shadow:      0 2px 16px rgba(0,0,0,.07);
    --saf-font:        'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    font-family: var(--saf-font);
    color: var(--saf-text);
    max-width: 900px;
    margin: 0 auto;
    box-sizing: border-box;
}
.saf-wrapper *,.saf-wrapper *::before,.saf-wrapper *::after { box-sizing: inherit; }

/* ── Leaflet global img reset neutraliser ───────────────────────────────────
 * Leaflet 1.9.x CSS contains `img { max-width: none }` which overrides the
 * theme's responsive image rules, breaking logos, banners, and footer images.
 * This rule restores standard responsive behaviour across the whole page while
 * carving out an exception for the map tile container where Leaflet needs it.
 * ─────────────────────────────────────────────────────────────────────────── */
body img { max-width: 100%; height: auto; }
.saf-map-container img,
.saf-map-container img.leaflet-tile,
.leaflet-container img { max-width: none; height: auto; }


/* ── Header ──────────────────────────────────────────────── */
.saf-header { text-align:center; margin-bottom:22px; }
.saf-title { font-family:var(--saf-font)!important; font-size:clamp(20px,4vw,28px)!important; font-weight:700!important; margin:0 0 6px!important; color:var(--saf-text)!important; line-height:1.25!important; }
.saf-title::after { content:''; display:block; width:40px; height:3px; background:var(--saf-accent); border-radius:2px; margin:8px auto 0; }
.saf-subtitle { font-size:14px!important; color:var(--saf-mid)!important; margin:4px 0 0!important; font-weight:400!important; }

/* ── Mode toggle ─────────────────────────────────────────── */
.saf-mode-toggle { display:inline-flex; background:var(--saf-surface); border:1px solid var(--saf-border); border-radius:100px; padding:3px; margin-bottom:14px; gap:2px; }
.saf-mode-btn { padding:6px 16px; border:none; border-radius:100px; background:transparent; font-family:var(--saf-font); font-size:12px; font-weight:600; color:var(--saf-muted); cursor:pointer; transition:all .18s; letter-spacing:.03em; }
.saf-mode-btn.active { background:var(--saf-accent); color:#fff; box-shadow:0 2px 8px var(--saf-accent-glow); }

/* ── Form card ───────────────────────────────────────────── */
.saf-form-card { background:var(--saf-bg); border:1.5px solid var(--saf-border); border-radius:var(--saf-r-lg); padding:20px 22px; box-shadow:var(--saf-shadow); margin-bottom:16px; }
.saf-form-row { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; }
.saf-field { display:flex; flex-direction:column; gap:5px; }
.saf-field--city,.saf-field--cities { flex:1 1 240px; }
.saf-field--radius { flex:0 0 148px; }
.saf-field--btn { flex:0 0 auto; }

/* ── Coordinate mode fields ───────────────────────────────── */
.saf-coord-fields { flex:1 1 100%; }
.saf-coords-row { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.saf-field--coord { flex:1 1 160px; }
.saf-field--coord-label { flex:1 1 180px; }
.saf-coord-hint { margin-top:8px; font-size:12px; color:var(--saf-muted); display:flex; align-items:center; gap:5px; line-height:1.5; }
.saf-coord-hint svg { flex-shrink:0; color:var(--saf-accent); }
.saf-coord-hint a { color:var(--saf-accent); font-weight:600; text-decoration:none; }
.saf-coord-hint a:hover { text-decoration:underline; }
.saf-field > label { font-size:11px!important; font-weight:600!important; color:var(--saf-muted)!important; letter-spacing:.07em!important; text-transform:uppercase!important; margin:0!important; padding:0!important; line-height:1!important; }
.saf-label-hint { font-size:10px; font-weight:400; letter-spacing:0; text-transform:none; }
.saf-input-wrap { position:relative; display:flex; align-items:center; }
.saf-input-icon { position:absolute; left:11px; width:15px; height:15px; color:var(--saf-muted); pointer-events:none; transition:color .18s; }
.saf-input,.saf-select,.saf-batch-input { font-family:var(--saf-font)!important; font-size:14px!important; font-weight:500!important; color:var(--saf-text)!important; background:var(--saf-surface)!important; border:1.5px solid var(--saf-border)!important; border-radius:var(--saf-r)!important; outline:none!important; transition:border-color .18s,box-shadow .18s,background .18s!important; width:100%; margin:0!important; box-shadow:none!important; }
.saf-input { padding:10px 13px 10px 36px!important; }
.saf-input:focus,.saf-select:focus,.saf-batch-input:focus { border-color:var(--saf-accent)!important; box-shadow:0 0 0 3px var(--saf-accent-lt)!important; background:#fff!important; }
.saf-input-wrap:focus-within .saf-input-icon { color:var(--saf-accent); }
.saf-select { padding:10px 34px 10px 13px!important; cursor:pointer; -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%239a9ab0' d='M4 6l4 4 4-4'/%3E%3C/svg%3E")!important; background-repeat:no-repeat!important; background-position:right 10px center!important; background-size:16px!important; }
.saf-batch-input { padding:10px 13px!important; resize:vertical; min-height:90px; }
.saf-btn { display:inline-flex!important; align-items:center!important; gap:7px!important; padding:10px 20px!important; font-family:var(--saf-font)!important; font-size:14px!important; font-weight:600!important; color:#fff!important; background:var(--saf-accent)!important; border:none!important; border-radius:var(--saf-r)!important; cursor:pointer!important; transition:background .18s,transform .18s,box-shadow .18s!important; white-space:nowrap!important; box-shadow:0 2px 10px var(--saf-accent-glow)!important; }
.saf-btn:hover { background:var(--saf-accent-dk)!important; transform:translateY(-1px)!important; }
.saf-btn:active { transform:translateY(0)!important; }
.saf-btn:disabled { opacity:.6!important; cursor:not-allowed!important; transform:none!important; }
.saf-btn-icon { width:14px; height:14px; flex-shrink:0; }

/* ── Loading dots ─────────────────────────────────────────── */
.saf-loading-dots { display:inline-flex; gap:3px; align-items:center; vertical-align:middle; }
.saf-loading-dots span { display:inline-block; width:6px; height:6px; background:currentColor; border-radius:50%; animation:saf-bounce 1.1s infinite ease-in-out; }
.saf-loading-dots span:nth-child(2){animation-delay:.15s}.saf-loading-dots span:nth-child(3){animation-delay:.3s}
@keyframes saf-bounce { 0%,80%,100%{transform:scale(.55);opacity:.35}40%{transform:scale(1);opacity:1} }

/* ── Status / Loading area ───────────────────────────────────── */
/* Sits directly below Recent Searches. Collapses to nothing when empty,
   expands naturally to hold the loading card or an error message. */
.saf-status {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height .3s ease, opacity .25s ease, margin .3s ease;
    margin-top: 0;
}
/* Error state */
.saf-status.saf-status--error {
    max-height: 200px;
    opacity: 1;
    margin-top: 14px;
    color: #c0392b;
    background: #fef5f5;
    border: 1.5px solid #f5c6c6;
    border-radius: var(--saf-r);
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 500;
}
/* Info state — retrying message, geolocation detecting, etc. */
.saf-status.saf-status--info {
    max-height: 60px;
    opacity: 1;
    margin-top: 10px;
    text-align: center;
    font-size: 13px;
    color: var(--saf-mid);
    padding: 4px 0;
}
/* Loading card state — card itself controls height */
.saf-status.saf-status--loading {
    max-height: 200px;
    opacity: 1;
    margin-top: 14px;
}

/* ── Results wrap ─────────────────────────────────────────── */
.saf-results-wrap { animation:saf-fadeUp .3s ease; margin-top:20px; }
@keyframes saf-fadeUp { from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none} }

/* ── Top bar ──────────────────────────────────────────────── */
.saf-topbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; flex-wrap:wrap; gap:8px; }
.saf-result-count { font-size:17px; font-weight:700; color:var(--saf-text); }
.saf-result-meta { font-size:13px; color:var(--saf-muted); margin-left:6px; }
.saf-topbar-right { display:flex; gap:6px; flex-wrap:wrap; }
.saf-action-btn { display:inline-flex; align-items:center; gap:5px; padding:6px 12px; font-family:var(--saf-font); font-size:12px; font-weight:600; color:var(--saf-mid); background:transparent; border:1px solid var(--saf-border); border-radius:100px; cursor:pointer; transition:all .18s; }
.saf-action-btn:hover { background:var(--saf-surface); color:var(--saf-text); border-color:var(--saf-accent); }
.saf-action-btn.saf-copied { background:var(--saf-accent); color:#fff; border-color:var(--saf-accent); }

/* ── Filter bar ───────────────────────────────────────────── */
.saf-filter-bar { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.saf-filter-wrap { flex:1; min-width:200px; position:relative; display:flex; align-items:center; }
.saf-filter-icon { position:absolute; left:10px; width:14px; height:14px; color:var(--saf-muted); pointer-events:none; }
.saf-filter-input { font-family:var(--saf-font)!important; font-size:13px!important; font-weight:500!important; padding:8px 12px 8px 32px!important; width:100%; background:var(--saf-surface)!important; border:1.5px solid var(--saf-border)!important; border-radius:100px!important; outline:none!important; color:var(--saf-text)!important; transition:border-color .18s,box-shadow .18s!important; }
.saf-filter-input:focus { border-color:var(--saf-accent)!important; box-shadow:0 0 0 3px var(--saf-accent-lt)!important; background:#fff!important; }
.saf-filter-count { position:absolute; right:12px; font-size:11px; color:var(--saf-muted); font-weight:600; pointer-events:none; }
.saf-chart-area { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.saf-type-chart svg { display:block; }
.saf-chart-legend { display:flex; flex-direction:column; gap:3px; }
.saf-chart-legend-item { display:flex; align-items:center; gap:5px; font-size:11px; color:var(--saf-mid); white-space:nowrap; }
.saf-chart-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }

/* ── Tabs nav ─────────────────────────────────────────────── */
.saf-tabs-nav { display:flex; gap:0; border-bottom:2px solid var(--saf-border); margin-bottom:16px; flex-wrap:wrap; overflow-x:auto; }
.saf-tab-btn { display:inline-flex; align-items:center; gap:5px; padding:9px 16px; font-family:var(--saf-font); font-size:13px; font-weight:600; color:var(--saf-muted); background:transparent; border:none; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:color .18s,border-color .18s,background .18s; white-space:nowrap; }
.saf-tab-btn:hover { color:var(--saf-text); background:var(--saf-surface); }
.saf-tab-btn.active { color:var(--saf-accent); border-bottom-color:var(--saf-accent); background:transparent; }
.saf-tab-count { background:var(--saf-accent-lt); color:var(--saf-accent); font-size:11px; font-weight:700; padding:1px 7px; border-radius:100px; margin-left:2px; }

/* ── Panel actions (Results header) ──────────────────────── */
.saf-panel-actions { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; flex-wrap:wrap; gap:8px; }
.saf-layout-switcher { display:flex; gap:2px; background:var(--saf-surface); border:1px solid var(--saf-border); border-radius:var(--saf-r); padding:3px; }
.saf-layout-btn { padding:5px 7px; border:none; background:transparent; border-radius:5px; cursor:pointer; color:var(--saf-muted); transition:all .15s; display:flex; align-items:center; }
.saf-layout-btn.active,.saf-layout-btn:hover { background:var(--saf-bg); color:var(--saf-accent); box-shadow:0 1px 4px rgba(0,0,0,.06); }
.saf-copy-btn { display:inline-flex; align-items:center; gap:5px; padding:6px 14px; font-family:var(--saf-font); font-size:12px; font-weight:600; color:var(--saf-accent); background:transparent; border:1.5px solid var(--saf-accent); border-radius:100px; cursor:pointer; transition:all .18s; letter-spacing:.03em; text-transform:uppercase; }
.saf-copy-btn:hover { background:var(--saf-accent); color:#fff; }
.saf-copy-btn.saf-copy-btn--success { background:#27ae60; border-color:#27ae60; color:#fff; }

/* ── Grid layout ──────────────────────────────────────────── */
.saf-results.saf-layout-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:10px; }
.saf-layout-grid .saf-place { background:var(--saf-bg); border:1.5px solid var(--saf-border); border-radius:var(--saf-r); padding:13px 15px; cursor:pointer; transition:transform .18s,box-shadow .18s,border-color .18s; animation:saf-popIn .22s ease backwards; }
.saf-layout-grid .saf-place:hover { transform:translateY(-2px); box-shadow:0 4px 16px var(--saf-accent-lt); border-color:var(--saf-accent); }
.saf-layout-grid .saf-place-name { font-size:13px; font-weight:600; color:var(--saf-text); margin-bottom:7px; line-height:1.35; }
.saf-layout-grid .saf-place-meta { font-size:11px; color:var(--saf-muted); display:flex; flex-direction:column; gap:4px; }

/* ── List layout ──────────────────────────────────────────── */
.saf-results.saf-layout-list { display:flex; flex-direction:column; gap:2px; counter-reset:saf-counter; }
.saf-layout-list .saf-place { display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:var(--saf-r); background:var(--saf-bg); border:1px solid transparent; counter-increment:saf-counter; cursor:pointer; transition:background .18s,border-color .18s; animation:saf-popIn .2s ease backwards; }
.saf-layout-list .saf-place:hover { background:var(--saf-surface); border-color:var(--saf-border); }
.saf-layout-list .saf-place::before { content:counter(saf-counter); display:flex; align-items:center; justify-content:center; min-width:24px; height:24px; border-radius:50%; background:var(--saf-accent-lt); color:var(--saf-accent); font-size:11px; font-weight:700; flex-shrink:0; }
.saf-layout-list .saf-place-name { font-size:14px; font-weight:600; flex:1; color:var(--saf-text); }
.saf-layout-list .saf-place-meta { font-size:12px; color:var(--saf-muted); display:flex; gap:8px; flex-wrap:wrap; align-items:center; }

/* ── Tags layout ──────────────────────────────────────────── */
.saf-results.saf-layout-tags { display:flex; flex-wrap:wrap; gap:7px; }
.saf-layout-tags .saf-place { display:inline-flex; align-items:center; gap:5px; padding:6px 14px; background:var(--saf-surface); border:1.5px solid var(--saf-border); border-radius:100px; font-size:13px; font-weight:500; cursor:pointer; transition:all .18s; animation:saf-popIn .2s ease backwards; white-space:nowrap; color:var(--saf-text); }
.saf-layout-tags .saf-place:hover { background:var(--saf-accent); border-color:var(--saf-accent); color:#fff; transform:translateY(-1px); }
.saf-layout-tags .saf-place:hover .saf-place-meta { color:rgba(255,255,255,.75); }
.saf-layout-tags .saf-place-meta { font-size:11px; color:var(--saf-muted); }

/* ── Place shared parts ───────────────────────────────────── */
.saf-place-type-badge { display:inline-block; background:var(--saf-accent-lt); color:var(--saf-accent); font-size:10px; font-weight:700; padding:2px 7px; border-radius:4px; text-transform:capitalize; transition:background .18s, color .18s; }
/* Grid hover: card bg stays white, border turns accent — keep badge fully visible */
.saf-layout-grid .saf-place:hover .saf-place-type-badge { background:var(--saf-accent); color:#fff; }
/* Tags hover: entire chip turns solid accent — badge must stand out with white bg */
.saf-layout-tags .saf-place:hover .saf-place-type-badge { background:#fff; color:var(--saf-accent); }
/* List hover: card bg is light grey — badge unchanged */
.saf-layout-list .saf-place:hover .saf-place-type-badge { background:var(--saf-accent-lt); color:var(--saf-accent); }
.saf-place-dist { font-size:11px; color:var(--saf-muted); }
.saf-map-link { font-size:11px; color:var(--saf-accent); text-decoration:none; font-weight:600; }
.saf-map-link:hover { text-decoration:underline; }
.saf-source-city { font-size:10px; color:var(--saf-muted); background:var(--saf-surface); border:1px solid var(--saf-border); padding:1px 6px; border-radius:4px; }
.saf-place[style*="opacity:.35"],.saf-place.saf-hidden { display:none; }

/* ── Map — inside Results panel ─────────────────────────── */
.saf-map-always { margin-bottom:14px; }
.saf-map-container { height:360px; border-radius:var(--saf-r); overflow:hidden; border:1.5px solid var(--saf-border); background:var(--saf-surface); }
.saf-map-legend { display:flex; gap:16px; margin-top:8px; flex-wrap:wrap; }
.saf-map-legend-item { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--saf-mid); }
.saf-legend-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.saf-dot-center { background:#333; border:2px solid #fff; box-shadow:0 0 0 2px #333; }
.saf-dot-place { background:var(--saf-accent); opacity:.8; }
.saf-legend-circle { font-style:italic; }

/* ── Type filter pills (Issue #3) ────────────────────────── */
.saf-type-filter { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; padding:10px 14px; background:var(--saf-surface); border:1px solid var(--saf-border); border-radius:var(--saf-r); }
.saf-type-filter-label { font-family:var(--saf-font); font-size:11px; font-weight:600; color:var(--saf-muted); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; flex-shrink:0; }
.saf-type-pills { display:flex; flex-wrap:wrap; gap:6px; flex:1; }
.saf-type-pill { display:inline-flex; align-items:center; gap:5px; padding:4px 11px; font-family:var(--saf-font); font-size:12px; font-weight:500; color:var(--saf-text); background:var(--saf-bg); border:1.5px solid var(--saf-border); border-radius:100px; cursor:pointer; transition:all .15s; }
.saf-type-pill:hover { border-color:var(--pill-color,var(--saf-accent)); color:var(--pill-color,var(--saf-accent)); }
.saf-type-pill.active { background:var(--pill-color,var(--saf-accent)); border-color:var(--pill-color,var(--saf-accent)); color:#fff; }
.saf-type-pill-dot { width:7px; height:7px; border-radius:50%; background:var(--pill-color,var(--saf-accent)); flex-shrink:0; transition:background .15s; }
.saf-type-pill.active .saf-type-pill-dot { background:rgba(255,255,255,.7); }
.saf-type-pill-count { font-size:10px; font-weight:600; opacity:.7; margin-left:1px; }
.saf-type-clear { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; font-family:var(--saf-font); font-size:11px; font-weight:600; color:var(--saf-muted); background:transparent; border:1px solid var(--saf-border); border-radius:100px; cursor:pointer; transition:all .15s; white-space:nowrap; }
.saf-type-clear:hover { color:#c0392b; border-color:#c0392b; }
/* Leaflet popup overrides */
.saf-wrapper .leaflet-popup-content-wrapper { border-radius:var(--saf-r); font-family:var(--saf-font); font-size:13px; box-shadow:0 4px 20px rgba(0,0,0,.15); }
.saf-wrapper .leaflet-popup-content { margin:10px 14px; }
.saf-center-dot { width:12px; height:12px; background:#333; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 2px #333; }

/* ── Panel common (schema, keywords, export) ─────────────── */
.saf-panel-intro { font-size:13px; color:var(--saf-mid); line-height:1.6; margin-bottom:14px; padding:10px 14px; background:var(--saf-surface); border-radius:var(--saf-r); border:1px solid var(--saf-border); }
.saf-panel-intro code { background:rgba(0,0,0,.05); padding:1px 5px; border-radius:3px; font-size:12px; }
.saf-ctrl-row { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-bottom:12px; }
.saf-ctrl-field { display:flex; flex-direction:column; gap:5px; min-width:180px; }
.saf-ctrl-field.saf-ctrl-grow { flex:1; }
.saf-ctrl-field label { font-size:11px; font-weight:600; color:var(--saf-muted); letter-spacing:.06em; text-transform:uppercase; }
.saf-code-toolbar { display:flex; align-items:center; justify-content:space-between; padding:8px 12px; background:var(--saf-surface); border:1px solid var(--saf-border); border-bottom:none; border-radius:var(--saf-r) var(--saf-r) 0 0; flex-wrap:wrap; gap:8px; }
.saf-code-label { font-size:12px; font-weight:600; color:var(--saf-muted); }
.saf-copy-code-btn { display:inline-flex; align-items:center; gap:5px; padding:4px 10px; font-family:var(--saf-font); font-size:11px; font-weight:600; color:var(--saf-accent); background:transparent; border:1px solid var(--saf-accent); border-radius:100px; cursor:pointer; transition:all .18s; text-transform:uppercase; letter-spacing:.04em; }
.saf-copy-code-btn:hover { background:var(--saf-accent); color:#fff; }
.saf-copy-code-btn.saf-copied { background:#27ae60; border-color:#27ae60; color:#fff; }

/* ── Schema panel ─────────────────────────────────────────── */
.saf-schema-controls { margin-bottom:14px; }
.saf-schema-output-wrap { border-radius:0 0 var(--saf-r) var(--saf-r); overflow:hidden; border:1px solid var(--saf-border); }
.saf-schema-output { margin:0; padding:16px; background:#f8f8f8; font-size:12px; line-height:1.6; overflow-x:auto; color:#333; max-height:360px; overflow-y:auto; white-space:pre; font-family:monospace; }

/* ── Keywords panel ───────────────────────────────────────── */
.saf-kw-patterns { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; align-items:center; }
.saf-patterns-label { font-size:11px; font-weight:600; color:var(--saf-muted); text-transform:uppercase; letter-spacing:.06em; }
.saf-pattern-check { display:flex; align-items:center; gap:5px; font-size:12px; color:var(--saf-mid); cursor:pointer; }
.saf-pattern-check input { accent-color:var(--saf-accent); cursor:pointer; }
.saf-kw-output-wrap { border-radius:0 0 var(--saf-r) var(--saf-r); overflow:hidden; border:1px solid var(--saf-border); }
.saf-kw-output { max-height:360px; overflow-y:auto; background:var(--saf-bg); }
.saf-kw-item { display:flex; align-items:center; gap:10px; padding:7px 14px; font-size:13px; border-bottom:1px solid var(--saf-border); color:var(--saf-text); }
.saf-kw-item:last-child { border-bottom:none; }
.saf-kw-num { min-width:24px; font-size:11px; color:var(--saf-muted); font-weight:600; }
.saf-kw-count { font-weight:600; color:var(--saf-text); }

/* ── Export panel ─────────────────────────────────────────── */
.saf-export-section { margin-bottom:18px; }
.saf-export-label { font-size:12px; font-weight:600; color:var(--saf-muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:10px; }
.saf-export-btns { display:flex; gap:8px; flex-wrap:wrap; }
.saf-export-btn { display:inline-flex; align-items:center; gap:7px; padding:9px 18px; font-family:var(--saf-font); font-size:13px; font-weight:600; color:var(--saf-text); background:var(--saf-bg); border:1.5px solid var(--saf-border); border-radius:var(--saf-r); cursor:pointer; transition:all .18s; }
.saf-export-btn:hover { border-color:var(--saf-accent); color:var(--saf-accent); background:var(--saf-accent-lt); }
.saf-export-divider { border:none; border-top:1px solid var(--saf-border); margin:16px 0; }
.saf-tmpl-output-wrap { margin-top:10px; border-radius:0 0 var(--saf-r) var(--saf-r); overflow:hidden; border:1px solid var(--saf-border); }
.saf-tmpl-output { margin:0; padding:16px; background:#f8f8f8; font-size:12px; line-height:1.6; color:#333; max-height:400px; overflow-y:auto; white-space:pre; font-family:monospace; }

/* ── Profiles section ─────────────────────────────────────── */
.saf-profiles-section { margin-top:20px; border:1px solid var(--saf-border); border-radius:var(--saf-r); overflow:hidden; }
.saf-profiles-header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:var(--saf-surface); cursor:pointer; }
.saf-profiles-title { font-size:13px; font-weight:600; color:var(--saf-mid); }
.saf-profiles-toggle { font-family:var(--saf-font); font-size:11px; font-weight:600; color:var(--saf-accent); background:transparent; border:none; cursor:pointer; padding:2px 8px; }
.saf-profiles-body { padding:10px 14px; }
.saf-profiles-empty { font-size:13px; color:var(--saf-muted); text-align:center; padding:16px 0; }
.saf-profile-item { display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--saf-border); gap:10px; }
.saf-profile-item:last-child { border-bottom:none; }
.saf-profile-info { flex:1; min-width:0; }
.saf-profile-name { display:block; font-size:13px; font-weight:600; color:var(--saf-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.saf-profile-meta { font-size:11px; color:var(--saf-muted); }
.saf-profile-actions { display:flex; gap:6px; flex-shrink:0; }
.saf-profile-load,.saf-profile-del { padding:4px 10px; font-family:var(--saf-font); font-size:11px; font-weight:600; border-radius:100px; cursor:pointer; border:1px solid; transition:all .15s; }
.saf-profile-load { color:var(--saf-accent); border-color:var(--saf-accent); background:transparent; }
.saf-profile-load:hover { background:var(--saf-accent); color:#fff; }
.saf-profile-del { color:var(--saf-muted); border-color:var(--saf-border); background:transparent; }
.saf-profile-del:hover { color:#c0392b; border-color:#c0392b; }

/* ── CTA / attribution ────────────────────────────────────── */
.saf-cta { margin-top:20px; padding:16px 20px; background:var(--saf-accent-lt); border:1.5px solid rgba(255,145,76,.22); border-left:4px solid var(--saf-accent); border-radius:var(--saf-r); font-size:14px; line-height:1.6; color:var(--saf-text); }
.saf-cta a { color:var(--saf-accent); font-weight:600; }
.saf-attribution { margin-top:14px; font-size:11px; color:#bbb; text-align:right; }
.saf-attribution a { color:#bbb; text-decoration:none; }
.saf-attribution a:hover { color:var(--saf-accent); }

/* ── Animations ───────────────────────────────────────────── */
@keyframes saf-popIn { from{opacity:0;transform:scale(.94) translateY(5px)}to{opacity:1;transform:none} }
.saf-place:nth-child(1){animation-delay:.02s}.saf-place:nth-child(2){animation-delay:.05s}
.saf-place:nth-child(3){animation-delay:.08s}.saf-place:nth-child(4){animation-delay:.11s}
.saf-place:nth-child(5){animation-delay:.14s}.saf-place:nth-child(6){animation-delay:.17s}
.saf-place:nth-child(7){animation-delay:.20s}.saf-place:nth-child(8){animation-delay:.23s}
.saf-place:nth-child(9){animation-delay:.26s}.saf-place:nth-child(10){animation-delay:.29s}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width:640px) {
    .saf-form-card{padding:14px}
    .saf-form-row{flex-direction:column}
    .saf-field--radius,.saf-field--btn{flex:1 1 100%}
    .saf-btn{width:100%;justify-content:center}
    .saf-results.saf-layout-grid{grid-template-columns:1fr 1fr}
    .saf-chart-area{display:none}
    .saf-ctrl-row{flex-direction:column}
    .saf-ctrl-field{min-width:unset}
    .saf-tab-btn{padding:8px 10px;font-size:12px}
    .saf-coords-row{flex-direction:column}
    .saf-field--coord,.saf-field--coord-label{flex:1 1 100%}
}
@media (max-width:380px) { .saf-results.saf-layout-grid{grid-template-columns:1fr} }

/* ── Print styles ─────────────────────────────────────────── */
@media print {
    .saf-mode-toggle,.saf-form-card,.saf-status,.saf-filter-bar,
    .saf-tabs-nav,.saf-panel-actions,.saf-topbar-right,.saf-profiles-section,
    .saf-export-section,.saf-schema-controls,.saf-kw-controls,
    .saf-copy-btn,.saf-action-btn,.saf-layout-switcher { display:none!important; }
    .saf-tab-panel { display:block!important; }
    .saf-map-always { display:none!important; }
    .saf-results.saf-layout-grid { grid-template-columns:repeat(3,1fr)!important; }
    .saf-results.saf-layout-tags { display:flex!important; flex-wrap:wrap!important; }
    .saf-place { break-inside:avoid; }
    .saf-topbar { margin-bottom:8px; }
    .saf-result-count { font-size:15px; }
}

/* ══════════════════════════════════════════════════════════
   GEO SIGNALS — Landmarks, Transit, Roads  (v2.4.0)
══════════════════════════════════════════════════════════ */

.saf-geo-signals {
    margin-top: 24px;
    border-top: 2px solid var(--saf-accent, #FF914C);
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Section wrapper ── */
.saf-geo-section {
    background: #fafafa;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 14px 16px 16px;
    transition: box-shadow .18s;
}
.saf-geo-section:hover { box-shadow: 0 2px 8px rgba(0,0,0,.07); }

/* ── Section header ── */
.saf-geo-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.saf-geo-section-icon {
    font-size: 16px;
    line-height: 1;
    flex-shrink: 0;
}
.saf-geo-section-header strong {
    font-size: 13px;
    font-weight: 700;
    color: #1a1a2e;
    letter-spacing: .01em;
}
.saf-geo-count {
    font-size: 11px;
    color: #888;
    font-weight: 500;
}
.saf-geo-copy-btn {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #555;
    cursor: pointer;
    transition: all .14s;
    font-family: inherit;
}
.saf-geo-copy-btn:hover {
    border-color: var(--saf-accent, #FF914C);
    color: var(--saf-accent, #FF914C);
    background: #fff7f0;
}
.saf-geo-copy-btn.saf-copied {
    background: #f0fdf4;
    color: #16a34a;
    border-color: #16a34a;
}

/* ── Chip container ── */
.saf-geo-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

/* ── Individual chip ── */
.saf-geo-chip {
    display: inline-flex;
    align-items: flex-start;
    gap: 5px;
    padding: 5px 10px 5px 7px;
    border-radius: 20px;
    border: 1px solid #e0e0e0;
    background: #fff;
    font-size: 12px;
    color: #333;
    cursor: pointer;
    transition: all .14s;
    user-select: none;
    line-height: 1.3;
    max-width: 260px;
}
.saf-geo-chip:hover {
    border-color: var(--saf-accent, #FF914C);
    background: #fff7f0;
    color: #1a1a2e;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(255,145,76,.18);
}
.saf-geo-chip.saf-chip-copied {
    background: #f0fdf4;
    border-color: #16a34a;
    color: #16a34a;
}
.saf-chip-icon {
    font-size: 13px;
    line-height: 1;
    flex-shrink: 0;
}
.saf-chip-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
    font-weight: 500;
}
.saf-chip-dist {
    font-size: 10px;
    color: #aaa;
    font-weight: 400;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 2px;
    white-space: nowrap;
}

/* ── Landmark chips — warm accent ── */
.saf-chip-landmark {
    border-color: #fde8d8;
    background: #fff8f4;
}
.saf-chip-landmark:hover {
    background: #fff1e8;
    border-color: var(--saf-accent, #FF914C);
}

/* ── Transit chips — blue tint ── */
.saf-chip-transit {
    border-color: #d6eaf8;
    background: #f4f9fd;
}
.saf-chip-transit:hover {
    background: #e8f4fd;
    border-color: #2980b9;
    color: #1a3a5c;
    box-shadow: 0 2px 6px rgba(41,128,185,.15);
}

/* ── Road groups ── */
.saf-road-group {
    margin-bottom: 14px;
}
.saf-road-group:last-child { margin-bottom: 0; }

/* Road group — flat chips, no header (filter bar handles categories) */
.saf-road-group { display: contents; }

/* Keep legacy label class for filter bar */
.saf-road-type-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--road-color, #888);
    background: #f5f0e8;
    border: 1px solid #e0d5c5;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
}
.saf-chip-road {
    border-color: #e8e0d8;
    background: #fdf8f2;
}
.saf-chip-road:hover {
    background: #f5eee2;
    border-color: #8B6914;
    color: #4a3200;
    box-shadow: 0 2px 6px rgba(139,105,20,.15);
}
.saf-road-ref {
    display: inline-block;
    background: #e8e0d8;
    color: #5a4200;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    letter-spacing: .04em;
}


/* ── Geo signals loading / empty / error states ──────────────────────────── */

/* Animated three-dot spinner used for all landmark loading states */
.saf-geo-loading {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 4px 6px;
    font-size: 13px;
    color: var(--saf-mid);
    font-weight: 500;
}
.saf-geo-spinner-dots {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    flex-shrink: 0;
}
.saf-geo-spinner-dots span {
    display: inline-block;
    width: 7px;
    height: 7px;
    background: var(--saf-accent);
    border-radius: 50%;
    animation: saf-geo-pulse 1.2s infinite ease-in-out;
    opacity: 0.8;
}
.saf-geo-spinner-dots span:nth-child(1) { animation-delay: 0s; }
.saf-geo-spinner-dots span:nth-child(2) { animation-delay: 0.18s; }
.saf-geo-spinner-dots span:nth-child(3) { animation-delay: 0.36s; }
@keyframes saf-geo-pulse {
    0%, 80%, 100% { transform: scale(0.55); opacity: 0.35; }
    40%            { transform: scale(1);    opacity: 1;    }
}
.saf-geo-loading-label {
    font-size: 12px;
    color: var(--saf-mid);
    font-style: normal;
    letter-spacing: 0.01em;
}

/* Empty state (none found) */
.saf-geo-empty-state {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 4px 6px;
    font-size: 12px;
    color: var(--saf-muted);
    line-height: 1.6;
}
.saf-geo-empty-icon { flex-shrink: 0; font-size: 16px; }
.saf-geo-retry-link {
    display: inline;
    background: none;
    border: none;
    padding: 0;
    font-family: var(--saf-font);
    font-size: 12px;
    font-weight: 600;
    color: var(--saf-accent);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    margin-left: 4px;
    transition: color .15s;
}
.saf-geo-retry-link:hover { color: var(--saf-accent-dk); }

/* Error state */
.saf-geo-error-state {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #fef9f5;
    border: 1px solid #fde8cc;
    border-radius: 7px;
    margin: 6px 0;
    flex-wrap: wrap;
}
.saf-geo-error-icon { flex-shrink: 0; font-size: 14px; margin-top: 1px; }
.saf-geo-error-text {
    flex: 1;
    font-size: 12px;
    color: #7a4a1e;
    font-weight: 500;
    line-height: 1.5;
}

/* ── No-results panel (0 neighborhoods found) ────────────────────────────── */
.saf-no-results-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 36px 24px 32px;
    text-align: center;
    animation: saf-fadeUp .3s ease;
}
.saf-no-results-icon {
    opacity: 0.5;
    margin-bottom: 4px;
}
.saf-no-results-title {
    font-family: var(--saf-font) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--saf-text) !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}
.saf-no-results-msg {
    font-size: 13px !important;
    color: var(--saf-mid) !important;
    margin: 0 !important;
    line-height: 1.6 !important;
    max-width: 420px;
}
.saf-no-results-msg strong { color: var(--saf-text); }
.saf-no-results-tip {
    font-size: 12px !important;
    color: var(--saf-muted) !important;
    margin: 4px 0 0 !important;
    max-width: 400px;
    line-height: 1.6 !important;
}
.saf-no-results-tip em {
    font-style: normal;
    font-weight: 600;
    color: var(--saf-accent);
}

/* ── Attribution ── */
.saf-geo-attribution {
    font-size: 10px;
    color: #ccc;
    margin: 4px 0 0;
    text-align: right;
}
.saf-geo-attribution a { color: #bbb; }

/* Road type label solid colors (no color-mix dependency) */
.saf-road-type-label[style*="c0392b"] { background: #fdf0ef; border-color: #f5c6c3; }
.saf-road-type-label[style*="e67e22"] { background: #fef6ee; border-color: #fad5a5; }
.saf-road-type-label[style*="2980b9"] { background: #eef6fd; border-color: #add5ef; }
.saf-road-type-label[style*="7f8c8d"] { background: #f4f4f4; border-color: #d0d3d4; }

/* ══════════════════════════════════════════════════════════
   GEO SIGNALS v2.4.2 — Filter bars, advisory, map pins,
   coords form redesign
══════════════════════════════════════════════════════════ */

/* ── Icon filter bar ── */
.saf-geo-filter-bar { margin-bottom: 10px; }
.saf-geo-filter-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.saf-geo-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    border: 1.5px solid #e0e0e0;
    background: #fff;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 500;
    color: #555;
    cursor: pointer;
    transition: all .14s;
    font-family: inherit;
    white-space: nowrap;
}
.saf-geo-filter-btn span { font-size: 11px; }
.saf-geo-filter-btn em {
    font-style: normal;
    background: #f0f0f0;
    color: #888;
    border-radius: 8px;
    padding: 0 5px;
    font-size: 10px;
    font-weight: 600;
    min-width: 16px;
    text-align: center;
}
.saf-geo-filter-btn:hover {
    border-color: var(--saf-accent, #FF914C);
    color: var(--saf-accent, #FF914C);
    background: #fff7f0;
}
.saf-geo-filter-btn:hover em { background: #ffe8d0; color: #a04010; }
.saf-geo-filter-btn.active {
    border-color: var(--saf-accent, #FF914C);
    background: var(--saf-accent, #FF914C);
    color: #fff;
}
.saf-geo-filter-btn.active em { background: rgba(255,255,255,.25); color: #fff; }

/* Road filter buttons use their road color */
.saf-geo-filter-btn[data-key="rd"] {
    border-color: var(--rd-c, #888);
    color: var(--rd-c, #888);
}
.saf-geo-filter-btn[data-key="rd"]:hover,
.saf-geo-filter-btn[data-key="rd"].active {
    background: var(--rd-c, #888);
    color: #fff;
    border-color: var(--rd-c, #888);
}
.saf-geo-filter-btn[data-key="rd"]:hover em,
.saf-geo-filter-btn[data-key="rd"].active em { background: rgba(255,255,255,.25); color: #fff; }

/* ── Cap advisory ── */
.saf-geo-advisory {
    margin-top: 10px;
    padding: 7px 10px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 11.5px;
    color: #92400e;
    line-height: 1.45;
}

/* ── Map legend geo entries ── */
.saf-dot-landmark {
    display: inline-block;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #16a34a;
    border: 1.5px solid rgba(0,0,0,.15);
}
.saf-dot-transit {
    display: inline-block;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #1d4ed8;
    border: 1.5px solid rgba(0,0,0,.15);
}

/* ── Coords form redesign — Radius inline, button at far right ── */
.saf-coords-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.saf-field--coord        { flex: 1 1 120px; min-width: 110px; }
.saf-field--coord-radius { flex: 0 0 130px; }
.saf-field--coord-btn    { flex: 0 0 auto; margin-left: auto; }
.saf-field--coord-btn label { visibility: hidden; }

@media (max-width: 600px) {
    .saf-field--coord-radius { flex: 1 1 100%; }
    .saf-field--coord-btn    { flex: 1 1 100%; margin-left: 0; }
    .saf-field--coord-btn label { display: none; }
}

/* ── Geo signals retry button ── */
.saf-geo-retry-btn {
    display: inline-block;
    margin-left: 8px;
    padding: 3px 10px;
    background: var(--saf-accent, #FF914C);
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: opacity .15s;
}
.saf-geo-retry-btn:hover { opacity: .85; }

/* ── Geo signals legend loading state ────────────────────────────────────── */
.saf-legend-geo-spinner {
    display: inline-block;
    width: 8px;
    height: 8px;
    border: 1.5px solid #ccc;
    border-top-color: var(--saf-accent, #FF914C);
    border-radius: 50%;
    animation: saf-spin .7s linear infinite;
    flex-shrink: 0;
    margin-right: 2px;
}
@keyframes saf-spin { to { transform: rotate(360deg); } }

/* ── Load More button (in cap advisory) ──────────────────────────────────── */
.saf-load-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 3px 12px;
    background: #fff;
    color: var(--saf-accent, #FF914C);
    border: 1.5px solid var(--saf-accent, #FF914C);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    transition: all .14s;
    white-space: nowrap;
}
.saf-load-more-btn:hover {
    background: var(--saf-accent, #FF914C);
    color: #fff;
}

/* ── "None found" inline retry button ───────────────────────────────────── */
.saf-geo-retry-inline {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 10px;
    background: transparent;
    color: var(--saf-accent, #FF914C);
    border: 1.5px solid var(--saf-accent, #FF914C);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    transition: all .14s;
}
.saf-geo-retry-inline:hover {
    background: var(--saf-accent, #FF914C);
    color: #fff;
}

/* ══════════════════════════════════════════════════════════════════
   v2.6.0 additions — geolocation, autocomplete, history, print
   ══════════════════════════════════════════════════════════════════ */

/* ── Geolocation button ───────────────────────────────────────────── */
.saf-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.saf-geolocate-btn {
    position: absolute;
    right: 10px;
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: var(--saf-muted);
    display: flex;
    align-items: center;
    border-radius: 4px;
    transition: color .15s, background .15s;
    flex-shrink: 0;
}
.saf-geolocate-btn:hover { color: var(--saf-accent); background: var(--saf-accent-lt); }
.saf-geolocate-btn.saf-geolocate-loading { color: var(--saf-accent); animation: saf-pulse .8s ease-in-out infinite; }
@keyframes saf-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
/* Leave room for the geolocate icon inside the input */
.saf-city-input { padding-right: 36px !important; }

/* ── Nominatim autocomplete dropdown ─────────────────────────────── */
.saf-autocomplete-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--saf-bg);
    border: 1.5px solid var(--saf-border);
    border-radius: var(--saf-r);
    box-shadow: 0 6px 24px rgba(0,0,0,.1);
    z-index: 9999;
    overflow: hidden;
    max-height: 260px;
    overflow-y: auto;
}
.saf-field--city { position: relative; }
.saf-ac-item {
    padding: 9px 14px;
    font-size: 13px;
    color: var(--saf-text);
    cursor: pointer;
    border-bottom: 1px solid var(--saf-border);
    line-height: 1.4;
    transition: background .1s;
}
.saf-ac-item:last-child { border-bottom: none; }
.saf-ac-item:hover { background: var(--saf-surface); }
.saf-ac-name { font-weight: 500; }

/* ── Search history strip ─────────────────────────────────────────── */
.saf-history-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0 0;
    flex-wrap: wrap;
}
.saf-history-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--saf-muted);
    letter-spacing: .06em;
    text-transform: uppercase;
    flex-shrink: 0;
}
.saf-history-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
/* .saf-history-chip styles moved to v2.8.2 block below */

/* ── Print stylesheet ─────────────────────────────────────────────── */
@media print {
    /* Hide everything on the page except the SAF widget */
    body > *:not(.saf-print-scope) { display: none !important; }

    .saf-wrapper {
        max-width: 100% !important;
        font-size: 11pt !important;
        color: #000 !important;
    }

    /* Show only key elements */
    .saf-header,
    .saf-results-wrap,
    .saf-tab-panel.saf-panel-results { display: block !important; }

    /* Hide interactive/UI chrome */
    .saf-form-card,
    .saf-mode-toggle,
    .saf-city-tip,
    .saf-history-strip,
    .saf-status,
    .saf-tabs-nav,
    .saf-panel-schema,
    .saf-panel-keywords,
    .saf-panel-export,
    .saf-filter-bar,
    .saf-type-filter,
    .saf-panel-actions,
    .saf-topbar-right,
    .saf-profiles-section,
    .saf-geo-filter-bar,
    .saf-load-more-btn,
    .saf-copy-btn,
    .saf-copy-landmarks-btn,
    .saf-geo-retry-btn,
    .saf-geo-retry-inline,
    .saf-map-always { display: none !important; }

    /* Print header with search metadata */
    .saf-topbar { border-bottom: 1.5pt solid #000; padding-bottom: 6pt; margin-bottom: 10pt; }
    .saf-result-count { font-weight: 700; font-size: 12pt; }
    .saf-result-meta  { font-size: 10pt; color: #444; }

    /* Force grid layout to simple 3-col for print */
    .saf-results.saf-layout-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 6pt !important;
    }
    .saf-place {
        break-inside: avoid;
        border: 0.5pt solid #ccc !important;
        border-radius: 4pt !important;
        padding: 5pt 8pt !important;
        box-shadow: none !important;
    }
    .saf-place-name { font-size: 10pt !important; font-weight: 600; }
    .saf-place-dist,
    .saf-place-type-badge { font-size: 8pt !important; color: #555 !important; }

    /* Landmarks */
    .saf-geo-signals { display: block !important; margin-top: 16pt; border-top: 1pt solid #000; padding-top: 10pt; }
    .saf-geo-chips { display: flex !important; flex-wrap: wrap !important; gap: 4pt !important; }
    .saf-geo-chip { font-size: 8pt !important; border: 0.5pt solid #ccc !important; border-radius: 3pt !important; padding: 2pt 6pt !important; box-shadow: none !important; }

    /* Print footer */
    .saf-attribution {
        display: block !important;
        margin-top: 12pt;
        font-size: 8pt;
        color: #888;
        border-top: 0.5pt solid #ccc;
        padding-top: 6pt;
    }
    .saf-attribution::after {
        content: " · Powered by IntentiveSEO · www.intentiveseo.com";
        font-weight: 600;
        color: #555;
    }

    /* Page setup — footer URL via @page margin boxes */
    @page {
        margin: 1.5cm;
        size: A4 portrait;
        @bottom-center {
            content: "Service Area Finder by IntentiveSEO · www.intentiveseo.com";
            font-size: 7pt;
            color: #888;
        }
    }
}

/* ── v2.6.2 — Load More results + coord history strip ──────────────────── */

/* Coord mode history strip — hidden in single mode, shown in coords mode */
.saf-coord-history {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 0 0;
    flex-wrap: wrap;
}
/* Hide coord history in single mode; JS controls visibility via .show()/.hide() */

/* Load More results bar */
.saf-results-load-more {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0 4px;
    padding: 12px 16px;
    background: #fffbf7;
    border: 1px solid #fde8cc;
    border-radius: var(--saf-r);
    flex-wrap: wrap;
}
.saf-results-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 18px;
    background: #fff;
    color: var(--saf-accent);
    border: 1.5px solid var(--saf-accent);
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    font-family: var(--saf-font);
    cursor: pointer;
    transition: all .14s;
    white-space: nowrap;
}
.saf-results-more-btn:hover {
    background: var(--saf-accent);
    color: #fff;
}
.saf-results-more-meta {
    font-size: 12px;
    color: var(--saf-muted);
}

/* ── v2.7.0 Landmark chip enhancements (Issues 5, 7) ───────────────────── */

/* Chip body wraps name + meta vertically */
.saf-chip-body {
    display: inline-flex;
    flex-direction: column;
    gap: 2px;
    vertical-align: middle;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}
.saf-chip-body .saf-chip-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    font-size: 12px;
    max-width: 100%;
}
.saf-chip-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.saf-chip-operator {
    font-size: 10px;
    color: var(--saf-muted);
    font-style: italic;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.saf-chip-address {
    font-size: 10px;
    color: var(--saf-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* Website indicator on chips */
.saf-chip-has-link {
    cursor: context-menu;  /* hint that right-click does something */
}
.saf-chip-has-link::after {
    content: '↗';
    font-size: 9px;
    opacity: 0.4;
    margin-left: 3px;
    vertical-align: super;
    transition: opacity .15s;
}
.saf-chip-has-link:hover::after { opacity: 0.8; }

/* ── v2.7.2 — Skeleton loading + landmarks exclusion note ───────────────── */

/* ── Skeleton shimmer animation ─────────────────────────────────────────── */
@keyframes saf-shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}

.saf-skeleton-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
    gap: 10px;
}
.saf-skeleton-card {
    background: var(--saf-bg);
    border: 1.5px solid var(--saf-border);
    border-radius: var(--saf-r);
    padding: 13px 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.saf-skeleton-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.saf-skeleton-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: var(--saf-r);
}
.saf-skeleton-num {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex-shrink: 0;
}
.saf-skeleton-badge {
    width: 60px;
    height: 18px;
    border-radius: 4px;
    flex-shrink: 0;
}
.saf-skeleton-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.saf-skeleton-chip {
    height: 32px;
    border-radius: 100px;
}
.saf-skeleton-chip:nth-child(1)  { width: 90px; }
.saf-skeleton-chip:nth-child(2)  { width: 120px; }
.saf-skeleton-chip:nth-child(3)  { width: 75px; }
.saf-skeleton-chip:nth-child(4)  { width: 105px; }
.saf-skeleton-chip:nth-child(5)  { width: 140px; }
.saf-skeleton-chip:nth-child(6)  { width: 85px; }
.saf-skeleton-chip:nth-child(7)  { width: 110px; }
.saf-skeleton-chip:nth-child(8)  { width: 70px; }
.saf-skeleton-chip:nth-child(9)  { width: 130px; }
.saf-skeleton-chip:nth-child(10) { width: 95px; }
.saf-skeleton-chip:nth-child(11) { width: 115px; }
.saf-skeleton-chip:nth-child(12) { width: 80px; }

/* Shared shimmer style for all skeleton elements */
.saf-skeleton-line,
.saf-skeleton-line--sm,
.saf-skeleton-card,
.saf-skeleton-num,
.saf-skeleton-badge,
.saf-skeleton-chip,
.saf-skeleton-row {
    background: linear-gradient(
        90deg,
        var(--saf-border) 25%,
        var(--saf-surface) 50%,
        var(--saf-border) 75%
    );
    background-size: 800px 100%;
    animation: saf-shimmer 1.4s infinite linear;
}
.saf-skeleton-card {
    border-color: transparent !important;
}
.saf-skeleton-line {
    height: 14px;
    border-radius: 4px;
    width: 70%;
}
.saf-skeleton-line--sm {
    height: 11px;
    border-radius: 4px;
    width: 40%;
}

/* Dim non-results tabs while loading */
.saf-tab-btn.saf-tab-loading {
    opacity: 0.4;
    pointer-events: none;
}

/* ── Landmarks exclusion note ────────────────────────────────────────────── */
.saf-lm-exclusion-note {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 10px;
    padding: 7px 10px;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
    border-radius: 6px;
    font-size: 11px;
    color: var(--saf-muted);
    line-height: 1.5;
}
.saf-lm-exclusion-note svg {
    color: var(--saf-muted);
    margin-top: 1px;
}

/* ── v2.11.8 — Compare Mode (#11 & #16) ─────────────────────────────────── */

/* Shared colour tokens */
.saf-dot-a       { background: #3B82F6; }
.saf-dot-b       { background: #22C55E; }
.saf-dot-overlap { background: #FF914C; }

/* Toolbar — mode toggle + compare toggle in one row */
.saf-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

/* iOS-style compare toggle */
.saf-compare-toggle-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    flex-shrink: 0;
}
.saf-compare-toggle-track {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
}
.saf-compare-toggle-cb {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.saf-compare-toggle-thumb {
    position: absolute;
    inset: 0;
    background: #D1D5DB;
    border-radius: 100px;
    transition: background .2s;
}
.saf-compare-toggle-thumb::after {
    content: '';
    position: absolute;
    left: 3px;
    top: 3px;
    width: 16px;
    height: 16px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .2s;
}
.saf-compare-toggle-cb:checked + .saf-compare-toggle-thumb {
    background: var(--saf-accent);
}
.saf-compare-toggle-cb:checked + .saf-compare-toggle-thumb::after {
    transform: translateX(18px);
}
.saf-compare-toggle-wrap:hover .saf-compare-toggle-thumb {
    filter: brightness(.95);
}
.saf-compare-toggle-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--saf-mid);
    letter-spacing: .02em;
}
.saf-compare-toggle-cb:checked ~ .saf-compare-toggle-label,
.saf-compare-toggle-wrap:has(.saf-compare-toggle-cb:checked) .saf-compare-toggle-label {
    color: var(--saf-accent);
}
/* B input wrapper — position:relative so dropdown anchors correctly */
.saf-compare-b-input-wrap {
    position: relative;
}
.saf-compare-b-input-wrap .saf-autocomplete-dropdown {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 1000;
}
/* Location A/B section labels inside form card */
.saf-compare-section-label,
.saf-compare-divider {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--saf-mid);
    margin: 14px 0 8px;
    padding-top: 14px;
    border-top: 1.5px dashed var(--saf-border);
}
.saf-compare-section-label { border-top: none; margin-top: 0; padding-top: 0; margin-bottom: 10px; }
.saf-compare-section-label strong,
.saf-compare-divider strong { color: var(--saf-text); font-size: 13px; }
.saf-compare-b-section { padding: 0 0 4px; }
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 10px;
    align-items: start;
    margin-bottom: 12px;
}
@media (max-width: 540px) {
    .saf-compare-row { grid-template-columns: 1fr; }
    .saf-compare-vs  { text-align: center; padding: 0; }
}
.saf-field--compare-city { position: relative; min-width: 0; }
/* Keep autocomplete dropdowns inside the compare field columns */
.saf-field--compare-city .saf-autocomplete-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 999;
}
.saf-compare-bottom-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: flex-end;
}
.saf-field--compare-radius { flex: 0 0 auto; }
.saf-field--compare-btn    { }
.saf-field--compare-btn .saf-btn { width: 100%; justify-content: center; }
.saf-compare-vs {
    font-size: 12px;
    font-weight: 700;
    color: var(--saf-muted);
    margin-top: 30px; /* align with input, below label */
    flex-shrink: 0;
    text-align: center;
}
.saf-compare-dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
    flex-shrink: 0;
}
.saf-compare-wrap { margin-top: 20px; animation: saf-fadeUp .3s ease; }
.saf-compare-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}
.saf-compare-legend { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.saf-cmp-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 600;
    color: var(--saf-mid);
    padding: 4px 10px;
    border-radius: 100px;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
}
.saf-cmp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.saf-compare-actions { display: flex; gap: 8px; }
.saf-cmp-summary-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.saf-cmp-stat {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: var(--saf-r);
    font-size: 13px;
    font-weight: 500;
}
.saf-cmp-stat strong { font-size: 17px; font-weight: 700; }
.saf-cmp-stat-a       { background: #EFF6FF; color: #1D4ED8; }
.saf-cmp-stat-a strong { color: #1D4ED8; }
.saf-cmp-stat-overlap { background: #FFF7ED; color: #C2410C; }
.saf-cmp-stat-overlap strong { color: #C2410C; }
.saf-cmp-stat-b       { background: #F0FDF4; color: #15803D; }
.saf-cmp-stat-b strong { color: #15803D; }
.saf-cmp-insight {
    font-size: 12px;
    color: var(--saf-muted);
    margin: 0 0 16px;
    line-height: 1.6;
}
.saf-cmp-insight strong { color: var(--saf-text); }
.saf-compare-columns {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}
@media (max-width: 600px) { .saf-compare-columns { grid-template-columns: 1fr; } }
.saf-cmp-col { background: var(--saf-bg); border: 1.5px solid var(--saf-border); border-radius: var(--saf-r-lg); overflow: hidden; }
.saf-cmp-col-a       { border-top: 3px solid #3B82F6; }
.saf-cmp-col-overlap { border-top: 3px solid #FF914C; }
.saf-cmp-col-b       { border-top: 3px solid #22C55E; }
.saf-cmp-col-header {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px 8px;
    background: var(--saf-surface);
    border-bottom: 1px solid var(--saf-border);
}
.saf-cmp-col-title { font-size: 12px; font-weight: 700; color: var(--saf-mid); text-transform: uppercase; letter-spacing: .04em; flex: 1; }
.saf-cmp-col-count { font-size: 11px; color: var(--saf-muted); font-weight: 600; }
.saf-cmp-col-body {
    padding: 10px 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-height: 60px;
    max-height: 320px;
    overflow-y: auto;
}
.saf-cmp-col-body::after {
    content: 'Click any item to copy its name';
    display: block;
    width: 100%;
    font-size: 10px;
    color: var(--saf-muted);
    opacity: .6;
    margin-top: 6px;
    font-style: italic;
}
/* Compare map container */
.saf-compare-map-container { margin-bottom: 20px; }
.saf-compare-map-container.saf-cmp-map-ready {
    height: 340px;
    border-radius: 10px;
    overflow: hidden;
    border: 1.5px solid var(--saf-border);
    background: var(--saf-surface);
}

.saf-cmp-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: opacity .15s, transform .1s;
    white-space: nowrap;
    user-select: none;
}
.saf-cmp-chip:hover { opacity: .8; transform: scale(1.03); }
.saf-cmp-chip:active { transform: scale(.97); }
.saf-chip-a       { background: #DBEAFE; color: #1E40AF; }
.saf-chip-overlap { background: #FFEDD5; color: #9A3412; }
.saf-chip-b       { background: #DCFCE7; color: #166534; }
.saf-cmp-dist  { font-size: 10px; opacity: .7; }
.saf-cmp-empty { font-size: 12px; color: var(--saf-muted); padding: 6px 0; }
.saf-cmp-picker { padding: 12px 0 4px; border-top: 1px solid var(--saf-border); margin-top: 10px; }
.saf-cmp-picker-label { font-size: 12px; color: var(--saf-mid); margin: 0 0 8px; }
.saf-cmp-pick-btn {
    display: block;
    width: 100%;
    text-align: left;
    padding: 7px 10px;
    margin-bottom: 4px;
    border: 1px solid var(--saf-border);
    border-radius: var(--saf-r);
    background: var(--saf-bg);
    font-family: var(--saf-font);
    font-size: 13px;
    font-weight: 600;
    color: var(--saf-text);
    cursor: pointer;
    transition: all .15s;
}
.saf-cmp-pick-btn span { font-size: 11px; font-weight: 400; color: var(--saf-muted); margin-left: 6px; }
.saf-cmp-pick-btn:hover { border-color: var(--saf-accent); color: var(--saf-accent); }
.saf-cmp-far-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    background: #FEF3C7;
    color: #92400E;
    vertical-align: middle;
}
.saf-cmp-near-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    background: #D1FAE5;
    color: #065F46;
    vertical-align: middle;
}
.saf-cmp-pick-cancel { font-family: var(--saf-font); font-size: 11px; color: var(--saf-muted); background: transparent; border: none; cursor: pointer; padding: 4px 0; margin-top: 4px; }
.saf-cmp-pick-cancel:hover { color: var(--saf-text); }
.saf-profile-compare {
    padding: 4px 10px;
    font-family: var(--saf-font);
    font-size: 11px;
    font-weight: 600;
    border-radius: 100px;
    cursor: pointer;
    border: 1px solid #3B82F6;
    transition: all .15s;
    color: #3B82F6;
    background: transparent;
}
.saf-profile-compare:hover { background: #3B82F6; color: #fff; }

/* ── v2.11.8 — Popularity Score + Population ────────────────────────────── */

/* Sort toggle (Distance / Score) */
.saf-sort-toggle {
    display: inline-flex;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
    border-radius: var(--saf-r);
    padding: 3px;
    gap: 2px;
}
.saf-sort-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border: none;
    border-radius: calc(var(--saf-r) - 2px);
    background: transparent;
    font-family: var(--saf-font);
    font-size: 11px;
    font-weight: 600;
    color: var(--saf-muted);
    cursor: pointer;
    transition: all .15s;
    white-space: nowrap;
    letter-spacing: .02em;
}
.saf-sort-btn.active {
    background: var(--saf-accent);
    color: #fff;
    box-shadow: 0 1px 4px var(--saf-accent-glow);
}
.saf-sort-btn:not(.active):hover {
    background: var(--saf-accent-lt);
    color: var(--saf-accent);
}

/* Popularity score stars */
.saf-place-score {
    margin-top: 5px;
}
.saf-score-badge {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    font-size: 11px;
    line-height: 1;
}
.saf-star {
    display: inline-block;
    transition: color .2s;
}
.saf-star-on  { color: #f5a623; }
.saf-star-off { color: var(--saf-border); }
.saf-score-label {
    font-size: 10px;
    font-weight: 700;
    color: var(--saf-muted);
    margin-left: 4px;
    letter-spacing: .02em;
    text-transform: uppercase;
}
/* Score legend below results */
.saf-score-legend {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 10px 0 16px;
    padding: 9px 12px;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
    border-left: 3px solid var(--saf-accent);
    border-radius: 0 var(--saf-r) var(--saf-r) 0;
    font-size: 12px;
    color: var(--saf-mid);
    line-height: 1.55;
}
.saf-score-legend-icon {
    font-size: 14px;
    flex-shrink: 0;
    margin-top: 1px;
    color: var(--saf-accent);
}
.saf-score-legend-text strong { color: var(--saf-text); }
/* Pending state while landmarks load */
.saf-score-pending .saf-star-off {
    animation: saf-score-pulse 1.4s infinite ease-in-out;
}
.saf-score-pending .saf-star-off:nth-child(2) { animation-delay: .1s; }
.saf-score-pending .saf-star-off:nth-child(3) { animation-delay: .2s; }
.saf-score-pending .saf-star-off:nth-child(4) { animation-delay: .3s; }
.saf-score-pending .saf-star-off:nth-child(5) { animation-delay: .4s; }
@keyframes saf-score-pulse {
    0%, 100% { opacity: .2; }
    50%       { opacity: .6; }
}
/* Stars update transition when score arrives */
.saf-score-badge:not(.saf-score-pending) .saf-star-on {
    animation: saf-star-pop .25s ease backwards;
}
@keyframes saf-star-pop {
    from { transform: scale(0.5); opacity: 0; }
    to   { transform: scale(1);   opacity: 1; }
}

.saf-place-pop {
    font-size: 11px;
    color: var(--saf-muted);
    font-weight: 500;
}
.saf-place-src, .saf-place-maplink {
    font-size: 10px;
    color: var(--saf-muted);
}
.saf-layout-list .saf-place-score { margin-top: 0; }

/* Panel actions flex wrap for new sort toggle */
.saf-panel-actions {
    flex-wrap: wrap;
    gap: 8px;
}
@media (max-width: 480px) {
    .saf-sort-toggle { width: 100%; justify-content: center; }
}
.saf-loading-card {
    padding: 14px 16px 12px;
    background: var(--saf-bg);
    border: 1.5px solid var(--saf-accent);
    border-radius: var(--saf-r-lg);
    animation: saf-fadeUp .22s ease;
}

/* Indeterminate progress bar */
.saf-loading-bar {
    height: 3px;
    background: var(--saf-border);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 11px;
}
.saf-loading-bar-fill {
    height: 100%;
    width: 40%;
    background: linear-gradient(90deg, var(--saf-accent-lt), var(--saf-accent), var(--saf-accent-lt));
    background-size: 200% 100%;
    border-radius: 2px;
    animation: saf-bar-slide 1.6s ease-in-out infinite;
}
@keyframes saf-bar-slide {
    0%   { transform: translateX(-120%); }
    100% { transform: translateX(350%); }
}

/* Icon + rotating message */
.saf-loading-msg {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 10px;
}
.saf-loading-msg-icon {
    font-size: 18px;
    flex-shrink: 0;
    animation: saf-icon-pop .35s ease;
}
@keyframes saf-icon-pop {
    0%   { transform: scale(.7); opacity: 0; }
    60%  { transform: scale(1.15); }
    100% { transform: scale(1);   opacity: 1; }
}
.saf-loading-msg-text {
    font-size: 13px;
    font-weight: 600;
    color: var(--saf-text);
    transition: opacity .25s ease;
}
.saf-loading-msg-text.saf-msg-fade { opacity: 0; }

/* Step indicators: Geocoding › Querying › Building results */
.saf-loading-steps {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}
.saf-loading-step {
    font-size: 11px;
    font-weight: 500;
    color: var(--saf-muted);
    padding: 3px 8px;
    border-radius: 20px;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
    transition: background .3s, color .3s, border-color .3s;
    white-space: nowrap;
}
.saf-loading-step.active {
    background: var(--saf-accent-lt);
    color: var(--saf-accent);
    border-color: var(--saf-accent);
    font-weight: 700;
}
.saf-loading-step.done {
    background: #f0faf4;
    color: #16a34a;
    border-color: #bbf7d0;
}
.saf-loading-step-sep {
    font-size: 11px;
    color: var(--saf-border);
    flex-shrink: 0;
}

/* ── History chip X dismiss button ─────────────────────────────────────── */
.saf-history-chip {
    display: inline-flex;
    align-items: center;
    gap: 0;
    background: var(--saf-surface);
    border: 1px solid var(--saf-border);
    border-radius: 20px;
    font-size: 12px;
    font-family: var(--saf-font);
    color: var(--saf-mid);
    overflow: hidden;
    transition: border-color .14s, box-shadow .14s;
    white-space: nowrap;
}
.saf-history-chip:hover {
    border-color: var(--saf-accent);
    box-shadow: 0 0 0 2px var(--saf-accent-lt);
}
/* Main clickable area */
.saf-history-chip-run {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 8px 4px 10px;
    background: transparent;
    border: none;
    font-family: var(--saf-font);
    font-size: 12px;
    color: var(--saf-mid);
    cursor: pointer;
    transition: color .14s;
}
.saf-history-chip-run svg { color: var(--saf-muted); flex-shrink: 0; }
.saf-history-chip:hover .saf-history-chip-run { color: var(--saf-accent); }
.saf-history-chip:hover .saf-history-chip-run svg { color: var(--saf-accent); }
/* × button */
.saf-history-chip-del {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 100%;
    padding: 0 5px 0 2px;
    background: transparent;
    border: none;
    border-left: 1px solid var(--saf-border);
    font-size: 13px;
    line-height: 1;
    color: var(--saf-muted);
    cursor: pointer;
    transition: background .14s, color .14s;
    flex-shrink: 0;
}
.saf-history-chip-del:hover {
    background: #fef2f2;
    color: #e53e3e;
}
/* Remove animation */
.saf-chip-removing {
    opacity: 0;
    transform: scale(.85);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
}

/* ── v2.11.8 — Card highlight + overlap map legend ─────────────── */
/* Card ring flash when a map pin is clicked or card is clicked */
.saf-place.saf-place-highlighted {
    animation: saf-pin-highlight .9s ease forwards !important;
    outline: none;
}
@keyframes saf-pin-highlight {
    0%   { box-shadow: 0 0 0 0 var(--saf-accent-glow); border-color: var(--saf-accent); }
    40%  { box-shadow: 0 0 0 6px rgba(255,145,76,.18); border-color: var(--saf-accent); }
    100% { box-shadow: 0 0 0 0 transparent; }
}
/* List layout highlight override */
.saf-layout-list .saf-place.saf-place-highlighted {
    background: var(--saf-accent-lt) !important;
    border-color: var(--saf-accent) !important;
}
/* Tags layout highlight */
.saf-layout-tags .saf-place.saf-place-highlighted {
    background: var(--saf-accent) !important;
    color: #fff !important;
}

/* ── v2.11.8 — Compare no-results panel + copy hint ─── */
.saf-cmp-no-results {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #FFF7ED;
    border: 1px solid #FED7AA;
    border-radius: var(--saf-r);
    padding: 16px 18px;
    margin-bottom: 16px;
    color: #92400E;
}
.saf-cmp-no-results svg { color: #F97316; margin-top: 2px; }
.saf-cmp-no-results strong { display: block; font-size: 14px; margin-bottom: 4px; color: #7C2D12; }
.saf-cmp-no-results p { font-size: 13px; margin: 0; color: #9A3412; line-height: 1.5; }
.saf-cmp-partial-warn {
    font-size: 13px;
    color: #92400E;
    background: #FFF7ED;
    border: 1px solid #FED7AA;
    border-radius: var(--saf-r);
    padding: 8px 12px;
    margin-bottom: 10px;
}
.saf-cmp-copy-hint {
    display: block;
    font-size: 11px;
    color: var(--saf-muted);
    font-style: italic;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed var(--saf-border);
}

/* ── Compare column footer ─────────────────────────────── */
.saf-cmp-col-footer {
    padding: 7px 12px 8px;
    font-size: 11px;
    color: var(--saf-muted);
    font-style: italic;
    border-top: 1px dashed var(--saf-border);
    text-align: center;
}
