/* Container & Filters */
.afp-filters{display:flex;flex-wrap:wrap;gap:var(--afp-gap,16px);margin-bottom:var(--afp-gap,16px)}
.afp-filter{min-width:220px;flex:1 1 220px}
.afp-filter-label{display:block;font-weight:600;margin-bottom:6px}
.afp-multiselect{width:100%;min-height:120px}

/* Grid */
.afp-grid{display:grid;gap:var(--afp-gap,16px)}
.afp-grid.cols-1{grid-template-columns:repeat(1,1fr)}
.afp-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.afp-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.afp-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.afp-grid.cols-5{grid-template-columns:repeat(5,1fr)}
.afp-grid.cols-6{grid-template-columns:repeat(6,1fr)}

.afp-card{background:var(--afp-card-bg,#fff);border:1px solid var(--afp-card-border,#e5e7eb);border-radius:var(--afp-radius,10px);overflow:hidden;display:flex;flex-direction:column}
.afp-card .afp-thumb img{display:block;width:100%;height:auto}
.afp-title{font-size:var(--afp-title-size,16px);font-weight:var(--afp-title-weight,600);line-height:1.35;margin:12px;padding:0}
.afp-title a{text-decoration:none}

/* Loading */
.afp-results.afp-loading:after{content:'Loading…';display:block;margin:8px 0}

/* Empty */
.afp-empty{padding:24px;text-align:center;color:#666}

/* Pagination */
.afp-pagination{display:flex;justify-content:center;gap:8px;margin-top:12px}
.afp-page{border:1px solid #ddd;padding:6px 10px;border-radius:6px;background:#fafafa;cursor:pointer}
.afp-page.is-active{font-weight:700;border-color:#999}

/* Actions */
.afp-actions{width:100%;display:flex;justify-content:flex-end;margin-bottom:8px}
.afp-clear{border:1px solid #ddd;padding:6px 10px;border-radius:6px;background:#fff;cursor:pointer}
.afp-clear:hover{background:#f3f4f6}


/* ACF location+country line */
.afp-location-country{margin-top:4px;opacity:.9}
.afp-filter{flex:0 0 auto;min-width:auto}
.afp-multiselect{width:auto;min-width:0;min-height:120px}
.afp-filter select,.afp-filter input,.afp-filter .afp-multiselect{width:auto;max-width:100%}



/* === ADDED v3: tiny clear buttons + height variables (breakpoints via inline dynamic CSS) === */
:root{
  --afp-filter-height-desktop: 40px;
  --afp-filter-height-tablet: 36px;
  --afp-filter-height-mobile: 32px;
}

.afp-filter{position:relative}

.afp-clear-filter,
.afp-clear-all-inline{
  position:absolute;top:0;border:1px solid #ddd;background:#fff;border-radius:4px;
  padding:0 6px;height:18px;line-height:18px;cursor:pointer;font-size:12px;z-index:2
}
.afp-clear-filter{right:22px}
.afp-clear-all-inline{right:0}
.afp-clear-filter:hover,
.afp-clear-all-inline:hover{background:#f3f4f6}

/* Base height for selects; responsive overrides are injected dynamically */
.afp-filter .afp-multiselect{
  min-height: var(--afp-filter-height-desktop);
}



/* === ADDED v4: compact multiselect height overrides === */
.afp-filter .afp-multiselect{
  height: var(--afp-filter-height-desktop) !important;
  min-height: 0 !important;
  line-height: 1.2;
  padding-top: 2px;
  padding-bottom: 2px;
  box-sizing: border-box;
  overflow: auto;
}
@supports (-webkit-appearance: none) {
  .afp-filter .afp-multiselect{ -webkit-appearance: none; }
}



/* === ADDED v1.3.3: clear button theming via CSS variables === */
.afp-clear-filter,
.afp-clear-all-inline{
  font-size: var(--afp-clear-font-size,12px);
  color: var(--afp-clear-text,#000);
  background: var(--afp-clear-bg,#fff);
  border: 1px solid var(--afp-clear-border,#ddd);
  border-radius: var(--afp-clear-radius,4px);
  height: var(--afp-clear-height,18px);
  line-height: var(--afp-clear-height,18px);
  padding: var(--afp-clear-padding,0 6px);
}

/* MOD11: Preserve newlines in ACF location so each line renders separately */
.afp-card .acf-exerpt,
.afp-card .acf-excerpt {
  white-space: pre-line;
}

.afp-filters ul,.afp-filters li{list-style:none;padding-left:0;margin-left:0;}