/* ==========================================================================
   Global Layout & Foundational Styles (moved from Additional CSS)
   ========================================================================== */

/* --- Site-Wide Sticky Header --- */
.site-container { overflow: visible !important; }
.site-header {
  position: sticky; top: 0; z-index: 1000; background-color: #ffffff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
}

/* Base cap + comfy gutters (keeps your homepage look) */
@media (min-width:1024px){
  .hp-container,
  .hp-container--fluid,
  .container,
  .container-fluid {
    max-width: 1440px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 3rem !important;   /* homepage/ILP comfy gutters */
    padding-right: 3rem !important;
    box-sizing: border-box;          /* keep padding inside the cap */
  }
}

/* Narrower gutters on archive/search/category templates only */
@media (min-width:1024px){
  /* WordPress generic archives */
  body.archive .hp-container,
  body.archive .hp-container--fluid,
  body.archive .container,
  body.archive .container-fluid,
  body.search-results .hp-container,
  body.search-results .hp-container--fluid,
  body.search-results .container,
  body.search-results .container-fluid,

  /* ListingHive template classes (category/search/archives) */
  .hp-template--listing-archive-page .hp-container,
  .hp-template--listing-archive-page .hp-container--fluid,
  .hp-template--listing-archive-page .container,
  .hp-template--listing-archive-page .container-fluid,
  .hp-template--listing-search-page .hp-container,
  .hp-template--listing-search-page .hp-container--fluid,
  .hp-template--listing-search-page .container,
  .hp-template--listing-search-page .container-fluid,
  .hp-template--listing-category-page .hp-container,
  .hp-template--listing-category-page .hp-container--fluid,
  .hp-template--listing-category-page .container,
  .hp-template--listing-category-page .container-fluid {
    max-width: 1440px !important;      /* enforce the cap here too */
    padding-left: 1.25rem !important;  /* tighter gutters only on archives */
    padding-right: 1.25rem !important;
  }
}



/* Keep Gutenberg heading tweak */
h2.wp-block-heading.has-text-align-center.content-title::before {
  background-color: #0000 !important;
}

/* ==========================================================================
   Header (global)
   ========================================================================== */
.header-navbar { max-height: 50px; }
.hp-menu--site-header .hp-menu__item--listing-submit,
.hp-menu__item.hp-menu__item--user-login.hp-link { display: none; }

/* Mobile Header: Fix Site Title Wrap */
@media (max-width: 767px) {
  .header-navbar { min-height: 75px !important; }
  .header-navbar .inner { display: flex; align-items: center; }
}

/* === SCFF: Taller header bar, centered === */
.site-header .header-navbar{
  max-height: none !important;
  min-height: 74px; padding-top: 12px; padding-bottom: 0; /* keep dropdowns flush */
  align-items: center !important;
}
.site-header .header-navbar__start,
.site-header .header-navbar__end{
  display: flex; align-items: center; gap: 12px;
}
@media (max-width: 768px){
  .site-header .header-navbar{ min-height: 70px; padding-top: 10px; }
}

/* Force header menu visible/unclipped on desktop (≥1200px) */



@media (min-width:1200px){
  .header-navbar__menu { display: block !important; }
  .header-navbar__menu ul, #menu-main-menu { overflow: visible !important; }
}




/* Desktop only */
@media (min-width:1200px){

  .header-navbar__menu{ display:block !important; }
  .header-navbar__menu ul, #menu-main-menu{ overflow:visible !important; }

  /* position anchors for absolute submenus */
  .header-navbar__menu > ul > li{ position:relative; }
  .header-navbar__menu .sub-menu li{ position:relative; }

  /* SUBMENUS: always present, but visually hidden by default */
  .header-navbar__menu ul.sub-menu{
    display:block !important;            /* never toggle display */
    position:absolute;
    top:100%; left:0; right:auto;        /* base position */
    min-width:220px;
    z-index:10000;

    /* visual hide (animatable) */
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(8px);

    /* the animation */
    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility 0s linear .18s;
  }

  /* OPEN state (first level) */
  .header-navbar__menu li.menu-item-has-children:hover > ul.sub-menu,
  .header-navbar__menu li.menu-item-has-children:focus-within > ul.sub-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
    left:0 !important; right:auto !important;

    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility 0s;
  }

  /* FLYOUTS (submenu of a submenu) — LOCKED RIGHT, stable (desktop only) */
  .header-navbar__menu .sub-menu li{ position:relative; }

  /* default (hidden) state lives to the RIGHT, with slight overlap to reduce gaps */
  .header-navbar__menu .sub-menu li > ul.sub-menu{
    top:0;
    left:100% !important;          /* always open right */
    right:auto !important;
    transform:translateX(8px);     /* small slide-in */
    margin-left:-1px;              /* tiny overlap with parent panel to avoid hover gap */
  }

  /* reveal on hover/focus — still to the RIGHT */
  .header-navbar__menu .sub-menu li:hover > ul.sub-menu,
  .header-navbar__menu .sub-menu li:focus-within > ul.sub-menu{
    opacity:1; visibility:visible; pointer-events:auto; transform:none;
    left:100% !important; right:auto !important;
    transition: opacity .18s ease, transform .18s ease, visibility 0s;
  }

  /* neutralize any attempt to flip direction */
  .header-navbar__menu .sub-menu li > ul.sub-menu.left{ left:100% !important; right:auto !important; }
  .header-navbar__menu .sub-menu li:hover > ul.sub-menu.left,
  .header-navbar__menu .sub-menu li:focus-within > ul.sub-menu.left{
    left:100% !important; right:auto !important;
  }
}


/* accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce) and (min-width:1200px){
  .header-navbar__menu ul.sub-menu{
    transition:none !important;
    transform:none !important;
  }
}

/* Kill the theme's slide tween on the submenu UL itself */
@media (min-width:1200px){
  .header-navbar__menu ul.sub-menu{
    height: auto !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    overflow: visible !important;
    animation: none !important;
    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility 0s linear .18s !important; /* no height/padding transitions */
  }
}


@media (min-width:1200px){

  /* --- FOOLPROOF CATCH ZONES ----------------------------------------- */
  /* First-level dropdowns: create a generous corridor between the parent
     trigger and the panel, plus top/bottom gutters to forgive diagonals. */
  .header-navbar__menu > ul > li.menu-item-has-children > ul.sub-menu{
    /* keep your existing positioning/transition */
  }
  .header-navbar__menu > ul > li.menu-item-has-children > ul.sub-menu::before{
    content:"";
    position:absolute;
    /* extend TOWARD the trigger (to the left of the panel) */
    left:-28px;                /* corridor width toward trigger */
    width:28px;
    /* add top/bottom gutters so diagonal moves don't exit */
    top:-14px;                 /* extend above the panel */
    bottom:-14px;              /* extend below the panel */
    pointer-events:auto;       /* make it count as hover on the submenu */
    background:transparent;    /* invisible */
  }

  /* Second-level fly-outs: widen the corridor between the parent item and fly-out */
  .header-navbar__menu .sub-menu > li.menu-item-has-children > ul.sub-menu{
    margin-left:-8px;          /* small overlap you already use (increase a bit) */
    transform:translateX(6px); /* slightly smaller slide than 8px so positions still line up */
  }
  .header-navbar__menu .sub-menu > li.menu-item-has-children > ul.sub-menu::before{
    content:"";
    position:absolute;
    left:-24px;                /* corridor back toward the parent item */
    width:24px;
    top:-12px;
    bottom:-12px;
    pointer-events:auto;
    background:transparent;
  }

  /* Optional: tiny overshoot buffer on the far edge so racing past the panel
     doesn’t instantly close while you correct course */
  .header-navbar__menu ul.sub-menu::after{
    content:"";
    position:absolute;
    right:-12px;               /* overshoot area to the RIGHT */
    width:12px;
    top:-12px;
    bottom:-12px;
    pointer-events:auto;
    background:transparent;
  }

  /* Slightly longer hide delay to feel forgiving without feeling “sticky” */
  .header-navbar__menu ul.sub-menu{
    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility 0s linear .26s;   /* was .18s; bump to .26s */
  }

  /* Keep parent open while hovering the submenu or any of its corridors */
  @supports selector(:has(*)) {
    .header-navbar__menu li.menu-item-has-children:has(> ul.sub-menu:hover) > ul.sub-menu,
    .header-navbar__menu .sub-menu li.menu-item-has-children:has(> ul.sub-menu:hover) > ul.sub-menu{
      opacity:1; visibility:visible; pointer-events:auto; transform:none;
      transition: opacity .18s ease, transform .18s ease, visibility 0s;
    }
  }

  /* Bridges under/along triggers (kept from earlier advice, but made bigger) */
  .header-navbar__menu > ul > li.menu-item-has-children > a,
  .header-navbar__menu .sub-menu > li.menu-item-has-children > a{ position:relative; }
  .header-navbar__menu > ul > li.menu-item-has-children > a::after{
    content:""; position:absolute; left:0; right:0; bottom:-14px; height:16px; pointer-events:auto;
  }
  .header-navbar__menu .sub-menu > li.menu-item-has-children > a::after{
    content:""; position:absolute; top:0; right:-16px; width:18px; height:100%; pointer-events:auto;
  }
}





/* ==========================================================================
   Branding (Logo) — use PNG wordmark instead of header text
   ========================================================================== */
.site-header .site-title,
.site-header .site-title a,
.site-header .site-description {
  position: absolute !important; clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap;
}
.site-header .site-branding { display: flex; align-items: center; }
.site-header .custom-logo-link { display: block; line-height: 1; }
.site-header .custom-logo {
  height: 55px; width: auto !important; max-width: none; display: block;
}
@media (max-width: 1024px) { .site-header .custom-logo { height: 58px; } }
@media (max-width: 782px)  { .site-header .custom-logo { height: 52px; } }

/* SCFF: hide text when logo set and normalize sizes */
body.wp-custom-logo .header-logo__name{ display: none !important; }
.site-header .custom-logo-link{ display: inline-flex; align-items: center; line-height: 1; }
.site-header .custom-logo{ height: 48px !important; width: auto !important; display: block; max-height: none; }

/* ==========================================================================
   Search Form (global base + mobile tweak; archive hides it later)
   ========================================================================== */
.hp-form--listing-search{
  display: flex; align-items: center; gap: .5rem; background:#fff; padding:.5rem 1rem;
  border-radius: 3rem; box-shadow: 0 3px 4px rgba(0,0,0,.1);
}
.hp-form--listing-search .hp-form__field.hp-form__field--search { border-right: none; }
.hp-form__field--location { display: none; }
.hp-form--listing-search .hp-form__footer .hp-form__button{
  background:#62afcb; color:#fff; border-radius:1.5rem; padding:.75rem 1.5rem; border:none; font-size:1rem;
}
@media (max-width: 767px){
  .hp-form--listing-search{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    gap:.5rem !important;
    padding:0 1rem !important;
    width:100% !important;
    box-sizing:border-box !important;
    align-items:center !important;
  }
  .hp-form--listing-search .hp-form__field.hp-form__field--search{
    background-color:#fff !important;
    border:none !important;
    box-shadow:none !important;
    overflow:hidden !important;
    margin-top:.25rem !important;
  }
  input.hp-field.hp-field--search::-webkit-input-placeholder{ color:transparent !important; }
  .hp-form__footer .hp-form__button{
    width:2.2rem !important; height:2.2rem !important;
    border:none !important; border-radius:50% !important; padding:0 !important;
    background-color:#61AFCB !important;
    background-image:url("https://plum-dove-368119.hostingersite.com/wp-content/uploads/2025/07/icons8-search-50.png") !important;
    background-repeat:no-repeat !important; background-position:center !important; background-size:1.2rem 1.2rem !important;
    font-size:0 !important;
  }
}


/* Autocomplete suggestions */
.autocomplete-suggestions{
  display:none; position:relative; background:#fff; border-radius:.8rem;
  box-shadow:0 4px 12px rgba(0,0,0,.1); z-index:1000; margin:8px 0 0; padding:.5rem 0;
  list-style-type:none; overflow:hidden;
}
.autocomplete-suggestions li{ margin:0; padding:0; cursor:pointer; transition:background-color .2s ease; }
.autocomplete-suggestions li:not(:last-child){ border-bottom:1px solid #f0f0f0; }
.autocomplete-suggestions a{ display:block; padding:.75rem 1.25rem; color:#333; text-decoration:none; font-size:1rem; }
.autocomplete-suggestions li:hover{ background-color:#f7f7f7; }

/* ==========================================================================
   Universal Listing Card & Meta styles (used in multiple contexts)
   ========================================================================== */
.hp-listing{ display:flex; flex-direction:column; transition:transform .2s ease, box-shadow .2s ease; }
.hp-listing:hover{ transform:translateY(-4px); box-shadow:0 4px 12px rgba(0,0,0,.12); }
[class*="hp-listing"]{ border:none !important; box-shadow:none !important; }

.hp-listing__image{ position:relative; border-radius:.75rem; overflow:hidden; }

.listing-meta-row{
  display:grid; grid-template-columns:1fr auto; align-items:center; width:100%;
}
.listing-meta-row .listing-city-bottom{
  font-size:.975rem; font-weight:300; color:#555555; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.listing-meta-row .listing-rating-bottom{
  font-size:.875rem; font-weight:300; color:#333333; display:flex; align-items:center; white-space:nowrap;
}
.listing-meta-row .listing-rating-bottom i{ font-size:.8rem; color:#61AFCB; margin-right:.25rem; }
.listing-meta-row .listing-city-bottom{ min-width:0; }
.listing-meta-row .listing-rating-bottom .ilp-total-ratings{ margin-left:3px; }

/* City links inherit color */
.listing-city-bottom .listing-city-link{ color:inherit; text-decoration:none; position:relative; transition:color .3s ease; }
.listing-city-bottom .listing-city-link:hover{ color:#030303; }
.listing-city-bottom .listing-city-link:hover::after{ transform: scaleX(1); }

/* ==========================================================================
   Global UI rounding for dropdown panels (desktop only)
   ========================================================================== */
.site-header .header-navbar__end { position: relative; }
.site-header .header-navbar__end .menu > li { position: relative; }

@media (min-width: 1024px) and (hover:hover) and (pointer:fine){
  .site-header .menu .sub-menu{ border-radius:12px; overflow:hidden; }
  .hp-popover, .hp-dropdown, .hp-dropdown .hp-dropdown__menu{ border-radius:12px; overflow:hidden; }
  .select2-container .select2-dropdown{ border-radius:12px !important; overflow:hidden; }
  .site-header .menu .sub-menu,
  .hp-popover, .hp-dropdown .hp-dropdown__menu, .select2-container .select2-dropdown{
    box-shadow:0 8px 20px rgba(0,0,0,0.08);
  }
}

/* Autocomplete layout + visuals */
.autocomplete-suggestions { margin:.5rem 0 0; padding:0; list-style:none; display:none; }
.autocomplete-suggestions li { padding:.6rem .8rem; }
.autocomplete-suggestions li a.ac-item { 
  display:flex; 
  align-items:center; 
  gap:.75rem; 
  text-decoration:none; 
}
.autocomplete-suggestions li a.ac-item{
  display:flex;
  align-items:baseline; /* nicer baseline alignment */
  gap:.5rem;            /* small space between title and meta */
}

.autocomplete-suggestions .ac-title{
  min-width:0;               /* enables ellipsis in flex */
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.autocomplete-suggestions li.is-category .ac-meta{
  font-size:.9em;
  font-style:italic;
  white-space:nowrap;        /* keep on one line */
  opacity:.8;
}

.autocomplete-suggestions .ac-title {
  font-weight:600;
  min-width:0; 
  overflow:hidden; 
  text-overflow:ellipsis; 
  white-space:nowrap;
}
.autocomplete-suggestions li.is-category .ac-meta {
  font-size:.9em; 
  font-style:italic; 
  opacity:.8; 
  flex:0 0 auto;    /* keep it to the right */
}
.autocomplete-suggestions li:hover { background: rgba(0,0,0,.04); }

/* inline "(see more)" next to price — match price color, no underline */
.ilp-price-line .ilp-see-more a{
  margin-left:.25rem;
  font-size:.9em;
  color: #000000;      /* inherit the price text color */
  text-decoration: none;    /* no underline */
  font-weight: 400;
}
.ilp-price-line .ilp-see-more a:hover,
.ilp-price-line .ilp-see-more a:focus{
  text-decoration: underline;   
}

/* optional: make sure header jump leaves room under sticky header */
.single-hp_listing .ilp-pricing{ scroll-margin-top: 90px; }

/* Kill the pricing fade when expanded */
.single-hp_listing .ilp-pricing.is-open.expanded .ilp-card__body::after {
  opacity: 0;
  display: none !important;
  height: 0 !important;
}

/* Also hide any explicit fade element if the theme uses one */
.single-hp_listing .ilp-pricing.is-open.expanded .ilp-card__fade,
.single-hp_listing .ilp-pricing.is-open.expanded .hp-card__fade {
  display: none !important;
}

/* Extra-robust: tie it to the button’s state too */
.single-hp_listing .ilp-pricing:has(#ilp-show-more-btn[aria-expanded="true"]) .ilp-card__body::after {
  opacity: 0;
  display: none !important;
  height: 0 !important;
}

/* On phones, show only "more" */
@media (max-width: 767px){
  .ilp-price-line .ilp-see-more a .ilp-see-prefix{
    display: none !important;
  }
}

/* ===== Claim Business page (ID 5395) ===== */


/* Tighten the header/banner space on just this page */
body.page-id-5395 .header-hero,
body.page-id-5395 .page-header,
body.page-id-5395 .entry-header {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  margin-bottom: 10px !important;
}

/* Trim page title margins if theme adds extra space */
body.page-id-5395 .entry-title,
body.page-id-5395 .page-title {
  margin: 0 !important;
}

/* Stronger rounding for all Forminator fields on Claim Business page */
body.page-id-5395 .forminator-ui input[type="text"],
body.page-id-5395 .forminator-ui input[type="email"],
body.page-id-5395 .forminator-ui input[type="tel"],
body.page-id-5395 .forminator-ui input[type="url"],
body.page-id-5395 .forminator-ui input[type="number"],
body.page-id-5395 .forminator-ui .forminator-input,
body.page-id-5395 .forminator-ui .forminator-input--wrap .forminator-input,
body.page-id-5395 .forminator-ui textarea.forminator-textarea,
body.page-id-5395 .forminator-ui .forminator-textarea,
body.page-id-5395 .forminator-ui .forminator-select .select2-selection--single,
body.page-id-5395 .forminator-ui .forminator-select .select2-selection--multiple,
body.page-id-5395 .forminator-ui .forminator-select-dropdown {
  border-radius: 12px !important;
  border: 1px solid #e6edf0;
}

/* Keep the brand focus ring */
body.page-id-5395 .forminator-ui input:focus,
body.page-id-5395 .forminator-ui textarea:focus,
body.page-id-5395 .forminator-ui select:focus,
body.page-id-5395 .forminator-ui .select2-selection--single:focus,
body.page-id-5395 .forminator-ui .select2-selection--multiple:focus {
  border-color: #2aa6c6 !important;
  box-shadow: 0 0 0 3px rgba(42,166,198,.15) !important;
  outline: none;
}

/* Rounded submit button (pill) */
body.page-id-5395 .forminator-ui .forminator-button {
  border-radius: 999px !important;
}

/* Stop horizontal wiggle site-wide (keep vertical behavior intact) */
html, body { overflow-x: clip; }          /* modern & safer than hidden */
.site-container { overflow-x: clip; overflow-y: visible; }  /* keep sticky header working */


/* ===== Suggest an Edit page (ID 5399) ===== */
body.page-id-5399 .forminator-ui input[type="text"],
body.page-id-5399 .forminator-ui input[type="email"],
body.page-id-5399 .forminator-ui input[type="tel"],
body.page-id-5399 .forminator-ui input[type="url"],
body.page-id-5399 .forminator-ui input[type="number"],
body.page-id-5399 .forminator-ui .forminator-input,
body.page-id-5399 .forminator-ui .forminator-input--wrap .forminator-input,
body.page-id-5399 .forminator-ui textarea.forminator-textarea,
body.page-id-5399 .forminator-ui .forminator-textarea,
body.page-id-5399 .forminator-ui .forminator-select .select2-selection--single,
body.page-id-5399 .forminator-ui .forminator-select .select2-selection--multiple,
body.page-id-5399 .forminator-ui .forminator-select-dropdown{
  border-radius: 12px !important;
  border: 1px solid #e6edf0;
}

body.page-id-5399 .forminator-ui input:focus,
body.page-id-5399 .forminator-ui textarea:focus,
body.page-id-5399 .forminator-ui select:focus,
body.page-id-5399 .forminator-ui .select2-selection--single:focus,
body.page-id-5399 .forminator-ui .select2-selection--multiple:focus{
  border-color: #2aa6c6 !important;
  box-shadow: 0 0 0 3px rgba(42,166,198,.15) !important;
  outline: none;
}

/* Rounded submit button (pill) */
body.page-id-5399 .forminator-ui .forminator-button{
  border-radius: 999px !important;
}

/* Tighten the header/banner space on this page only */
body.page-id-5399 .header-hero,
body.page-id-5399 .page-header,
body.page-id-5399 .entry-header{
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  margin-bottom: 16px !important;
}

/* Trim page title margins if theme adds extra space */
body.page-id-5399 .entry-title,
body.page-id-5399 .page-title{
  margin: 0 !important;
}

.hp-listing__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;  /* or 16/9, whichever matches your design */
}

  body.home .site-content { padding-top: 2.5rem !important; }

