
.mapboxgl-popup.asm-popup .asm-popup__links a.asm-popup__link{
  -webkit-tap-highlight-color: transparent !important;
}

.mapboxgl-popup.asm-popup .asm-popup__links a.asm-popup__link:focus,
.mapboxgl-popup.asm-popup .asm-popup__links a.asm-popup__link:focus-visible,
.mapboxgl-popup.asm-popup .asm-popup__links a.asm-popup__link:active{
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
}

.mapboxgl-popup.asm-popup .asm-popup__links:focus-within{
  outline: none !important;
  box-shadow: none !important;
}



/* =========================================
   UBER / LYFT — MOBILE ONLY (CARDS + POPUPS)
   ========================================= */

/* Default: hide everywhere */
.asm-ride-icons,
.mapboxgl-popup.asm-popup .asm-popup__ride{
  display: none !important;
}

/* Mobile: show both */
@media (max-width: 767px){
  .asm-ride-icons,
  .mapboxgl-popup.asm-popup .asm-popup__ride{
    display: flex !important;
  }
}



/* =========================================
   POPUP: place ride icons ABOVE store links
   (no overlap, no absolute positioning)
   ========================================= */

.mapboxgl-popup.asm-popup .asm-popup__right{
  display: flex;
  flex-direction: column;
}

/* Make sure ride row is NOT absolute/overlay */
.mapboxgl-popup.asm-popup .asm-popup__ride{
  position: static !important;
  display: flex;
  justify-content: flex-end;   /* align right */
  gap: 10px;
  margin-top: 6px;
  margin-bottom: 6px;
  order: 40;                   /* between meta + links */
}

/* Links row below ride icons */
.mapboxgl-popup.asm-popup .asm-popup__links{
  order: 50;
}

/* Shop button stays below links */
.mapboxgl-popup.asm-popup .asm-popup__btn{
	text-align:center;
  order: 60;
}

/* Other locations stays after button */
.mapboxgl-popup.asm-popup .asm-popup__other{
  order: 70;
}

/* icon sizing */
.mapboxgl-popup.asm-popup .asm-popup__ridebtn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  text-decoration: none;
}

.mapboxgl-popup.asm-popup .asm-popup__ridebtn img{
  max-width: 35px;
  max-height: 35px;
  width: auto;
  height: auto;
  display: block;
}



@media (max-width: 767px){
  .mapboxgl-popup.asm-popup{
    transform: translateX(18px) !important; /* tweak */
	}
}


/* When loader is gone, filters show normally */

/* Default: hide filters until JS says we're ready */
[data-asm] [data-asm-filters]{
  display: none !important;
}

/* Show once the app is ready */
[data-asm].asm-ready [data-asm-filters]{
  display: flex !important; /* or block, whatever your layout expects */
}


/* =========================================
   POPUP: stop "Store Details" looking focused
   but keep accessible keyboard focus
   ========================================= */

.mapboxgl-popup.asm-popup .asm-popup__detail-link:focus{
  outline: none !important;
  box-shadow: none !important;
}

/* Only show a focus ring for keyboard users */
.mapboxgl-popup.asm-popup .asm-popup__detail-link:focus-visible{
  outline: 2px solid rgba(14,36,83,.55) !important;
  outline-offset: 2px !important;
  border-radius: 10px;
}

/* 1️⃣ Kill ALL focus styles inside Mapbox popups */
.mapboxgl-popup.asm-popup a:focus,
.mapboxgl-popup.asm-popup a:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

/* 2️⃣ Re-add focus ring ONLY for keyboard navigation */
@supports selector(:focus-visible) {
  .mapboxgl-popup.asm-popup a:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
  }

  .mapboxgl-popup.asm-popup a:focus-visible {
    outline: 2px solid rgba(14,36,83,.55) !important;
    outline-offset: 3px !important;
    border-radius: 10px;
  }
}

/* Multi-select dropdown */
.asm-ms { position: relative; width: 100%; }
.asm-ms__btn{
  width:100%;
  border:1px solid rgba(0,0,0,.25);
  border-radius:10px;
  padding:10px 12px;
  background:#fff;
  text-align:left;
  display:flex;
  justify-content:space-between;
  align-items:center;
  cursor:pointer;
}
.asm-ms__btn:after{
  content:"▾";
  opacity:.7;
  margin-left:10px;
}
.asm-ms__panel{
  position:absolute;
  z-index:9999;
  left:0; right:0;
  margin-top:6px;
  background:#fff;
  border:1px solid rgba(0,0,0,.2);
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  max-height:240px;
  overflow:auto;
  padding:8px 10px;
  display:none;
}
.asm-ms.is-open .asm-ms__panel{ display:block; }

.asm-ms__opt{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 4px;
}
.asm-ms__opt input{ transform: translateY(1px); }
.asm-ms__placeholder{ opacity:.7; }


/* ---- FILTER BAR: one line, compact ---- */
[data-asm-filters]{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;          /* keep on one line */
  margin: 10px 0 12px;
}

/* hide the big labels above each select (State / Adult-Use / Delivery) */
[data-asm-filters] label{
  display: none !important;
}


/* caret size/position if needed */
[data-asm-filters] .asm-ms__btn .asm-ms__caret{
  margin-left: 8px;
  transform: scale(.85);
}

/* make dropdown panels a bit tighter */
[data-asm-filters] .asm-ms__panel{
  font-size: 13px;
}

/* On small screens, allow wrapping to avoid overflow */
@media (max-width: 420px){
  [data-asm-filters]{
    flex-wrap: wrap;
  }
  [data-asm-filters] .asm-ms-btn{
    flex: 1 1 calc(33.33% - 8px);
    text-align: center;
    padding: 0 10px;
  }
}

/* =========================================
   ASM FILTER BAR – COMPACT PILL BUTTONS
   ========================================= */

/* Layout: one line, tight spacing */
[data-asm-filters] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

/* Override BIG CTA button styles */
[data-asm-filters] button,
[data-asm-filters] .asm-filter-btn {
	background-color: transparent;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600;
  line-height: 28px !important;

  border-radius: 999px !important;
  box-shadow: none !important;
}

/* Inner text */
[data-asm-filters] button span {
  font-size: 11px !important;
	color: black !important;
	font-weight: bold !important;
  line-height: 1;
}

/* Dropdown caret / icon */
[data-asm-filters] svg,
[data-asm-filters] .asm-filter-caret {
  width: 10px;
  height: 10px;
  margin-left: 6px;
}

/* Subtle hover state */
[data-asm-filters] button:hover {
  filter: brightness(0.95);
}

/* Mobile safety: allow wrap if needed */
@media (max-width: 420px) {
  [data-asm-filters] {
    flex-wrap: wrap;
  }
}

/* =========================================
   INLINE ADDRESS SEARCH + SMALL FIND NEAREST
   Matches your HTML:
   .asm-search-row.asm-search-row--address
   mapbox-search-box + #find-nearest.asm-find-nearest
   ========================================= */

.asm-search-row.asm-search-row--address{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* make the address box take remaining space */
.asm-search-row.asm-search-row--address mapbox-search-box{
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

/* shrink the actual input height inside mapbox search box */
.asm-search-row.asm-search-row--address mapbox-search-box .mbx0400aa75--Input{
  height: 32px !important;
  padding: 0 36px !important; /* room for icons */
  font-size: 13px !important;
}

/* keep the outer searchbox from forcing tall height */
.asm-search-row.asm-search-row--address mapbox-search-box .mbx0400aa75--SearchBox{
  border-radius: 10px !important;
}

/* small Find Nearest button */
.asm-search-row.asm-search-row--address #find-nearest.asm-find-nearest{
  flex: 0 0 auto !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 12px !important;

  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .4px !important;

  border-radius: 999px !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

/* optional: make it feel more "secondary" */
.asm-search-row.asm-search-row--address #find-nearest.asm-find-nearest{
  background: #fff !important;
  color: #0E2453 !important;
  border: 1px solid rgba(0,0,0,.2) !important;
}
.asm-search-row.asm-search-row--address #find-nearest.asm-find-nearest:hover{
  background: rgba(14,36,83,.06) !important;
}

/* mobile: allow wrapping if needed */
@media (max-width: 420px){
  .asm-search-row.asm-search-row--address{
    flex-wrap: wrap !important;
  }
  .asm-search-row.asm-search-row--address #find-nearest.asm-find-nearest{
    width: 100% !important;
    justify-content: center !important;
  }
}

/* FIND NEAREST hover → orange */
.asm-search-row.asm-search-row--address #find-nearest.asm-find-nearest:hover{
  background: #F2A225 !important;
  border-color: #F2A225 !important;
  color: #fff !important;
}

/* FILTER pills hover → orange (works for your enhanced pill buttons) */
.asm-filters .asm-pill:hover,
.asm-filters .asm-pill:focus{
  background: #F2A225 !important;
  border-color: #F2A225 !important;
  color: #fff !important;
}

/* caret/icon inside pill should turn white too */
.asm-filters .asm-pill:hover .asm-pill__caret,
.asm-filters .asm-pill:focus .asm-pill__caret{
  filter: brightness(0) invert(1) !important;
}

/* Optional: if you want the "active/open" pill to also be orange */
.asm-filters .asm-pill.is-open,
.asm-filters .asm-pill.is-active{
  background: #F2A225 !important;
  border-color: #F2A225 !important;
  color: #fff !important;
}


/* ✅ Only hide the top “field labels” (NOT the checkbox option labels inside the dropdown) */
[data-asm-filters] > label{
  display: none !important;
}

/* ✅ Your JS uses asm-ms__btn / asm-ms__panel / asm-ms__opt (double underscore) */
[data-asm-filters] .asm-ms__btn{
  min-height: 28px !important;
  height: 28px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 28px !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.2) !important;
  box-shadow: none !important;
  white-space: nowrap;
}

/* Panel positioning */
[data-asm-filters] .asm-ms{
  position: relative;
}

[data-asm-filters] .asm-ms__panel{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 9999;
  min-width: 220px;
  max-height: 280px;
  overflow: auto;

  background: #fff;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
  padding: 6px 8px;
  display: none;
}

/* show panel when wrapper is open */
[data-asm-filters] .asm-ms.is-open .asm-ms__panel{
  display: block;
}

/* ✅ DO NOT hide these — they’re the checkbox rows */
[data-asm-filters] .asm-ms__opt{
  display: flex !important;
  align-items: center;
  gap: 8px;
  padding: 6px 4px;
}

/* Keep checkbox clickable */
[data-asm-filters] .asm-ms__opt input{
  transform: translateY(1px);
}

/* Hover orange for the pill */
[data-asm-filters] .asm-ms__btn:hover,
[data-asm-filters] .asm-ms.is-open .asm-ms__btn{
  background: #F2A225 !important;
  border-color: #F2A225 !important;
  color: #fff !important;
}

/* If your label text is inside .asm-ms__label */
[data-asm-filters] .asm-ms__btn:hover .asm-ms__label,
[data-asm-filters] .asm-ms.is-open .asm-ms__label{
  color: #fff !important;
}


/* Ensure absolute children anchor to the card */
.asm-store-card{
  position: relative;
}




/* Ensure absolute children anchor to the card */
.asm-store-card{
  position: relative;
}



/* Ride icons sit under Shop Now */
.asm-ride-icons{
  position: absolute;
  top: 220px;      /* <-- adjust to sit under button */
  right: 12px;    /* align with Shop Now */
  z-index: 5;
  display: flex;
  gap: 10px;
  align-items: center;
}

/* Make them feel like tappable buttons
.asm-ride-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
	width: 35px;   
  height: 35px;
	border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.12);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
*/

.asm-ride-icon img{
  max-width: 35px;
  max-height: 35px;
  width: auto;
  height: auto;
  display: block;
}




/* ---------- SHOP CTA PILL (card top-right) ---------- */
.asm-shop-sc-map {
  position:absolute;
  right:15px;
  top:185px;
  z-index:5;
  font-size:12px;
  line-height:1;
  letter-spacing:.5px;
  padding:5px 10px;
  border-radius:10px;
  cursor:pointer;
  color:#fff !important;
  background:#0E2453;
	font-size: 12px !important;Accepted: TGK <> AWH - Status
  	font-weight: bold;
  transition:background-color 150ms ease-in-out;
  text-decoration:none;
}
.asm-shop-sc-map:hover{
  background:#F2A225;
}

/* ---------- LAYOUT ---------- */
.asm-wrap{
  display:grid;
  grid-template-columns:380px 1fr;
  gap:10px;
  align-items:stretch;
  height:var(--asm-height, 520px);
}

.asm-sidebar{
  height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.asm-search{ flex:0 0 auto; }

.asm-search-input{
  width:100%;
  padding:10px 12px;
  border-radius:4px;
  border:1px solid rgba(0,0,0,.18);
  outline:none;
  font-size:14px;
}

.asm-results{
  flex:1 1 auto;
  overflow:auto;
  min-height:0; /* key for flex scrolling */
}

.asm-map{
  height:100%;
  overflow:hidden;
}
.asm-map-inner{
  height:100%;
  width:100%;
}

/* ---------- CARDS ---------- */
.asm-card{
  border:1px solid rgba(0,0,0,.12);
  border-radius:8px;
  overflow:hidden;
  background:#fff;
  margin-bottom:12px;
  position:relative;
}

/* Image container enforces 5:2 */
.asm-card-media{
  position:relative;
  width:100%;
  aspect-ratio:5 / 2;
  overflow:hidden;
  background:#eee;
}
.asm-card-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.asm-card-img--placeholder{
  width:100%;
  height:100%;
  background:#e5e7eb;
}

.asm-card-body{
  padding:12px 12px 14px;
}

.asm-card-title{
  font-weight:800;
  font-size:16px;
  line-height:1.2;
  margin:0 0 4px 0;
}

.asm-mini{
  font-size:12px;
  opacity:.75;
  margin:0 0 10px 0;
}

.asm-meta{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
}

.asm-meta-row{
  display:flex;
  gap:8px;
  align-items:flex-start;
}

.asm-ico{
  width:18px;
  display:inline-block;
  opacity:.75;
}

.asm-meta a{
  text-decoration:none;
  font-weight:700;
}

/* ---------- HOURS ACCORDION HEADER ---------- */
.asm-hours{
  margin-top:2px;
  border-top:1px solid rgba(0,0,0,.10);

  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;

  width:100%;
  background:transparent;

  /* important: this is a button in your markup */
  border-left:0;
  border-right:0;
  border-bottom:0;

  cursor:pointer;
  text-align:left;

  /* hover target area */
  border-radius:0;
}

/* Hover color (change this to whatever you want) */
.asm-hours:hover{
  background:rgba(29,78,216,.06); /* subtle blue wash */
}

.asm-hours-label{
  font-size:11px;
  font-weight:900;
  opacity:.75;
  letter-spacing:.02em;
}

.asm-hours-right{
  font-size:12px;
  font-weight:800;
  color:#1a73e8;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

.asm-hours-right.is-closed{
  color:#1a73e8; /* keep as your blue for now */
}

.asm-hours-caret{
  width:0;
  height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:6px solid rgba(26,115,232,.9);
  transform:translateY(1px);
  transition:transform .15s ease;
}

.asm-hours[aria-expanded="true"] .asm-hours-caret{
  transform:rotate(180deg) translateY(-1px);
}

.asm-hours-panel{
  padding: 0;
}

.asm-weekly-hours{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
}

.asm-week-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:0;
  border-bottom:1px dashed rgba(0,0,0,.08);
}
.asm-week-row:last-child{ border-bottom:0; }
.asm-week-row--today{ font-weight:900; }

/* ---------- ACTION BUTTONS (cards) ---------- */
.asm-actions{
  display:grid;
  gap:10px;
  margin-top:10px;
}

/* Normalize <a> and <button> */
.asm-actions .asm-btn{
  display:flex;
  align-items:center;
  justify-content:center;

  width:100%;
  min-height:44px;
  padding:12px 14px;

  box-sizing:border-box;
  border-radius:999px;

  font:inherit;
  font-weight:600;
  line-height:1;

  text-decoration:none;
  -webkit-text-decoration:none;

  cursor:pointer;

  appearance:none;
  -webkit-appearance:none;

  background:transparent;
}

.asm-actions .asm-btn:visited{
  color:inherit;
}

/* Secondary (outline) */
.asm-actions .asm-btn--secondary{
  border:2px solid #1d4ed8;
  color:#1d4ed8;
}

/* ✅ FIXED hover rule (this used to be `filter: b` and unclosed) */
.asm-actions .asm-btn--secondary:hover{
  filter:brightness(0.95);
}

/* ---------- MARKERS ---------- */
.asm-marker{
  width:14px;
  height:14px;
  border-radius:999px;
  border:2px solid #fff;
  box-shadow:0 2px 12px rgba(0,0,0,.25);
}

/* ---------- POPUP (Mapbox) ---------- */
.mapboxgl-popup-content{
  padding:0 !important;                 /* we control padding inside */
  border-radius:18px !important;
  overflow:hidden !important;
  box-shadow:0 16px 40px rgba(0,0,0,.22) !important;
}

.mapboxgl-popup{
  max-width:520px !important;
}

/* If you’re using the “asm-popcard” layout in popup HTML */
.asm-popcard{
  position:relative;
  width:500px;
  max-width:86vw;
  background:#fff;
  font-family:inherit;
}

.asm-pop-x{
  position:absolute;
  top:10px;
  right:12px;
  width:34px;
  height:34px;
  border-radius:999px;
  border:0;
  background:transparent;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  color:#94a3b8;
}
.asm-pop-x:hover{
  color:#0f172a;
  background:rgba(15,23,42,.06);
}

.asm-pop-cols{
  display:grid;
  grid-template-columns:1fr 210px;
  gap:0;
}

.asm-pop-left{
  padding:16px 16px 14px;
}

.asm-pop-right{
  padding:16px 16px 14px;
  border-left:1px solid rgba(15,23,42,.12);
  display:flex;
  flex-direction:column;
  gap:14px;
}

.asm-pop-img{
  height:120px;
  border-radius:14px;
  background-size:cover;
  background-position:center;
  background-color:#eee;
  margin-bottom:12px;
}
.asm-pop-img--ph{ background:#e5e7eb; }

.asm-pop-brand{
  font-weight:800;
  font-size:13px;
  letter-spacing:.04em;
  color:#475569;
  text-transform:uppercase;
  margin-bottom:2px;
}

.asm-pop-name{
  font-weight:1000;
  font-size:26px;
  letter-spacing:.02em;
  color:#0f172a;
  margin-bottom:6px;
}

.asm-pop-addr{
  font-size:14px;
  color:#0f172a;
  line-height:1.25;
}

.asm-pop-phone{
  margin-top:6px;
  font-weight:800;
  color:#0f172a;
}

.asm-pop-links{
  margin-top:6px;
  display:flex;
  gap:14px;
}
.asm-pop-links a{
  font-weight:800;
  text-decoration:none;
  color:#1d4ed8;
}

.asm-pop-status{
  margin-top:12px;
  font-weight:800;
  color:#475569;
}

.asm-pop-label{
  margin-top:10px;
  margin-bottom:6px;
  font-weight:900;
  font-size:12px;
  letter-spacing:.05em;
  color:#475569;
  text-transform:uppercase;
}

.asm-pop-hours{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.asm-pop-hours td{
  padding:6px 10px;
  border:1px solid rgba(15,23,42,.16);
  vertical-align:top;
}
.asm-pop-hours tr.is-today td{
  font-weight:900;
}
.asm-pop-hours td:first-child{
  width:46%;
  color:#0f172a;
}
.asm-pop-hours td:last-child{
  text-align:right;
  font-weight:700;
  color:#0f172a;
}

.asm-pop-details{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:900;
  text-decoration:none;
  color:#0f172a;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.asm-pop-shop{
  margin-top:6px;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:100%;
  padding:12px 14px;
  border-radius:999px;
  background:#b08b2e;
  color:#fff;
  font-weight:900;
  text-decoration:none;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.asm-pop-other-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 18px;
}
.asm-pop-other-link{
  font-weight:800;
  text-decoration:none;
  color:#1d4ed8;
}

/* ---------- EMPTY STATE ---------- */
.asm-empty{
  padding:16px;
  opacity:.75;
}






/* each store row/card */
.asm-store-row{
  position: relative;
  padding: 0 0 20px;
  margin-bottom: 20px;
}

/* store name */
.asm-store-row h3{
  font-size: 14px;
  line-height: 1.3em;
  color: #1d2644;
  text-transform: uppercase;
  margin: 0 0 5px;
  font-weight: 800;
}

/* address + meta text */
.asm-store-row p{
  color: #4d79a7;
  font-size: 12px;
  line-height: 1.3em;
  padding-right: 70px; /* room for SHOP pill */
  padding-left: 10px;
  padding-bottom: 5px;
  margin: 0;
}



/* Outlet / delivery rows */
.asm-eg-del  {
  font-size: 12px;
  color: #4d79a7;
  margin: 0;
  padding-left: 10px;
}
.asm-eg-del   img{
  vertical-align: middle;
}



.find_store_block_pop_wrap .asm-store-row,
.find_store_block_pop_wrap .row-fsbpwl{
  position: relative !important;
  padding: 0 0 10px !important;
  margin: 0 !important;
  border-bottom: 0 !important;
}


/* 3) Fix the “Currently Shopping” preview block spacing + label */
.find_store_block_pop_wrap .panel-body-active-sc{
  background: #ffffff !important;
  padding: 10px !important;
}

.find_store_block_pop_wrap .panel-body-active-sc .fsbpwl-uncont,
.find_store_block_pop_wrap .panel-body-active-sc .asm-store-card{
  position: relative !important;
  padding: 22px 10px 10px  !important;
}



.find_store_block_pop_wrap .asm-store-row{
  position: relative;
}

/* SHOP pill positioning */
.find_store_block_pop_wrap .shop-sc{
  top: 45px !important;      /* more stable than bottom inside varying content */
  bottom: auto;
  right: 10px;
}

.find_store_block_pop_wrap .panel-body-active-sc.fs-current{
  background: #eeeeee !important;
  padding: 12px 12px 0 !important;
}

/********  END KEEP  *************/


/* Map close button */
.fs-map__close {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10;
  background: white;
  border: none;
  padding: 10px 15px;
  border-radius: 4px;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  font-weight: 600;
}



.fs-map__close:hover {
  background: #f0f0f0;
}

/* Mapbox popup styling */
.mapboxgl-popup-content {
  padding: 15px;
  min-width: 200px;
}

.mapboxgl-popup-content h4 {
  margin: 0 0 10px 0;
  font-size: 16px;
}

.mapboxgl-popup-content p {
  margin: 5px 0;
  font-size: 14px;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .fs-tray__panel.map-active .fs-tray__list-side {
    width: 100%;
  }
  
  .fs-tray__panel.map-active .fs-tray__map-side {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
  }
}


.asm-popup__other{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.asm-popup__other-title{
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #0E2453;
  margin-bottom: 6px;
}

.asm-popup__other-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr; /* or 1fr 1fr if you want 2 columns */
  gap: 0px;
}

.asm-popup__other-link{
  display: inline-block;
  font-size: 12px;
  line-height: 1.2;
  color: #0E2453;
  text-decoration: underline;
}


/* =========================
   MAP OVERLAY (slide-in)
   ========================= */

#storeMapContainer.fs-map-container{
  position: fixed;
  top: 5%;
  right: -100%;
  width: 50%;
  height: 75vh;
  background: #fff;
  z-index: 999999;
  transition: right .35s ease;
  box-shadow: -12px 0 28px rgba(0,0,0,.25);
}

/* ACTIVE = slide in */
#storeMapContainer.fs-map-container.map-active{
  right: 0;
}

/* If tray is open, leave room for it */
body.openpopup #storeMapContainer.fs-map-container.map-active{
  width: calc(100% - 350px);
}

/* Map fills container */
#storeMap{
  width: 100%;
  height: 100%;
}

/* Mobile: full screen */
@media (max-width: 768px){
  #storeMapContainer.fs-map-container{
    width: 100%;
	  top: 5%;
  right: -100%;
  height: 75vh;

	}
  body.openpopup #storeMapContainer.fs-map-container.map-active{
    width: 100%;
  }
	}


/* =========================
   MAPBOX POPUP (SCOPED)
   ========================= */
.mapboxgl-popup.asm-popup{ max-width: 620px !important; }

.mapboxgl-popup.asm-popup .mapboxgl-popup-content{
  padding: 0 !important;
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0,0,0,.25) !important;
}

.asm-popup__hours .bh-header{
  display: flex;
  flex-direction: column;  /* stack */
  align-items: flex-start;
  gap: 2px;
}

.asm-popup__hours .bh-status{ order: 1; }
.asm-popup__hours .bh-title{ order: 2; }


/* =========================
   MAPBOX POPUP CLOSE BUTTON
   Scoped to .asm-popup ONLY
   ========================= */



/* Close button */
.mapboxgl-popup.asm-popup .mapboxgl-popup-close-button{
  position: absolute !important;
  top: -5px !important;
  right: 0px !important;

  width: 34px;
  height:34px;
  line-height: 30px;

  padding: 0;
  border-radius: 999px;
	border: 0px;

  background: #ffffff;
  color: #cc0000;

  font-size: 20px;
  font-weight: 700;

/*  box-shadow: 0 2px 6px rgba(0,0,0,.25); */
  cursor: pointer;

  z-index: 5;
}

/* Hover state */
.mapboxgl-popup.asm-popup .mapboxgl-popup-close-button:hover{
  background: #f4f4f4;
}


/* =========================
   2-COLUMN GRID LAYOUT
   ========================= */
.asm-popup__grid{
  display: grid;
  grid-template-columns: 150px 1fr;   /* left | right */
  gap: 14px;
  padding: 14px;
  background: #fff;
  align-items: start;
}

.asm-popup__left{ display:flex; flex-direction:column; gap:10px; }

.asm-popup__img{
  width: 100%;
  height: 130px;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
}

.asm-popup__title{
  font-weight: 900;
  font-size: 18px;
  color: #0E2453;
	padding-bottom: 5px;
  text-transform: uppercase;
  line-height: 1.05;
}

.asm-popup__meta{
  font-size: 13px;
  line-height: 1.25;
  color: #1c1c1c;
}

.asm-popup__phone{
  margin-top: 4px;
  font-weight: 800;
  color: #0E2453;
}

/* =========================
   HOURS: smaller + fit
   ========================= */
.asm-popup__hours .bh-title{ font-size: 12px !important; }
.asm-popup__hours .bh-status{ font-size: 12px !important; }

.asm-popup__hours .bh-table{
  width: 100% !important;
	table-layout: fixed;
  border-collapse: collapse;
}

.asm-popup__hours .bh-row td{
  font-size: 11px !important;
  line-height: 1.15;
	padding: 2px 3px !important;
	white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.asm-popup__hours .bh-day{ width: 40% !important; }
.asm-popup__hours .bh-time{
	width: 60% !important;
  text-align: right;
}

/* =========================
   FULL-WIDTH BUTTON
   ========================= */
.asm-popup__btn{
  grid-column: 1 / -1;          /* span both columns */
  border: 0;
  border-radius: 999px;
	font-size:12px;
  padding: 4px 16px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: #0E2453;
  color: #fff !important;
  cursor: pointer;
  margin-top: 10px;
}

.asm-popup__brand{
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #777;
	line-height: 1em;
}

.asm-popup__links{
  display: flex;
  gap: 10px;
  margin: 6px 0 10px;
}

.asm-popup__link{
  font-size: 12px;
  font-weight: 700;
  color: #0E2453;
  text-decoration: none;
}

.asm-popup__link:hover{
  text-decoration: underline;
}






	
.asm-store-address.asm-store-card__address {
  margin-bottom: 0 !important;
}

@media (max-width: 640px){
.find_store_block_pop_wrap .panel-body-active-sc .store-title{
  font-size: 18px !important;
  line-height: 1 !important;
}

	
.asm-store-row p {
		padding-bottom: 0px;
	}	
	
}
	

.find_store_block_pop_wrap .panel-body-active-sc .asm-store-titlea{
  font-size: inherit !important;
}

.find_store_block_pop_wrap .panel-body-active-sc .asm-store-address{
  font-size: 16px !important;
  line-height: 1.1 !important;
}

.find_store_block_pop_wrap .panel-body-active-sc .fsbpw-more a{
  font-size: 13px !important;
}

/* optional: make SHOP pill slightly larger too */
.find_store_block_pop_wrap .panel-body-active-sc .shop-sc{
  font-size: 12px !important;
}


/* Hide featured image everywhere by default */
.store-featured-image-wrap { 
  display: none;
}

/* Show only inside the active preview block */
.panel-body-active-sc .store-featured-image-wrap {
  display: block;
}



.panel-body-active-sc .store-featured-image-wrap {
  width: 100px;
  height: 100px;
  overflow: hidden;
  border-radius: 10px; /* optional */
  margin: 6px 0 8px;
}

.panel-body-active-sc .store-featured-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}



/* Retail brand small */
.asm-store-retail-brand   {
  font-size: 10px !important;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
  opacity: .85;
  margin: 0 0 -8px 0 !important;
}



/* Store links row */
.panel-body-active-sc .asm-store-links {
  display: flex;
	font-size: 12px;
  gap: 14px;
  margin-top: 0px;
}
.panel-body-active-sc .asm-store-links a {
  text-decoration: underline;
  font-weight: 600;
}

.asm-store-links {
	font-size: 12px;
}


/* Store links row */
.panel-body-active-sc .asm-store-links {
	display: flex;
	font-size: 12px;
  gap: 5px;
  margin-top: 0px;
}
.panel-body-active-sc .asm-store-links a {
  text-decoration: underline;
  font-weight: 600;
	display:flex;
}







.asm-store-card {
    border: 1px solid #e0e0e0; /* Light gray border */
    border-radius: 5px; /* Slightly rounded corners */
    margin-bottom: 0px; /* Space between cards */
    padding: 0 10px; /* Inner spacing */
}


/* Hide the active store row in the list (because it’s shown in the preview block) */
.asm-store-row--hidden {
  display: none !important;
}



.asm-search-row{
  display:flex;
  gap:10px;
}

.asm-nearbtn{
  flex:0 0 auto;
  padding:10px !important;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.18);
  background:#0E2453;
  color:#fff;
	font-size:12px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}

.asm-nearbtn:hover{
  background:#14346f;
}

.asm-nearbtn.is-loading{
  opacity:.7;
  cursor:wait;
}
.asm-panel-loader{
  padding: 14px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 10px;
  background: #fff;
  margin-bottom: 12px;
}

.asm-spinner{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.15);
  border-top-color: rgba(0,0,0,.55);
  animation: asmspin .7s linear infinite;
}

.asm-loader-text{
  font-size: 13px;
  font-weight: 700;
  opacity: .85;
}

@keyframes asmspin{
  to { transform: rotate(360deg); }
}



/* Address autocomplete (Mapbox Search JS element) */
.asm-search-row--address{
  margin-bottom: 8px;
}

mapbox-search-box.asm-addressbox{
  width: 100%;
  display: block;
}

/* (optional) keep the search box visually consistent */
mapbox-search-box.asm-addressbox{
  --mbx-border-radius: 4px;
}

/* =========================================================
   MAPBOX ADDRESS AUTOCOMPLETE — LAYOUT FIX
   Prevents it from stealing the whole flex row
   ========================================================= */

/* Base search row layout */
.asm-search-row{
  display: flex;
  gap: 10px;
  align-items: center;
}

/* Address search lives on its own row and is full width */
.asm-search-row--address{
  display: block;
  margin-bottom: 8px;
}

/* Mapbox custom element must be allowed to size properly */
.asm-search-row--address mapbox-search-box{
  display: block;
  width: 100%;
  max-width: 100%;
}

/* IMPORTANT:
   If mapbox-search-box appears in a flex row,
   force it to shrink instead of pushing buttons away */
.asm-search-row mapbox-search-box{
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

/* Keep Find Nearest button visible */
.asm-search-row .asm-nearbtn{
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Safety reset: Mapbox Search JS sometimes resets buttons */
.asm-wrap button{
  appearance: none;
  -webkit-appearance: none;
  font-family: inherit;
}


/* ===============================
   ASM – Compact Business Hours
   =============================== */

.asm-popup__hours{
  margin-top: 6px;
}

/* Wrapper */
.asm-bh-wrap{
  display: block;
}

/* Status line (Currently Open / Closed) */
.asm-bh-status{
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  margin-bottom: 2px;
  color: #475569;
}

/* "BUSINESS HOURS" label */



.asm-bh-title{
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 4px;
  color: #64748b;
}

/* Table */
.asm-bh-table{
  width: 100%;
  table-layout: fixed;
}

/* Rows */
.asm-bh-table tr{
}

.asm-bh-table tr:last-child{
  border-bottom: 0;
}

/* Cells */
.asm-bh-table td{
  padding: 3px;
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}

/* Day column */
.asm-bh-table td:first-child{
  width: 44%;
  font-weight: 400;
  color: #0f172a;
}

/* Time column */
.asm-bh-table td:last-child{
  width: 56%;
  text-align: right;
  font-weight: 400;
  color: #0f172a;
}

/* Highlight today */
.asm-bh-table tr.is-today td{
  font-weight: 900;
}

/* Optional: even tighter on mobile popups */
@media (max-width: 480px){
  .asm-bh-table td{
    padding: 2px 0;
    font-size: 10.5px;
  }
}




.asm-nearbtn {
  appearance: none;
  border: none;
  background: #f4a940;          /* adjust to brand color */
  color: #fff;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 6px 12px;
  border-radius: 999px;         /* pill */
  cursor: pointer;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.asm-nearbtn:hover {
  background: #e39830;
}

.asm-nearbtn:active {
  transform: translateY(1px);
}

.asm-hours-label {
	color: blue !important;
}

.asm-hours {
  background: transparent !important;
  border: none !important;
  box-shadow: none;
}

/* KILL the existing label no matter what */
button.asm-hours .asm-hours-label{
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* FORCE the left column to exist */
button.asm-hours .asm-hours-left{
  display: flex !important;
  align-items: center !important;
}

/* Update the base ::before rule - remove hardcoded color */
button.asm-hours .asm-hours-left::before {
    content: "Currently Open" !important;
    display: block !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #fff !important; /* Changed from #d11 */
}

/* Update the closed rule - remove hardcoded color */
button.asm-hours[data-open="0"] .asm-hours-left::before {
    content: "Currently Closed" !important;
    color: #fff !important; /* Changed from #666 */
}


/* Hide the standalone "Currently Open/Closed" line ABOVE the hours row */
.asm-results .asm-hours {
  /* (no change) */
}

/* common selectors people use for that status line */
.asm-results .asm-open,
.asm-results .asm-open-now,
.asm-results .asm-status,
.asm-results .asm-statusline,
.asm-results .asm-currently,
.asm-results .asm-current-status {
  display: none !important;
}

.asm-search {
	margin: 15px 0 !important;
}

.asm-sidebar {
	margin: 5px !important;
}

.asm-card {
	margin-bottom: 10px !important;
	
	
}

.asm-bh-table,
.asm-bh-table tr,
.asm-bh-table td{
  border: none !important;
}


@media (max-width: 767px){
  .asm-wrap{
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 280px 1fr !important; /* fixed map height */
    height: 100dvh !important;
    height: 100svh !important;
    height: 100vh !important;
    overflow: hidden !important;
  }

  .asm-map{
    grid-row: 1 !important;
    height: 280px !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .asm-sidebar{
    grid-row: 2 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .asm-results{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}


@media (max-width: 767px){

  .mapboxgl-popup.asm-popup .asm-popup__other{
    display: none !important;
  }

  .mapboxgl-popup .asm-popup__hours .asm-bh-title,
  .mapboxgl-popup .asm-popup__hours .asm-bh-table{
    display: none !important;
  }

  .mapboxgl-popup .asm-popup__hours .asm-bh-today{
    font-size: 12px;
    font-weight: 800;
    margin-top: 2px;
    color: #0E2453;
  }

  .asm-bh-table{
    display: none !important;
  }
}



/* Store action links row */
.asm-store-links{
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.4;
}

/* Make links feel interactive */
.asm-store-links a{
  position: relative;
  display: inline-block;
  padding: 2px 2px;
  margin: 0 2px;
  color: #0E2453;                /* your brand blue */
  font-weight: 500;
  text-decoration: none;
  border-radius: 4px;
}

/* Hover / focus affordance */
.asm-store-links a:hover,
.asm-store-links a:focus-visible{
  background: rgba(14,36,83,.08);
  text-decoration: underline;
}

/* Keyboard focus */
.asm-store-links a:focus-visible{
  outline: 2px solid rgba(14,36,83,.35);
  outline-offset: 2px;
}

/* Optional: pipe separators softened */
.asm-store-links{
  color: #6b7280;
}



/* Other locations section */
.asm-popup__other{
  margin-top: 10px;
}

/* Other locations links list */
.asm-popup__other-link{
  position: relative;
  display: inline-block;
  padding: 2px 2px;
  margin: 2px 0;
  color: #0E2453;               /* same brand blue */
  font-weight: 500;
  font-size: 13px;
  line-height: 1.4;
  text-decoration: none;
  border-radius: 4px;
}

/* Hover / focus affordance */
.asm-popup__other-link:hover,
.asm-popup__other-link:focus-visible{
  background: rgba(14,36,83,.08);
  text-decoration: underline;
}

/* Keyboard focus */
.asm-popup__other-link:focus-visible{
  outline: 2px solid rgba(14,36,83,.35);
  outline-offset: 2px;
}

.asm-availability{
  margin-top: 4px !important;
  font-size: 12px !important;
  line-height: 1em;
  color: rgba(0,0,0,.65);
}

.asm-results .asm-store-row .asm-store-card p.asm-availability.asm-store-card__meta{
	margin:0 !important;
	
}


/* Card layout with thumbnail */
.asm-store-active-details--with-thumb{
  display: grid;
  grid-template-columns: 78px 1fr;
  gap: 14px;
  align-items: start;
}

/* If no thumb exists, grid collapses naturally because thumb div isn’t rendered */
.asm-store-thumb{
  width: 78px;
}

.asm-store-thumb__img{
  width: 7/* TWO-COLUMN LAYOUT: image left, everything else right */
.asm-store-card-body{
  display: grid;
  grid-template-columns: 78px 1fr;
  gap: 14px;
  align-items: start;
}

/* left column */
.asm-store-card-left{
  width: 78px;
}

/* square image */
.asm-store-thumb__img{
  width: 78px;
  height: 150px;
  border-radius: 5px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}

/* prevent text column weirdness */
.asm-store-active-details{
  min-width: 0;
}
px;
  height: 78px;
  border-radius: 10px;            /* matches modern UI + popup vibe */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}




/* Make sure text column behaves nicely */
.asm-store-main{
  min-width: 0;
}



.asm-popup__hours {
	margin: 0 !important;
}

.select-store {
	border-radius: 25px;
}

.shop-now-menu-item {
	display:none !important;
}

#awh-perf-overlay {
    font-size: 14px !important;
}

.uncont.fsbpwl-uncont {
	padding: 0;
}

.fsbpwl-uncont {
	margin-bottom: 0px
}

.fsbpwl-uncont.is-active-store-hidden { display: none !important; }

.store-image-wrap {
  aspect-ratio: 4 / 3;      /* 🔒 square */
  width: 50%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 16px;
}

@media (max-width: 767px) {
	.store-image-wrap {
		width: 100%;
  }
}

/* Phone + link row under address */
.fsbpw-locations .fs-address,
.panel-body-active-sc .fs-address{
  margin: 0 0 6px !important;
}

/* Phone link styling (inherits your blue-ish text) */
.fsbpw-locations .fs-phone,
.panel-body-active-sc .fs-phone{
  text-decoration: none;
  font-weight: 600;
}

/* Horizontal links row */
.fsbpw-locations .fs-links,
.panel-body-active-sc .fs-links{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.5;
}


.mapboxgl-popup-tip{
  display: none !important;
}

.asm-filters {
	margin-top: 0 !important;
}

.asm-marker--pin{
  width: 50px !important;
  height: 75px !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: pointer;

  /* Set pin color here */
  color: #2F80ED;
}

/* The actual pin graphic */
.asm-marker--pin{
  background-image: url("/wp-content/uploads/2026/03/ascend-logo-marker.webp");
  background-size: contain;   /* ensures full logo shows */
  background-repeat: no-repeat;
  background-position: center;
}

/* Optional: hover “lift” */
.asm-marker--pin:hover{
  transform: translateY(-1px) scale(1.06);
}


.asm-store-thumb__img {
	height: 175px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
}



.asm-hours-left {
	padding: 0px 10px !important;
}

/* Status badge colors on the hours-left div */
.asm-hours-left--currently-open {
  color: #fff !important;
  background-color: #22a24a !important; /* green */
}

.asm-hours-left--currently-closed {
  color: #fff !important;
  background-color: #d93025 !important; /* red */
}

.asm-hours-left--opening-soon {
  color: #fff !important;
  background-color: #1a73e8 !important; /* blue */
}

.asm-hours-left--closing-soon {
  color: #fff !important;
  background-color: #f57c00 !important; /* orange */
}

button.asm-hours {
	padding: 10px;
}

.asm-popup__other, .asm-popup__hours {
    display: none !important;
}


/* =========================
   LIMIT POPUP SIZE (DO NOT FORCE)
========================= */
.mapboxgl-popup-content{
  max-width: 400px !important;
  width: auto !important;
}

/* =========================
   REMOVE MAPBOX HARD LIMIT
========================= */
.mapboxgl-popup{
  max-width: 500px !important;
}

/* =========================
   ALLOW GRID TO SHRINK
========================= */
.asm-popup__grid{
  display: grid;
  grid-template-columns: minmax(0, 120px) 1fr;
  gap: 16px;
}

/* =========================
   PREVENT CONTENT FROM FORCING WIDTH
========================= */
.asm-popup__right{
  min-width: 0;
}



