/* conditions.css — v18 live conditions (conditions.js): Conditions tab, place view, posting, route panel block */
.cond { gap: 12px; }
.cond-cta { width: 100%; min-height: 44px; font-size: 14.5px; }
.cond-seg .seg__btn { flex-direction: row !important; justify-content: center; align-items: center; gap: 6px !important; font-size: 13px; min-height: 38px; }
.cond-n { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 999px; background: var(--bg-3); color: var(--text-2); font-size: 11px; font-weight: 650; font-variant-numeric: tabular-nums; }
.seg__btn.is-active .cond-n { background: var(--accent-soft, rgba(107,245,193,.18)); color: var(--text); }
.cond-note { margin: -2px 0 0; font-size: 12px; color: var(--muted); line-height: 1.45; }
.cond-h { margin: 6px 0 0; font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--text-2); display: flex; align-items: center; gap: 8px; }
.cond-empty { margin: 0; padding: 12px; border: 1px dashed var(--line-strong); border-radius: var(--r-md); font-size: 12.5px; color: var(--muted); }

/* report cards */
.cond-post.is-official { border-left: 3px solid var(--accent); }
.cond-place { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 6px 8px; margin: -4px -4px 0; width: calc(100% + 8px); border-radius: 8px; background: rgba(255,255,255,.04); color: var(--text); font-size: 13px; }
.cond-place:hover { background: rgba(255,255,255,.08); }
.cond-place:hover .cond-place__n { color: var(--accent); }
.cond-place > svg { width: 14px; height: 14px; color: var(--muted); flex: none; }
.cond-place__n { font-weight: 600; min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .15s var(--ease); }
.cond-kind { font-size: 10.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); flex: none; }
.cond-ico { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; background: var(--bg-3); color: var(--text-2); flex: none; }
.cond-ico svg { width: 14px; height: 14px; }
.cond-ico--lg { width: 38px; height: 38px; border-radius: 10px; }
.cond-ico--lg svg { width: 20px; height: 20px; }
.cond-comm { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; background: rgba(167,139,250,.18); color: #c9b8ff; }
.cond-badge { display: inline-flex; align-items: center; margin-left: 4px; padding: 1px 6px; border-radius: 999px; font-size: 10.5px; font-weight: 700; background: var(--accent-soft, rgba(107,245,193,.18)); color: var(--accent); }
.cond-del { width: 26px; height: 26px; }
.cond-del svg { width: 14px; height: 14px; }

/* place view */
.cond-ph { display: flex; align-items: center; gap: 12px; }
.cond-ph .panel__title { margin: 2px 0 0; overflow-wrap: anywhere; }
.cond-acts { flex-wrap: wrap; gap: 8px; }
.cond-old > summary { cursor: pointer; font-size: 12.5px; color: var(--text-2); padding: 6px 0; }
.cond-old[open] > summary { margin-bottom: 8px; }
.cond-delarea { align-self: flex-start; font-size: 12px; color: var(--muted); margin-top: 6px; }
.cond-delarea:hover { color: #ff6b6b; }

/* posting */
.cond-where { display: flex; flex-direction: column; gap: 8px; }
.cond-opt { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 12px; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: rgba(255,255,255,.03); color: var(--text); transition: border-color .15s var(--ease), background .15s var(--ease); }
.cond-opt:hover, .cond-opt:focus-visible { border-color: var(--accent); background: rgba(255,255,255,.06); }
.cond-opt > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cond-opt b { font-size: 14.5px; font-weight: 650; }
.cond-opt small { font-size: 12px; color: var(--muted); line-height: 1.35; }
.cond-opt--draw { border-style: dashed; }
.cond-target { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: var(--r-md); border: 1px solid var(--accent); background: rgba(255,255,255,.04); }
.cond-target__t { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.cond-target .cond-place__n { white-space: normal; overflow-wrap: anywhere; }
.cond-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.cond-chip { padding: 7px 11px; border-radius: 999px; border: 1px solid var(--line-strong); font-size: 12.5px; color: var(--text-2); background: transparent; min-height: 32px; transition: border-color .12s var(--ease), background .12s var(--ease), color .12s var(--ease); }
.cond-chip:hover { border-color: var(--text-2); color: var(--text); }
.cond-chip.is-on { border-color: var(--accent); background: var(--accent-soft, rgba(107,245,193,.18)); color: var(--text); font-weight: 600; }
.cond-chip--hz { display: inline-flex; align-items: center; gap: 6px; }
.cond-chip--hz::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--hz); box-shadow: 0 0 0 1px rgba(255,255,255,.35); }
.cond-chip--hz.is-on { border-color: var(--hz); background: color-mix(in srgb, var(--hz) 22%, transparent); }

/* route panel block */
.cond-minis { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cond-mini { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; align-items: center; padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--line); background: rgba(255,255,255,.03); }
.cond-mini.is-official { border-left: 3px solid var(--accent); }
.cond-mini__t { font-size: 13px; font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.cond-mini__m { grid-column: 1 / -1; font-size: 11.5px; color: var(--muted); }
.rt-block--cond .btnrow { gap: 8px; flex-wrap: wrap; }

/* distance from the middle of the map, under the place name */
.cond-dist { display: block; margin: -2px 0 6px; padding-left: 34px; font-size: 11.5px; color: var(--muted); }

/* when a report was posted — always in words, fresh ones highlighted, a day or older dimmed */
.cond-posted { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--text-2); flex: none; }
.cond-posted::before { content: ''; width: 12px; height: 12px; flex: none; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat; }
.cond-posted.is-fresh { color: var(--accent, #5ef0c0); }
.cond-posted.is-old { color: var(--muted); font-weight: 500; }
.cond-posted--sm { font-size: 11.5px; gap: 4px; }
.cond-posted--sm::before { width: 10px; height: 10px; }
.cond-onlypub { margin: 0 0 8px; line-height: 1.45; }
/* v18.2: friends-only route reports */
.cond-fonly { display: inline-flex; align-items: center; margin-left: 6px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; background: rgba(96,165,250,.18); color: #a9cdfd; vertical-align: middle; white-space: nowrap; flex: none; }
.cond-fonly-note { margin: 0 0 10px; }
.cond-fonly-note .cond-fonly { margin: 0 6px 0 0; }
/* v18.6: reader filters (When / Sport / Place) — reports no longer expire */
.cond-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0 4px; }
.cond-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cond-f--wide { grid-column: 1 / -1; }
.cond-f__l { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.cond-f select { width: 100%; min-width: 0; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line, rgba(255,255,255,.14)); background: rgba(255,255,255,.06); color: inherit; font: inherit; font-size: 14px; }
.cond-f select option { background: #161b20; color: #e8eef3; }
.cond-f__reset { grid-column: 1 / -1; justify-self: start; font-size: 13px; }
.cond-sport { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; background: rgba(255,255,255,.08); color: var(--muted); white-space: nowrap; }
.cond-window { margin: 6px 0 2px; }

/* v18.7 — Filters button + box (time and several sports) */
.cond-fbar { display: flex; align-items: center; gap: 10px; margin: 2px 0 12px; min-width: 0; }
.cond-fbtn { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.cond-fbtn.is-open { border-color: var(--accent); }
.cond-fsum { font-size: 12.5px; color: var(--muted); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cond-filters { display: flex; flex-direction: column; gap: 14px; margin: 0 0 14px; padding: 12px; border-radius: 14px; border: 1px solid var(--line, rgba(255,255,255,.14)); background: rgba(255,255,255,.04); }
.cond-f__l .hint { text-transform: none; letter-spacing: 0; font-weight: 500; }
.cond-f__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cond-sports { display: inline-flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; min-width: 0; }
