/**
 * Business Finder — tool styles
 *
 * The two-up layout, the remote autocomplete, the map furniture and the results
 * table. Cards, tables, meters, chips, alerts, buttons and the combobox list are
 * frikwork's; nothing here restyles one beyond what the Google map forces on us.
 *
 * Everything is namespaced `bizfind-` and every colour is a `--fw-*` token, so
 * both themes work and nothing can leak into another tool.
 */

/* --- Header stats ---------------------------------------------------------- */

.bizfind-stats { margin-bottom: var(--fw-space-lg); }
.bizfind-stats .app-stat__value { font-size: 1.4rem; overflow-wrap: anywhere; }

/* --- Two-up layout --------------------------------------------------------- */

.bizfind-layout {
  display: grid;
  grid-template-columns: minmax(320px, 400px) 1fr;
  gap: var(--fw-space-lg);
  align-items: start;
  margin-bottom: var(--fw-space-lg);
}

.bizfind-col {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-lg);
  /* Grid children default to min-content width; without this a long region name
     in the results table widens the column instead of scrolling inside it. */
  min-width: 0;
}

/* .app-panel clips its content so the card's rounded corners hold. The
   autocomplete panel has to escape that, and this keeps the layer order right:
   the map panel gets its own stacking context so the Google map's internal
   z-indexes stay inside it, and the search column sits one layer above. */
.bizfind-search-panel { overflow: visible; position: relative; z-index: 1; }
.bizfind-map-panel { position: relative; z-index: 0; overflow: hidden; }

/* --- Autocomplete ---------------------------------------------------------- */

.bizfind-ac { position: relative; }
.bizfind-ac__control { position: relative; display: block; }

/* Room for the clear button and the spinner inside the right-hand edge. */
.bizfind-ac__input { padding-right: 2.5rem; }

.bizfind-ac__clear,
.bizfind-ac__spinner {
  position: absolute;
  top: 50%;
  right: 0.7rem;
  transform: translateY(-50%);
}

.bizfind-ac__clear {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  color: var(--fw-text-muted);
  background: none;
  border: 0;
  border-radius: var(--fw-radius-sm);
  cursor: pointer;
}
.bizfind-ac__clear:hover { color: var(--fw-text); background: var(--fw-bg-hover); }

.bizfind-ac__spinner { display: none; pointer-events: none; }
.bizfind-ac.is-loading .bizfind-ac__spinner { display: block; }
.bizfind-ac.is-loading .bizfind-ac__clear { display: none; }

.bizfind-ac__panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 320px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--fw-bg-card);
  border: 1px solid var(--fw-border);
  border-radius: var(--fw-radius-md);
  box-shadow: var(--fw-shadow-lg);
}

.bizfind-ac__panel .fw-combobox__list { max-height: 320px; padding: var(--fw-space-xs); }

.bizfind-ac__group {
  padding: var(--fw-space-xs) var(--fw-space-md);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fw-text-muted);
}

.bizfind-ac__option {
  display: flex;
  align-items: baseline;
  gap: var(--fw-space-sm);
}
.bizfind-ac__label { flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bizfind-ac__sub {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  font-size: 0.75rem;
  color: var(--fw-text-muted);
}

/* --- Selected location chip ------------------------------------------------ */

.bizfind-chip-slot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--fw-space-xs);
  margin-bottom: var(--fw-space-md);
  padding: var(--fw-space-xs) var(--fw-space-sm);
  background: color-mix(in srgb, var(--fw-brand) 10%, transparent);
  border: 1px solid var(--fw-brand);
  border-radius: var(--fw-radius-md);
  font-size: 0.82rem;
}
.bizfind-chip__type {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fw-brand-text);
}
.bizfind-chip__label { font-weight: 600; color: var(--fw-text); }
.bizfind-chip__sub { color: var(--fw-text-muted); }

/* --- Scope + filters ------------------------------------------------------- */

.bizfind-scope .fw-check-row.is-disabled { opacity: 0.45; cursor: not-allowed; }
.bizfind-scope .fw-check-row.is-disabled:hover { background: none; }

.bizfind-radius {
  display: inline-block;
  width: auto;
  margin: 0 0.25rem;
  padding-block: 0.15rem;
  font-size: 0.82rem;
}

.bizfind-filters { margin-bottom: var(--fw-space-md); }
.bizfind-filters__summary {
  margin-left: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 55%;
  color: var(--fw-text-muted);
}

.bizfind-toggles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0;
}

.bizfind-go { margin-top: var(--fw-space-sm); }

.bizfind-lastsearch {
  display: flex;
  align-items: flex-start;
  gap: var(--fw-space-sm);
  margin-top: var(--fw-space-md);
  padding: var(--fw-space-sm) var(--fw-space-md);
  font-size: 0.8rem;
  color: var(--fw-text-2);
  background: var(--fw-bg-2);
  border-radius: var(--fw-radius-md);
}
.bizfind-lastsearch i { margin-top: 0.15rem; color: var(--fw-text-muted); }

/* --- How it works ---------------------------------------------------------- */

.bizfind-steps {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--fw-text-2);
}
.bizfind-steps li + li { margin-top: 0.3rem; }

/* --- Map ------------------------------------------------------------------- */

.bizfind-map {
  position: relative;
  width: 100%;
  min-height: 420px;
  background: var(--fw-bg-2);
}

.bizfind-map__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--fw-space-sm);
  color: var(--fw-text-muted);
  text-align: center;
}
.bizfind-map__placeholder i { font-size: 2.5rem; }
.bizfind-map__placeholder p { margin: 0; }

/* The Google info window ships its own light chrome. These pull the parts that
   sit over the map onto frikwork's tokens so dark mode is not a white box. */
.bizfind-info { min-width: 180px; color: #1d1d1d; font-size: 0.82rem; line-height: 1.5; }
.bizfind-info__name { display: block; margin-bottom: 0.15rem; }
.bizfind-info__addr { margin-bottom: 0.3rem; color: #555; }
.bizfind-info a { color: #0b6b3a; }

/* --- Progress panels ------------------------------------------------------- */

.bizfind-progress .app-panel__body { padding-block: var(--fw-space-md); }

.bizfind-progress__head {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-sm);
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--fw-space-sm);
  font-size: 0.88rem;
}
.bizfind-progress__actions { display: flex; align-items: center; gap: var(--fw-space-xs); }
.bizfind-progress p { margin: var(--fw-space-sm) 0 0; }
.bizfind-progress .is-warning { color: var(--fw-warning); }

/* --- Results toolbar ------------------------------------------------------- */

.bizfind-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-md);
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--fw-space-md);
}
.bizfind-toolbar__left,
.bizfind-toolbar__right {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-sm);
  align-items: center;
  min-width: 0;
}
.bizfind-toolbar__filter {
  width: 240px;
  max-width: 100%;
  padding-block: 0.3rem;
  font-size: 0.82rem;
}
.bizfind-toolbar .fw-check-row { padding-block: 0.25rem; font-size: 0.8rem; white-space: nowrap; }

/* --- Results table --------------------------------------------------------- */

.bizfind-table { font-size: 0.82rem; }
.bizfind-table th { white-space: nowrap; }
.bizfind-table td { vertical-align: top; }

.bizfind-table__sort { cursor: pointer; -webkit-user-select: none; user-select: none; }
.bizfind-table__sort i { margin-left: 0.3rem; color: var(--fw-text-muted); font-size: 0.75em; }
.bizfind-table__sort:hover { color: var(--fw-brand-text); }
.bizfind-table__sort:focus-visible { outline: 2px solid var(--fw-brand); outline-offset: -2px; }

.bizfind-table__check { width: 2rem; }
.bizfind-table__num { text-align: right; font-variant-numeric: tabular-nums; }
.bizfind-table__actions { white-space: nowrap; text-align: right; }
.bizfind-table__actions .fw-btn { padding: 0.2rem 0.45rem; }

.bizfind-name { font-weight: 500; color: var(--fw-text); }
.bizfind-cell-name { min-width: 180px; }
.bizfind-cell-address { min-width: 200px; color: var(--fw-text-2); }
.bizfind-cell-cat { color: var(--fw-text-2); }

.bizfind-link {
  color: var(--fw-brand-text);
  overflow-wrap: anywhere;
}
.bizfind-missing { color: var(--fw-text-muted); }
.bizfind-complete { color: var(--fw-success); }

/* A website stored before the scheme check existed. Shown, never linked. */
.bizfind-unsafe {
  color: var(--fw-text-muted);
  text-decoration: underline dotted;
  overflow-wrap: anywhere;
}

.bizfind-foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-md);
  align-items: center;
  justify-content: space-between;
  margin-top: var(--fw-space-md);
}
.bizfind-foot p { margin: 0; }

/* --- Pipeline -------------------------------------------------------------- */

.bizfind-pipeline__grid { margin-bottom: var(--fw-space-lg); }

.bizfind-pipeline__item { min-width: 0; }
.bizfind-pipeline__label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--fw-space-sm);
  margin-bottom: 0.35rem;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--fw-text);
}
.bizfind-pipeline__item p { margin: 0.35rem 0 0; }

.bizfind-pipeline__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--fw-space-lg);
  padding-top: var(--fw-space-md);
  border-top: 1px solid var(--fw-border);
}
.bizfind-pipeline__meta p { margin: 0.25rem 0 0; }
.bizfind-pipeline__meta code { overflow-wrap: anywhere; }
.bizfind-pipeline__meta .fw-btn { margin-left: 0.35rem; }

/* --- Responsive ------------------------------------------------------------ */

@media (max-width: 1100px) {
  .bizfind-layout { grid-template-columns: 1fr; }
  .bizfind-map { min-height: 340px; }
}

@media (max-width: 760px) {
  .bizfind-toolbar { flex-direction: column; align-items: stretch; }
  .bizfind-toolbar__filter { width: 100%; }
  /* The one column a phone cannot fit. The CSV always carries every column, and
     the table scrolls horizontally inside .fw-table-wrap for the rest. */
  .bizfind-cell-cat,
  .bizfind-table th[data-sort="category"] { display: none; }
}