/* ==========================================================================
   Archive pages (moved from Additional CSS)
   ========================================================================== */

/* --- Archive Pages: Full-Width Layout --- */
@media (min-width: 1024px) {
  .archive .site-content{
    max-width:95% !important; margin-left:auto !important; margin-right:auto !important;
    padding-left:.5rem !important; padding-right:.5rem !important;
  }
  .archive .container, .archive .hp-page.site-main{ max-width:100% !important; }
}

/* --- General Layout: Content Left, Map Right (60/40) --- */
@media (min-width: 1024px) {
  body.archive .hp-page__content { order:1; padding-right:2rem; }
  body.archive .hp-page__sidebar { order:2; padding-left:0; }
  .archive .hp-page__content.hp-col-sm-8{ flex:0 0 60% !important; max-width:60% !important; }
  .archive .hp-page__sidebar.hp-col-sm-4{ flex:0 0 40% !important; max-width:40% !important; }
  .archive .hp-page__main .hp-row{ display:flex !important; flex-wrap:nowrap !important; }
}

/* --- Header & Vertical Positioning --- */
body.archive .header-hero{ display:none !important; }
body.archive .site-content{ padding-top:0 !important; }
@media (min-width: 1024px){
  .archive .hp-page.site-main{ margin-top:-2.5rem !important; }
  .archive .hp-map{ height: calc(100vh - 100px) !important; }
  .archive .hp-page__main .hp-row{ align-items:flex-start; }
}

/* Map rounding */
.archive .hp-map{ border-radius:20px !important; }

/* --- Title & Controls Wrapper --- */
.archive-controls-wrapper{
  display:flex; align-items:center; gap:1rem; margin-bottom:1.5rem; padding-left:0rem; padding-right:2rem;
}
.archive-controls-wrapper .hp-form{ margin:0; }
#archive-page-title{ font-size:1.65rem; font-weight:100; margin:0; margin-right:auto; }

/* --- "Sort By" Dropdown Styling --- */
.archive-controls-wrapper .hp-form--listing-sort .hp-form__label{ display:none; }
.archive-controls-wrapper .select2-selection--single{
  background-color:#fff !important; border:1px solid #ccc !important; border-radius:999px !important;
  box-shadow:0 2px 6px rgba(0,0,0,.1) !important; height:auto !important;
}
.archive-controls-wrapper .select2-selection__rendered{
  font-size:1rem !important; font-weight:650 !important; line-height:1.2 !important; color:#333 !important;
  text-transform:none !important; letter-spacing:normal !important; padding:.5rem 2.5rem .5rem 1.5rem !important;
}
.archive-controls-wrapper .select2-selection__arrow{
  right:1.25rem !important; top:50% !important; transform:translateY(-50%); height:auto !important; width:auto !important;
}
.archive-controls-wrapper .select2-selection__arrow b{
  border-color:#333 transparent transparent transparent !important; border-width:5px 5px 0 5px !important;
}
.archive-controls-wrapper .hp-form--listing-sort select,
.archive-controls-wrapper .select2-container--default{
  width:auto !important; min-width:12rem !important;
}

/* --- Listing Grid & Card Styling --- */
.archive .hp-grid__item{ flex:0 0 33.333333%; max-width:33.333333%; }
.archive .hp-listing__content{
  margin-left:-1rem; margin-right:-1rem; padding-left:1.2rem; padding-right:1.2rem; margin-top:-1rem !important;
}
.archive .hp-listing__title a{
  font-size:1rem; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
}
.archive .listing-meta-row{ font-size:.9rem; color:#666; margin-top:-2px; }
@media (min-width:1024px){
  .archive .hp-listings .hp-row .hp-grid__item{
    margin-bottom:-1rem; margin-left:-1rem; margin-right:1rem;
  }
}

/* Tablet: 3-up */
@media (min-width:768px) and (max-width:1023.98px){
  .archive .hp-listings .hp-row{ display:flex !important; flex-wrap:wrap !important; }
  .archive .hp-grid__item{
    flex:0 0 33.3334% !important; max-width:33.3334% !important;
    padding-left:.5rem; padding-right:.5rem; margin:0 !important;
  }
  .archive .hp-listing__image{ aspect-ratio:4/3; overflow:hidden; border-radius:.75rem; }
}

/* Mobile: 2-up */
@media (max-width:767.98px){
  .archive .hp-listings .hp-row{ display:flex !important; flex-wrap:wrap !important; }
  .archive .hp-grid__item{ flex:0 0 50% !important; max-width:50% !important; padding-left:.5rem; padding-right:.5rem; }
  .archive .hp-listing__image{ aspect-ratio:4/3; overflow:hidden; border-radius:.75rem; }
  /* tighten vertical spacing between rows */
  .archive .hp-listings .hp-row .hp-grid__item{ margin-bottom:-1rem !important; }
}

/* --- Mobile & Tablet Page Flow --- */
@media (max-width: 1023px){
  .archive-controls-wrapper{
    order:1; display:flex; justify-content:center; margin-bottom:1.5rem;
    padding-left:1rem; padding-right:1rem; gap:.75rem;
  }
  #archive-page-title{ width:100%; text-align:center; }
  body.archive .hp-page__sidebar{ order:2; margin-top:1.5rem !important; margin-bottom:2rem !important; }
  body.archive .hp-page__content{ order:3; margin-bottom:2rem; }
  body.archive .hp-page__content,
  body.archive .hp-page__sidebar{ flex:0 0 100%; max-width:100%; padding-left:.25rem; padding-right:.25rem; }
  body.archive .hp-map{
    width:100%; max-width:100%; height:380px !important; margin:0 auto 1.25rem; border-radius:20px !important;
  }
  .archive-controls-wrapper #archive-page-title{ display:none !important; }
}

/* Mobile-only pull-up for archive title */
@media (max-width: 767.98px){ body.archive h2#archive-page-title{ margin-top:-20px !important; } }
@media (min-width: 768px){ body.archive h2#archive-page-title{ margin-top:0 !important; } }

/* --- Hide search bar on all archive pages (keeps homepage visible) --- */
.archive .hp-form--listing-search{ display:none !important; }

/* --- Filter Modal (Button, Overlay, Form) --- */
body form.hp-form--listing-filter { display:none; } /* hide original until activated */
.ff-filters-btn{
  background-color:#fff; color:#333; border:1px solid #ccc; border-radius:999px;
  padding:.5rem 1.5rem; font-size:1.1rem; line-height:1.2; cursor:pointer;
  box-shadow:0 2px 6px rgba(0,0,0,.1); display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
}
.ff-filters-icon{ width:1.2em; height:1.2em; object-fit:contain; }
body.filters-active #ff-filters-overlay{
  display:block; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9998;
}
.filters-active form.hp-form--listing-filter{
  display:block !important; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
  width:90%; max-width:400px; max-height:80vh; overflow-y:auto; background:#fff; padding:1rem; border-radius:.5rem;
  box-shadow:0 2px 8px rgba(0,0,0,.2); z-index:9999;
}

/* Match modal Filter button to “Filters” pill */
.hp-form--listing-filter .hp-form__footer .hp-form__button,
.hp-form--listing-filter .hp-form__footer button[type="submit"]{
  border:1px solid #ccc !important; border-radius:9999px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  padding:.5rem 1.5rem !important; line-height:1.3 !important; font-size:1.2rem !important; font-weight:500 !important;
  box-shadow:0 2px 6px rgba(0,0,0,.1) !important;
}
.hp-form--listing-filter .hp-form__footer .hp-form__button:hover{ box-shadow:0 4px 10px rgba(0,0,0,.12) !important; }
.hp-form--listing-filter .hp-form__footer .hp-form__button:active{ transform: translateY(0); }
.hp-form--listing-filter .hp-form__footer .hp-form__button[aria-disabled="true"],
.hp-form--listing-filter .hp-form__footer .hp-form__button.is-disabled,
.hp-form--listing-filter .hp-form__footer .hp-form__button.hp-disabled,
.hp-form--listing-filter .hp-form__footer .hp-form__button.ff-no-results{
  opacity:.55 !important; cursor:not-allowed !important; box-shadow:none !important;
}
/* Optional: Reset pill */
#ff-filters-reset{ border-radius:9999px; padding:10px 16px; }

/* Filters badge on the pill */
#ff-filters-toggle.ff-filters-btn{ position:relative; }
#ff-filters-toggle .ff-filters-badge{
  position:absolute; top:-6px; right:-6px; min-width:18px; height:18px; padding:0 6px; border-radius:9999px;
  background:#62afcb; color:#fff; font-size:11px; line-height:18px; display:none; align-items:center; justify-content:center;
  box-shadow:0 0 0 2px #fff; pointer-events:none;
}

/* Other Filters section → match accordion look */
.other-filters-container {
  margin: 16px 0 0 0;            /* space above */
  padding-top: 16px;             /* padding like accordions */
  border-top: 1px solid #e4e4e4; /* separator line */
}

.other-filters-container > div:first-child {
  font-weight: bold;   /* keep label strong like accordion headers */
  margin-bottom: 10px; /* spacing under label */
  display: flex;
  justify-content: space-between;
  align-items: center;
}




/* --- Sorting Info Tooltip --- */
.sort-info-tooltip-wrapper{ position:relative; display:inline-flex; align-items:center; }
.sort-info-button{
  width:25px; height:25px; border-radius:50%; border:1px solid #ccc; background-color:#ffffff; color:#555;
  font-size:12px; font-weight:bold; cursor:pointer; display:flex; align-items:center; justify-content:center;
  padding:0; line-height:1; transition: background-color .2s ease, border-color .2s ease;
}
.sort-info-button:hover{ background-color:#eee; border-color:#999; }
.sort-info-tooltip-text{
  visibility:hidden; opacity:0; width:280px; background-color:#333; color:#fff; text-align:left; border-radius:6px;
  padding:10px 15px; position:absolute; z-index:101; top:140%; left:50%; transform:translateX(-50%);
  transition:opacity .3s ease; box-shadow:0 4px 12px rgba(0,0,0,.2);
}
.sort-info-tooltip-text::after{
  content:""; position:absolute; bottom:100%; left:50%; margin-left:-5px; border-width:5px; border-style:solid;
  border-color:transparent transparent #333 transparent;
}
.sort-info-tooltip-wrapper:hover .sort-info-tooltip-text{ visibility:visible; opacity:1; }
.sort-info-tooltip-text p{ margin-top:0; margin-bottom:10px; font-size:15px; }
.sort-info-tooltip-text ul{ margin:0; padding-left:20px; font-size:14px; line-height:1.5; }
.sort-info-tooltip-text li{ margin-bottom:5px; }

/* Desktop polish for tooltip bubble */
.archive .sort-info-tooltip-wrapper .sort-info-tooltip-text{
  border-radius:12px !important; overflow:hidden; background-clip:padding-box; box-shadow:0 8px 20px rgba(0,0,0,.08);
}
.archive .sort-info-tooltip-wrapper .sort-info-tooltip-text::after{ background:inherit; border-radius:2px; }

/* Mobile adjustments for tooltip & controls */
@media (max-width: 767px){
  .archive-controls-wrapper{ gap:.5rem; }
  .sort-info-tooltip-wrapper{ margin-left:10px; }
  .sort-info-tooltip-text{ left:0; transform:none; }
  .sort-info-tooltip-text::after{ left:14px; transform:none; }
}

/* --- “No Results Found” Message --- */
.no-results-message{
  width:100%; text-align:center; padding:60px 20px; font-size:1.5rem; color:#555; background-color:#f9f9f9;
  border-radius:8px; margin-top:20px;
}

/* Tablet (768–1023px): keep sidebar/map in normal flow; hide floating wrapper if any */
@media (min-width:768px) and (max-width:1023px){
  body.archive .hp-page__sidebar{
    position:static !important; top:auto !important; bottom:auto !important; transform:none !important;
    margin-top:1.5rem !important; margin-bottom:2rem !important;
  }
  body.archive #map-container-live{ display:none !important; }
}







/* Force desktop Filter button styling on mobile */
@media (max-width: 767.98px){
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop{
    border: 1px solid #ccc !important;
    border-radius: 9999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: .5rem 1.5rem !important;
    line-height: 1.3 !important;
    font-size: 1.2rem !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.1) !important;
    background: #62afcb !important;
    color: #fff !important;
    min-width: 120px !important; /* keep your fixed width */
    white-space: nowrap !important;

    /* nuke the theme’s icon & mobile skin completely */
    background-image: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
    text-shadow: none !important;
  }

  /* Just in case the theme injects pseudo icons */
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop::before,
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop::after{
    content: none !important;
    display: none !important;
    background: none !important;
  }
}


/* === Mobile layout: side-by-side buttons, desktop-like Filter height === */
@media (max-width: 767.98px){
  /* Make footer a horizontal flex row */
  .hp-form--listing-filter .hp-form__footer{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    justify-content: space-between !important;
    align-items: stretch !important; /* equal heights */
  }

  /* Both buttons share row space evenly */
  .hp-form--listing-filter .hp-form__footer #ff-filters-reset,
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop {
    flex: 1 1 0% !important;
    max-width: 50% !important;
    min-width: 120px !important;
  }

  /* Match desktop button height and padding */
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop {
    padding: .6rem 1.5rem !important;
    min-height: 46px !important; /* keeps pill tall enough */
    line-height: 1.3 !important;
  }

  /* Make reset button visually balanced with filter button */
  #ff-filters-reset{
    padding: .6rem 1.5rem !important;
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}



@media (max-width: 767.98px){
  /* Remove rogue margins that can push buttons to new line */
  .hp-form--listing-filter .hp-form__footer #ff-filters-reset,
  .hp-form--listing-filter .hp-form__footer .ff-filter-desktop {
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Force both buttons to share row evenly without wrapping */
  .hp-form--listing-filter .hp-form__footer{
    flex-wrap: nowrap !important;
  }

  /* If something is still wrapping, force min-width 0 to allow flex shrink */
  .hp-form--listing-filter .hp-form__footer > *{
    min-width: 0 !important;
    flex: 1 1 0% !important;
  }
}





/* === Mobile: make Reset + Filter sit side-by-side, no wrapping === */
@media (max-width: 767.98px){
  /* Make the footer a single flex row */
  .hp-form--listing-filter .hp-form__footer{
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* Target the actual buttons (no reliance on custom class) */
  .hp-form--listing-filter .hp-form__footer #ff-filters-reset,
  .hp-form--listing-filter .hp-form__footer button[type="submit"]{
    /* kill theme block/100% rules that force stack */
    display: inline-flex !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;        /* allow flex shrink */
    margin: 0 !important;
    float: none !important;
    clear: none !important;
    box-sizing: border-box !important;

    /* split the row evenly */
    flex: 1 1 0% !important;

    /* consistent height */
    padding: .6rem 1.5rem !important;
    min-height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }

  /* Some themes put width on the class, not the element — nuke those too */
  .hp-form--listing-filter .hp-form__footer .hp-field--submit,
  .hp-form--listing-filter .hp-form__footer .button-primary,
  .hp-form--listing-filter .hp-form__footer .button{
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    float: none !important;
    display: inline-flex !important;
    box-sizing: border-box !important;
    flex: 1 1 0% !important;
  }

  /* If anything inside the footer (like wrappers) is expanding, allow shrink */
  .hp-form--listing-filter .hp-form__footer > *{
    min-width: 0 !important;
    flex: 1 1 0% !important;
  }
}




/* Keep Filter button solid #62afcb at all sizes (no theme gradients) */
.hp-form--listing-filter .hp-form__footer .hp-form__button,
.hp-form--listing-filter .hp-form__footer button[type="submit"]{
  background-color: #62afcb !important;
  background: #62afcb !important;      /* override shorthand gradients */
  background-image: none !important;    /* kill gradient overlays */
  -webkit-mask-image: none !important;  /* some themes use masks */
  mask-image: none !important;
  text-shadow: none !important;         /* remove lightening effect */
  border-color: #62afcb !important;     /* optional: match border to fill */
  color: #fff !important;
}

/* Keep the same solid color on hover/focus/active (desktop skin often lightens here) */
.hp-form--listing-filter .hp-form__footer .hp-form__button:hover,
.hp-form--listing-filter .hp-form__footer .hp-form__button:focus,
.hp-form--listing-filter .hp-form__footer .hp-form__button:active,
.hp-form--listing-filter .hp-form__footer button[type="submit"]:hover,
.hp-form--listing-filter .hp-form__footer button[type="submit"]:focus,
.hp-form--listing-filter .hp-form__footer button[type="submit"]:active{
  background-color: #62afcb !important;
  background: #62afcb !important;
  background-image: none !important;
  text-shadow: none !important;
  border-color: #62afcb !important;
  color: #fff !important;
}

/* Force archive page titles to match desktop size everywhere */
body.archive h1,
body.archive h2 {
  font-weight: 800 !important;
  color: #444444 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.18 !important;
  font-size: clamp(2rem, 2.2vw + 1rem, 2.3rem) !important;
  margin-bottom: .4rem !important;
  text-wrap: balance;
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: anywhere;
}

