/* =========================================================
   POPANDSMOKES — SMART SEARCH V1.3.1 SETTINGS INTEGRATION
   Fixes desktop result structure, spacing, price formatting
   display, and premium horizontal product result cards
========================================================= */

.pns-smart-search {
  position: relative;
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  z-index: 999;
  font-family: inherit;
}

.pns-smart-search,
.pns-smart-search * {
  box-sizing: border-box;
}

.pns-smart-search__form {
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 58px;
  border: 3px solid #0073bd;
  border-radius: 14px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 14px 35px rgba(0, 103, 178, 0.12);
}

.pns-smart-search__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border: 0 !important;
  outline: 0 !important;
  padding: 0 18px !important;
  font-size: 20px;
  font-weight: 700;
  line-height: 1 !important;
  color: #08243f;
  background: #ffffff;
  box-shadow: none !important;
}

.pns-smart-search__input::placeholder {
  color: rgba(8, 36, 63, 0.42);
  font-weight: 600;
}

.pns-smart-search__clear {
  flex: 0 0 48px;
  width: 48px;
  height: 100%;
  border: 0 !important;
  background: #ffffff !important;
  color: #2d5f9d !important;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  padding: 0 !important;
}

.pns-smart-search__clear[hidden] {
  display: none !important;
}

.pns-smart-search__button {
  flex: 0 0 78px;
  width: 78px;
  height: 100%;
  border: 0 !important;
  background: linear-gradient(135deg, #168cff 0%, #0067b2 100%) !important;
  color: #ffffff !important;
  cursor: pointer;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pns-smart-search__icon {
  display: block;
  fill: currentColor;
}

.pns-smart-search__panel {
  position: absolute;
  top: calc(100% + 14px);
  left: 0;
  right: 0;
  width: 100%;
  max-height: 612px;
  overflow-y: auto;
  overflow-x: hidden;
  background: linear-gradient(145deg, #06233f 0%, #031426 55%, #020b15 100%);
  border: 1px solid rgba(22, 140, 255, 0.35);
  border-radius: 14px;
  box-shadow: 0 24px 65px rgba(0, 103, 178, 0.28);
  padding: 14px;
}

.pns-smart-search__panel[hidden] {
  display: none !important;
}

.pns-smart-search__status {
  color: rgba(255, 255, 255, 0.76);
  padding: 14px;
  font-weight: 700;
  text-align: center;
}

.pns-smart-search__results {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pns-smart-search__item {
  display: grid !important;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-height: 92px;
  padding: 12px;
  border-radius: 12px;
  text-decoration: none !important;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.045);
  margin: 0;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.pns-smart-search__item:hover,
.pns-smart-search__item:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(22, 140, 255, 0.58);
  background: rgba(22, 140, 255, 0.12);
  outline: none;
}

.pns-smart-search__thumb {
  width: 76px;
  height: 76px;
  min-width: 76px;
  border-radius: 12px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
}

.pns-smart-search__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.pns-smart-search__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0;
  width: 100%;
}

.pns-smart-search__title {
  display: block;
  width: 100%;
  color: #ffffff;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.18;
  margin: 0 0 5px;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.pns-smart-search__row {
  display: flex;
  width: 100%;
  min-width: 0;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
}

.pns-smart-search__meta {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: none;
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 5px;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.pns-smart-search__price {
  display: block;
  width: 100%;
  flex: none;
  min-width: 0;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  color: #168cff;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.2;
  white-space: normal;
  text-align: left;
}

.pns-smart-search__view-all {
  display: block;
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(135deg, #168cff 0%, #0067b2 100%);
  color: #ffffff !important;
  text-align: center;
  text-decoration: none !important;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.2;
}

.pns-smart-search__view-all[hidden] {
  display: none !important;
}

@media (max-width: 768px) {
  .pns-smart-search {
    max-width: calc(100vw - 48px);
  }

  .pns-smart-search__form {
    height: 56px;
  }

  .pns-smart-search__input {
    font-size: 16px;
    padding: 0 14px !important;
  }

  .pns-smart-search__button {
    flex-basis: 58px;
    width: 58px;
  }

  .pns-smart-search__panel {
    position: fixed;
    top: 155px;
    left: 18px;
    right: 18px;
    width: auto;
    max-height: calc(100vh - 190px);
    overflow-y: auto;
  }
}


/* V1.2.0 Desktop Layout Stack Fix */
.pns-smart-search__content{gap:4px;}
.pns-smart-search__title{white-space:normal;overflow:visible;text-overflow:unset;margin:0;}
.pns-smart-search__row{display:none!important;}
.pns-smart-search__meta{display:block!important;width:100%!important;max-width:none!important;color:rgba(255,255,255,.70);}
.pns-smart-search__price{display:block!important;width:100%!important;max-width:none!important;color:#168cff;font-size:16px;font-weight:900;}

.pns-smart-search__content{gap:4px}
.pns-smart-search__title{white-space:normal;overflow:visible;text-overflow:unset;margin:0}
.pns-smart-search__meta,.pns-smart-search__brandtag,.pns-smart-search__price{width:100%;text-align:left;max-width:none}
.pns-smart-search__brandtag{color:#8ebce8;font-size:12px;font-weight:700;line-height:1.25}
.pns-smart-search__price{align-self:flex-start}

/* =========================================================
   POPANDSMOKES SMART SEARCH V1.4.1 — MOBILE UX RELEASE
   Mobile-only interaction fixes. Desktop search remains untouched.
========================================================= */

@media (max-width: 768px) {
  body.pns-smart-search-mobile-open,
  html.pns-smart-search-mobile-open {
    overflow: hidden !important;
    touch-action: none;
  }

  .pns-smart-search.pns-smart-search--mobile-active {
    z-index: 999999;
  }

  .pns-smart-search .pns-smart-search__panel {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    width: 100%;
    max-height: min(68dvh, calc(100dvh - 150px), 560px);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 12px 12px calc(44px + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(44px + env(safe-area-inset-bottom));
  }

  .pns-smart-search .pns-smart-search__view-all {
    margin-bottom: calc(18px + env(safe-area-inset-bottom));
  }

  .pns-smart-search .pns-smart-search__form {
    position: relative;
    z-index: 2;
  }
}


/* =========================================================
   POPANDSMOKES SMART SEARCH V1.4.1 — MOBILE BOTTOM FIX
   Adds bottom safe area so View All Results is fully reachable.
========================================================= */


/* =========================================================
   POPANDSMOKES SMART SEARCH V1.4.2 — MOBILE SCROLL + CLEAR FIX
   Built from v1.4.1. Keeps mobile results below search, preserves
   internal result scrolling, allows page scroll after results bottom,
   and removes the native browser search clear button.
========================================================= */

.pns-smart-search__input::-webkit-search-decoration,
.pns-smart-search__input::-webkit-search-cancel-button,
.pns-smart-search__input::-webkit-search-results-button,
.pns-smart-search__input::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

.pns-smart-search__input[type="search"] {
  -webkit-appearance: none;
  appearance: none;
}

@media (max-width: 768px) {
  body.pns-smart-search-mobile-at-bottom,
  html.pns-smart-search-mobile-at-bottom {
    overflow: auto !important;
    touch-action: auto !important;
  }

  .pns-smart-search .pns-smart-search__panel {
    overscroll-behavior-y: auto;
    padding-bottom: calc(20px + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(20px + env(safe-area-inset-bottom));
  }

  .pns-smart-search .pns-smart-search__view-all {
    margin-bottom: calc(8px + env(safe-area-inset-bottom));
  }
}

/* =========================================================
   POPANDSMOKES SMART SEARCH V1.4.4 - MOBILE NATURAL FLOW FIX
   Removes the fixed-height internal mobile panel that caused
   blank space under the View All button. Mobile results now
   sit below the search bar and scroll with the page naturally.
========================================================= */

@media (max-width: 768px) {
  body.pns-smart-search-mobile-open,
  html.pns-smart-search-mobile-open,
  body.pns-smart-search-mobile-at-bottom,
  html.pns-smart-search-mobile-at-bottom {
    overflow: auto !important;
    touch-action: auto !important;
  }

  .pns-smart-search.pns-smart-search--mobile-active {
    z-index: 50;
  }

  .pns-smart-search .pns-smart-search__panel {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    margin-top: 10px !important;
    padding: 12px !important;
    scroll-padding-bottom: 0 !important;
  }

  .pns-smart-search .pns-smart-search__view-all {
    margin-bottom: 0 !important;
  }
}


/* =========================================================
   POPANDSMOKES SMART SEARCH V1.4.5 - MOBILE OVERLAY FLOW
   Restores the mobile results as an overlay under the search bar,
   keeps the panel internally scrollable, and lets page scrolling
   continue naturally once the results panel reaches the bottom.
========================================================= */

@media (max-width: 768px) {
  body.pns-smart-search-mobile-open,
  html.pns-smart-search-mobile-open,
  body.pns-smart-search-mobile-at-bottom,
  html.pns-smart-search-mobile-at-bottom {
    overflow: auto !important;
    touch-action: auto !important;
  }

  .pns-smart-search.pns-smart-search--mobile-active {
    z-index: 999999 !important;
  }

  .pns-smart-search .pns-smart-search__form {
    position: relative !important;
    z-index: 2 !important;
  }

  .pns-smart-search .pns-smart-search__panel {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: min(70dvh, calc(100dvh - 170px), 560px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: auto !important;
    margin-top: 0 !important;
    padding: 12px !important;
    scroll-padding-bottom: 0 !important;
  }

  .pns-smart-search .pns-smart-search__view-all {
    margin: 12px 0 0 !important;
  }
}
