/* Fore Life Event Search — filter bar + results states.
   Event cards/grid layout are inherited from events-grid.css (shared classes). */

.fore-life-event-search {
  display: block;
}

.fore-life-event-search__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 600;
  color: #153f2a;
  background: #eef2eb;
  border: 1.5px solid #dfe3dc;
  border-radius: 10px;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease;
}
.fore-life-event-search__toggle:hover { background: #e4ebe0; }
.fore-life-event-search__toggle-caret {
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .15s ease;
  margin-top: -3px;
}
.fore-life-event-search__toggle[aria-expanded="false"] .fore-life-event-search__toggle-caret {
  transform: rotate(-45deg);
  margin-top: 3px;
}
.fore-life-event-search__bar.is-collapsed { display: none; }

.fore-life-event-search__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 14px;
  background: #f3f5ef;
  border: 1px solid #dfe3dc;
  border-radius: 14px;
  padding: 18px 20px;
  margin: 0 0 26px;
}

.fore-life-event-search__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 180px;
  min-width: 0;
}

.fore-life-event-search__field--search { flex: 2 1 240px; }

.fore-life-event-search__label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #526057;
}

.fore-life-event-search__input,
.fore-life-event-search__select {
  width: 100%;
  box-sizing: border-box;
  height: 44px;
  padding: 0 12px;
  font-size: 15px;
  color: #17221b;
  background: #fff;
  border: 1.5px solid #dfe3dc;
  border-radius: 10px;
}

.fore-life-event-search__input:focus,
.fore-life-event-search__select:focus {
  outline: none;
  border-color: #174e32;
  box-shadow: 0 0 0 3px rgba(23, 78, 50, 0.12);
}

.fore-life-event-search__custom {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  flex: 1 1 100%;
}
.fore-life-event-search__custom[hidden] { display: none; }

.fore-life-event-search__submit {
  flex: 0 0 auto;
  height: 44px;
  padding: 0 24px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  background: #153f2a;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease;
}

.fore-life-event-search__submit:hover { background: #0f3020; }

.fore-life-event-search__status {
  background: #f3f5ef;
  border-radius: 8px;
  padding: 28px 24px;
  text-align: center;
  font-size: 15px;
  color: #526057;
  margin: 8px 0;
}

.fore-life-event-search__status--error { color: #8a2f2f; background: #fbeceb; }
.fore-life-event-search__status[hidden] { display: none; }

.fore-life-event-search__footer {
  margin-top: 28px;
  text-align: center;
}

.fore-life-event-search__more {
  background: #fff;
  border: 1.5px solid #153f2a;
  border-radius: 999px;
  color: #153f2a;
  font-size: 15px;
  font-weight: 700;
  padding: 11px 30px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.fore-life-event-search__more:hover { background: #153f2a; color: #fff; }
.fore-life-event-search__more:disabled { opacity: 0.6; cursor: default; }
.fore-life-event-search__more[hidden] { display: none; }

@media (max-width: 640px) {
  .fore-life-event-search__bar { padding: 14px; }
  .fore-life-event-search__field,
  .fore-life-event-search__field--search { flex: 1 1 100%; }
  .fore-life-event-search__submit { flex: 1 1 100%; }
}

/* Grid status when the Events Grid is driven by a Filters module. */
.fore-life-events-grid__status--error { color: #8a2f2f; background: #fbeceb; }
.fore-life-events-grid__status[hidden] { display: none; }

/* Actions row (Search + Clear) + Clear button */
.fore-life-event-search__actions { display: flex; gap: 10px; flex: 0 0 auto; align-items: flex-end; }
.fore-life-event-search__clear {
  height: 44px; padding: 0 18px; font-size: 15px; font-weight: 700;
  color: #526057; background: transparent; border: 1.5px solid #dfe3dc;
  border-radius: 10px; cursor: pointer; transition: color .15s ease, border-color .15s ease;
}
.fore-life-event-search__clear:hover { color: #153f2a; border-color: #153f2a; }
@media (max-width: 640px) {
  .fore-life-event-search__actions { flex: 1 1 100%; }
  .fore-life-event-search__submit, .fore-life-event-search__clear { flex: 1 1 auto; }
}

/* Custom dropdown chevron (native arrow looked inconsistent) */
.fore-life-event-search__select {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  padding-right: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23526057' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center; background-size: 14px;
}

/* Searchable dropdown (combobox) for Event Type */
/* Lift the whole filters module above the events grid so open comboboxes/date
   modal aren't painted behind (and click-blocked by) the grid that follows.
   Divi nests the module inside column/row/section stacking contexts, so the
   module z-index alone can't escape — raise the entire ancestor branch that
   contains the filters above the grid's branch. */
.fore_life_event_filters, .fore-life-event-filters { position: relative; z-index: 30; }
.et_pb_section:has(.fore_life_event_filters),
.et_pb_row:has(.fore_life_event_filters),
.et_pb_column:has(.fore_life_event_filters) { position: relative; z-index: 60; }
/* The sidebar/grid section follows the compact bar in the DOM and otherwise
   receives taps over the bar's visually overlapping mobile actions. Keep the
   compact top-bar branch one layer higher until the drawer is opened. */
.et_pb_section:has(.fore-life-event-search__bar:not(.is-sidebar)),
.et_pb_row:has(.fore-life-event-search__bar:not(.is-sidebar)),
.et_pb_column:has(.fore-life-event-search__bar:not(.is-sidebar)) {
  position: relative;
  z-index: 61 !important;
}
/* Compact mode: hide the field labels visually (kept for screen readers) and
   let each field's placeholder carry the meaning. */
.fore-life-event-search__bar.is-labels-hidden .fore-life-event-search__label {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.fore-life-combo { position: relative; }
.fore-life-combo__trigger { text-align: left; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fore-life-combo__panel {
  position: absolute; z-index: 1000; top: calc(100% + 6px); left: 0; right: 0; min-width: 220px;
  background: #fff; border: 1.5px solid #dfe3dc; border-radius: 10px;
  box-shadow: 0 10px 30px rgba(16,30,54,.14); padding: 8px;
}
.fore-life-combo__panel[hidden] { display: none; }
.fore-life-combo__search {
  width: 100%; box-sizing: border-box; height: 38px; padding: 0 10px; margin-bottom: 6px;
  font-size: 14px; color: #17221b; border: 1.5px solid #dfe3dc; border-radius: 8px;
}
.fore-life-combo__search:focus { outline: none; border-color: #174e32; box-shadow: 0 0 0 3px rgba(23,78,50,.1); }
.fore-life-combo__list { list-style: none !important; margin: 0 !important; padding: 0 !important; max-height: 240px; overflow-y: auto; }
/* Theme li rules re-add disc markers, so suppress them on the options too. */
.fore-life-combo__list .fore-life-combo__option { list-style: none !important; }
.fore-life-combo__list .fore-life-combo__option::marker { content: none; }
.fore-life-combo__option { padding: 9px 10px; font-size: 14px; color: #17221b; border-radius: 7px; cursor: pointer; }
.fore-life-combo__option:hover, .fore-life-combo__option.is-active { background: #eef2eb; }
.fore-life-combo__option.is-selected { background: #d9ee8e; font-weight: 700; }
.fore-life-combo__empty { padding: 10px; font-size: 14px; color: #9ca3af; text-align: center; }

/* Date range modal */
.fore-life-event-search__custom.is-modal-managed { display: none !important; }
.fore-life-datemodal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(17,34,27,.5); }
.fore-life-datemodal[hidden] { display: none; }
.fore-life-datemodal__dialog { background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.3); padding: 20px; width: 100%; max-width: 440px; max-height: 90vh; overflow-y: auto; }
.fore-life-datemodal__presets { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fore-life-datemodal__chip { padding: 14px 12px; font-size: 15px; font-weight: 600; color: #17221b; background: #f3f5ef; border: 1.5px solid transparent; border-radius: 10px; cursor: pointer; transition: background .12s ease, border-color .12s ease; }
.fore-life-datemodal__chip:hover { background: #e8ede7; }
.fore-life-datemodal__chip.is-active { background: #153f2a; color: #fff; }
.fore-life-datemodal__chip[data-preset="custom"] { grid-column: 1 / -1; }
.fore-life-datemodal__cal { margin-top: 16px; }
.fore-life-datemodal__cal[hidden] { display: none; }
.fore-life-datemodal__calhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.fore-life-datemodal__month { font-size: 15px; font-weight: 700; color: #17221b; }
.fore-life-datemodal__nav { width: 36px; height: 36px; border: 1.5px solid #dfe3dc; border-radius: 8px; background: #fff; font-size: 18px; color: #153f2a; cursor: pointer; line-height: 1; }
.fore-life-datemodal__nav:hover { background: #f3f5ef; }
.fore-life-datemodal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; }
.fore-life-datemodal__dow { font-size: 11px; font-weight: 700; color: #9ca3af; padding: 6px 0; }
.fore-life-datemodal__day { aspect-ratio: 1 / 1; border: none; background: transparent; border-radius: 8px; font-size: 14px; color: #17221b; cursor: pointer; }
.fore-life-datemodal__day:hover { background: #eef2eb; }
.fore-life-datemodal__day.is-in { background: #eaf3d6; }
.fore-life-datemodal__day.is-start, .fore-life-datemodal__day.is-end { background: #153f2a; color: #fff; }
.fore-life-datemodal__calfoot { margin-top: 12px; }
.fore-life-datemodal__hint { margin: 0 0 6px; text-align: center; font-size: 13px; color: #6b7a70; }
.fore-life-datemodal__rangewrap { display: flex; align-items: center; justify-content: center; gap: 12px; }
.fore-life-datemodal__rangeline { font-size: 14px; font-weight: 600; color: #526057; }
.fore-life-datemodal__reset { padding: 0; background: none; border: none; font-size: 13px; font-weight: 600; color: #153f2a; text-decoration: underline; cursor: pointer; }
.fore-life-datemodal__reset:hover { color: #0e2a1c; }
.fore-life-datemodal__reset[hidden] { display: none; }
.fore-life-datemodal__actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

/* ---- Sidebar layout: stack the fields into a vertical rail ---- */
.fore-life-event-search__bar.is-sidebar { flex-direction: column; align-items: stretch; }
.fore-life-event-search__bar.is-sidebar .fore-life-event-search__field,
.fore-life-event-search__bar.is-sidebar .fore-life-event-search__actions,
.fore-life-event-search__bar.is-sidebar .fore-life-event-search__custom { width: 100%; }
.fore-life-event-search__bar.is-sidebar .fore-life-event-search__custom { flex-direction: column; }
.fore-life-event-search__bar.is-sidebar .fore-life-event-search__actions { flex-direction: column; align-items: stretch; }

/* ---- Mobile filter drawer ---- */
.fore-life-event-search__drawer-toggle,
.fore-life-event-search__drawer-close,
.fore-life-event-search__drawer-overlay { display: none; }

@media (max-width: 768px) {
  /* Divi gives the hero/top-filter section its own higher stacking context.
     Lift every ancestor of the open sidebar above that section so the fixed
     drawer and its overlay remain clickable and fully visible. */
  .et_pb_section:has(.fore-life-event-filters.is-drawer-open),
  .et_pb_row:has(.fore-life-event-filters.is-drawer-open),
  .et_pb_column:has(.fore-life-event-filters.is-drawer-open),
  .fore_life_event_filters:has(.fore-life-event-filters.is-drawer-open),
  .fore-life-event-filters.is-drawer-open {
    position: relative;
    z-index: 10002 !important;
  }
  .fore-life-event-search__drawer-toggle {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    padding: 13px 18px; font-size: 15px; font-weight: 700; color: #fff; background: #153f2a;
    border: 0; border-radius: 10px; cursor: pointer;
  }
  /* The desktop collapse toggle is redundant once the drawer is on. */
  .fore-life-event-filters .fore-life-event-search__toggle { display: none; }
  /* Keep the compact top bar inline. The richer sidebar becomes the one mobile
     drawer so visitors never get two competing Filters buttons. */
  .fore-life-event-filters .fore-life-event-search__bar.is-sidebar {
    position: fixed; top: 0; right: 0; bottom: 0; left: auto;
    width: min(88vw, 360px); max-width: 100%; margin: 0; z-index: 10000;
    overflow-y: auto; transform: translateX(100%); transition: transform .25s ease;
    border-radius: 0; flex-direction: column; flex-wrap: nowrap; align-items: stretch;
  }
  .fore-life-event-filters .fore-life-event-search__bar.is-sidebar.is-collapsed { display: flex; }
  .fore-life-event-filters.is-drawer-open .fore-life-event-search__bar.is-sidebar { transform: translateX(0); }
  .fore-life-event-filters .fore-life-event-search__bar.is-sidebar .fore-life-event-search__field,
  .fore-life-event-filters .fore-life-event-search__bar.is-sidebar .fore-life-event-search__actions {
    width: 100%; flex: 0 0 auto;
  }
  .fore-life-event-search__drawer-close {
    display: block; align-self: flex-end; width: 40px; height: 40px; margin: -4px -6px 2px 0;
    font-size: 28px; line-height: 1; background: none; border: 0; color: #526057; cursor: pointer;
  }
  .fore-life-event-filters.is-drawer-open .fore-life-event-search__drawer-overlay {
    display: block; position: fixed; inset: 0; background: rgba(16, 30, 54, .45); z-index: 9999;
  }
}

/* ---- Rich sidebar panel (grouped radio/checkbox sections) ---- */
.fore-life-event-search__bar.is-sidebar { gap: 0; padding: 20px 22px; align-items: stretch; }
.fore-life-sb__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.fore-life-sb__title { font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #17221b; }
.fore-life-sb__clear { background: none; border: 0; padding: 0; font-size: 13px; font-weight: 600; color: #526057; text-decoration: underline; cursor: pointer; }
.fore-life-sb__clear:hover { color: #153f2a; }
.fore-life-sb__group { padding: 18px 0; border-top: 1px solid #dfe3dc; }
.fore-life-sb__group[hidden] { display: none !important; }
.fore-life-sb__group:first-of-type { border-top: 0; padding-top: 12px; }
.fore-life-sb__heading { margin: 0 0 10px; font-size: 16px; font-weight: 800; color: #17221b; }
.fore-life-sb__opt { display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: 15px; color: #17221b; cursor: pointer; }
.fore-life-sb__opt input { width: 18px; height: 18px; margin: 0; accent-color: #2e5d34; cursor: pointer; flex: 0 0 auto; }
.fore-life-sb__opt.is-soon { color: #9ca3af; cursor: default; }
.fore-life-sb__opt.is-soon input { cursor: default; }
.fore-life-sb__soon { margin-left: auto; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #8a958c; background: #eceeeb; padding: 2px 7px; border-radius: 20px; }
.fore-life-sb__soon--inline { margin-left: 0; display: inline-block; margin-top: 8px; }
.fore-life-sb__location { position: relative; }
.fore-life-sb__location .fore-life-event-search__input { width: 100%; padding-left: 38px; }
.fore-life-sb__location .fore-life-event-search__input-icon {
  position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 15px; height: 17px; pointer-events: none;
  background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23526057'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
}
.fore-life-sb__field { margin-top: 14px; }
.fore-life-sb__sublabel { display: block; font-size: 14px; font-weight: 600; color: #17221b; margin-bottom: 6px; }
.fore-life-sb__field .fore-life-event-search__select { width: 100%; }

/* ---- Quick View slide-in panel ---- */
.fore-life-qv[hidden] { display: none; }
.fore-life-qv { position: fixed; inset: 0; z-index: 100000; }
.fore-life-qv__overlay { position: absolute; inset: 0; background: rgba(16, 30, 54, .5); }
.fore-life-qv__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 92vw); background: #fff; display: flex; flex-direction: column; box-shadow: -10px 0 40px rgba(16, 30, 54, .25); overflow-y: auto; animation: flqvIn .25s ease; }
@keyframes flqvIn { from { transform: translateX(100%); } to { transform: translateX(0); } }
.fore-life-qv__close { position: absolute; top: 12px; right: 12px; z-index: 2; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); font-size: 24px; line-height: 1; color: #17221b; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
.fore-life-qv__media { position: relative; aspect-ratio: 16 / 10; background: #e8ede7; flex: 0 0 auto; }
.fore-life-qv__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fore-life-qv__img[hidden] { display: none; }
.fore-life-qv__badge { position: absolute; top: 16px; left: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 12px; background: #153f2a; color: #fff; line-height: 1; }
.fore-life-qv__badge-m { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.fore-life-qv__badge-d { font-size: 22px; font-weight: 800; }
.fore-life-qv__body { padding: 22px; flex: 1 0 auto; }
.fore-life-qv__title { margin: 0 0 14px; font-size: 24px; font-weight: 800; color: #153f2a; line-height: 1.15; }
.fore-life-qv__website { display: inline-block; margin-bottom: 18px; font-size: 15px; font-weight: 700; color: #153f2a; text-decoration: none; }
.fore-life-qv__website:hover { text-decoration: underline; }
.fore-life-qv__meta { list-style: none; margin: 0; padding: 18px 0 0; border-top: 1px solid #dfe3dc; display: flex; flex-direction: column; gap: 14px; }
.fore-life-qv__meta li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; color: #17221b; }
.fore-life-qv__meta li[hidden] { display: none; }
.fore-life-qv__ico { flex: 0 0 auto; width: 20px; height: 20px; fill: none; stroke: #153f2a; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-top: 1px; }
.fore-life-qv__cta { display: block; margin-top: auto; padding: 18px 22px; background: #153f2a; color: #fff; text-align: center; font-size: 16px; font-weight: 700; text-decoration: none; }
.fore-life-qv__cta:hover { background: #0e2a1c; }
@media (max-width: 480px) { .fore-life-qv__panel { width: 100vw; } }

/* ---- Quick View button as a pill with an eye icon ---- */
.fore-life-events-grid .fore-life-event-card__quick-view {
  -webkit-appearance: none; appearance: none; cursor: pointer;
  padding: 7px 15px; border: 0; border-radius: 999px;
  background: #eef2eb; color: #153f2a; font: inherit; font-size: 13px; font-weight: 700; gap: 6px;
}
.fore-life-events-grid .fore-life-event-card__quick-view:hover { background: #e1ebdb; opacity: 1; }
.fore-life-qv-eye { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Keep the Quick View panel clear of the WP admin bar (logged-in view). */
body.admin-bar .fore-life-qv { top: 32px; }
@media (max-width: 782px) { body.admin-bar .fore-life-qv { top: 46px; } }