/* ============================================================
   SpOki Search UX (2026-07-11) — three scoped repairs:
   1. Product search-results header (count line + category chips)
   2. Mobile off-canvas drawer header (close X + FiboSearch field)
   3. FiboSearch "view all results" CTA (prominent, sticky on mobile)
   Kill-switch: dequeue 'spoki-search-ux'.
   ============================================================ */

/* ---------- 1. SEARCH RESULTS PAGE (body.search-results only) ---------- */
body.search-results .spoki-sr__head { margin: 0 0 14px; }
body.search-results .spoki-sr__count {
  margin: 2px 0 10px;
  font-size: 15px;
  font-weight: 600;
  color: #41525f;
}
body.search-results .spoki-sr__cats {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: #19B0B6 transparent;
  padding-bottom: 4px;
}
body.search-results .spoki-sr__cats::-webkit-scrollbar { height: 5px; }\nbody.search-results .spoki-sr__cats::-webkit-scrollbar-thumb { background: #19B0B6; border-radius: 999px; }\nbody.search-results .spoki-sr__cats::-webkit-scrollbar-track { background: transparent; }
body.search-results .spoki-sr__catchip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 8px 16px;
  border: 1.5px solid var(--spoki-sand, #efe7da);
  border-radius: 999px;
  background: var(--spoki-white, #fff);
  color: var(--spoki-slate, #1f2a36);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color .15s ease, background .15s ease;
}
body.search-results .spoki-sr__catchip:hover { border-color: #19B0B6; color: var(--spoki-teal-deep, #0f766e); }
body.search-results .spoki-sr__catchip.is-active {
  background: #19B0B6;
  border-color: #19B0B6;
  color: #fff;
}
body.search-results .spoki-sr__empty { margin: 10px 0 30px; padding: 22px; border: 1px solid var(--spoki-sand, #efe7da); border-radius: 16px; background: #fff; max-width: 560px; }
body.search-results .spoki-sr__empty-title { margin: 0 0 6px; font-size: 18px; font-weight: 800; color: var(--spoki-slate, #1f2a36); }
body.search-results .spoki-sr__empty-hint { margin: 0 0 12px; font-size: 14px; color: #41525f; }
body.search-results .spoki-sr__empty-clear { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px; border-radius: 999px; background: #19B0B6; color: #fff; font-weight: 700; text-decoration: none; margin-bottom: 10px; }
body.search-results .spoki-sr__empty-links { margin: 6px 0 0; font-size: 14px; }
body.search-results .spoki-sr__empty-links a { color: var(--spoki-teal-deep, #0f766e); font-weight: 700; }

/* ---------- 2. MOBILE DRAWER HEADER (≤1024px, mobile nav drawer only) ---------- */
@media (max-width: 1024px) {
  .mobile-nav.wd-side-hidden-nav {
    position: fixed;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px;
    align-content: start;
    align-items: center;
    padding: 12px 16px 16px;
    width: min(88vw, 360px);
    max-width: 100%;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    background: #fff;
  }
  /* Header row, cell 1: the close button (markup injected by sandbox JS; restyled here). */
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close {
    position: static;
    grid-column: 1;
    grid-row: 1;
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
    padding: 0;
    border: 1.5px solid var(--spoki-sand, #efe7da);
    border-radius: 14px;
    background: #fff;
    color: var(--spoki-slate, #1f2a36);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: none;
    transition: border-color .15s ease;
  }
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close:hover,
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close:focus-visible {
    background: #fff;
    border-color: #19B0B6;
  }
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close:focus-visible {
    outline: 2px solid var(--spoki-teal-deep, #0f766e);
    outline-offset: 2px;
  }
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close span,
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 2px;
    border-radius: 999px;
    background: var(--spoki-slate, #1f2a36);
    transform: rotate(45deg);
  }
  .mobile-nav.wd-side-hidden-nav .spoki-mobile-menu-close::before { transform: rotate(-45deg); }

  /* Header row, cell 2: FiboSearch styled as a full-width field. Tap keeps the
     plugin's own mobile-overlay behavior (no duplicated mechanisms). */
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    position: relative;
    width: 100%;
    height: 48px;
    margin: 0;
  }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-enable-mobile-form {
    display: flex;
    align-items: center;
    width: 100%;
    height: 48px;
    border: 1.5px solid var(--spoki-sand, #efe7da);
    border-radius: 14px;
    background: #fff;
    padding: 0 12px 0 40px;
    box-sizing: border-box;
    text-decoration: none;
  }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-enable-mobile-form::after {
    content: "Търси играчка или марка…";
    color: #8a97a3;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    z-index: 2;
    pointer-events: none;
  }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-search-icon svg { width: 18px; height: 18px; display: block; }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-search-icon-arrow,
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp form.dgwt-wcas-search-form {
    display: none !important;
  }

  /* Everything else in the drawer spans the full row, below the header. */
  .mobile-nav.wd-side-hidden-nav > *:not(.spoki-mobile-menu-close):not(.dgwt-wcas-search-wrapp) {
    grid-column: 1 / -1;
  }
  .mobile-nav.wd-side-hidden-nav > ul.wd-nav-mobile { margin-top: 6px; }
}
@media (min-width: 1025px) {
  .spoki-mobile-menu-close { display: none !important; }
}

/* ---------- 3. FIBOSEARCH VIEW-ALL CTA ---------- */
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more,
.dgwt-wcas-suggestions-wrapp .js-dgwt-wcas-suggestion-more {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 6px 12px calc(8px + env(safe-area-inset-bottom, 0px));
  border-radius: 12px;
  background: #19B0B6;
  color: #fff !important;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1px;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(15, 118, 110, .18);
  z-index: 5;
  transition: background .15s ease;
}
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more:hover,
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more.dgwt-wcas-suggestion-selected {
  background: #148f94;
  color: #fff !important;
}
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
}
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more::after {
  content: "→";
  margin-left: 8px;
  font-size: 16px;
  line-height: 1;
}

/* Patch: FiboSearch icon-mode caps the wrapper at 20px and positions the anchor absolutely; neutralize INSIDE the drawer only. */
@media (max-width: 1024px) {
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
  }
  .mobile-nav.wd-side-hidden-nav > .dgwt-wcas-search-wrapp .dgwt-wcas-enable-mobile-form {
    position: static !important;
    width: 100% !important;
    height: 48px !important;
    margin: 0 !important;
  }
}

/* Patch 2: plugin sets width:100% on suggestions; with the CTA's side margins that overflows the panel by 24px. */
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more { width: auto !important; box-sizing: border-box; }

/* search suggestion price: EUR + BGN on ONE row — owner 2026-07-14 */
.dgwt-wcas-sp{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:baseline!important;gap:6px!important;white-space:nowrap!important}
.dgwt-wcas-sp br{display:none!important}
.dgwt-wcas-sp .woocommerce-Price-amount{display:inline-block!important;white-space:nowrap!important;float:none!important}
.dgwt-wcas-sp .amount-bgn{font-size:12px;font-weight:600;color:#8A9499}

/* SPOKI-SR-HIDE-FILTRI: desktop sidebar is visible, so hide the redundant 'Филтри' opener next to Сортирай */
@media (min-width:1200px){
  body.search-results .wd-shop-tools .wd-filter-buttons,
  body.search-results .wd-shop-tools .open-filters{ display:none !important; }
}

/* SPOKI-SR-CARD-ALIGN: equal-height cards + CTA pinned to bottom on search grid */
body.search-results .wd-products.wd-grid-g{ align-items: stretch !important; }
body.search-results .wd-products.wd-grid-g > .product{ display:flex !important; }
body.search-results .wd-products.wd-grid-g > .product > .spoki-pcard{ width:100%; }
body.search-results .spoki-pcard{ height:100%; }
body.search-results .spoki-pcard__body{ display:flex; flex-direction:column; flex:1 1 auto; }
body.search-results .spoki-pcard__foot{ margin-top:auto; }

/* FIBOSEARCH 320 CLOSURE 2026-07-17: at <=359px cap the suggestion title to 2 visible lines (full text stays in DOM for screen readers). Scoped to the real visible dropdown wrapper .dgwt-wcas-suggestions-wrapp so hidden/desktop instances are untouched. */
@media (max-width:359px){
  .dgwt-wcas-suggestions-wrapp .dgwt-wcas-st-title{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
}

/* SEARCH SUGGESTION CARD FIX 2026-07-22 (Claude): the generic .spoki-pcard media/body
   padding is built for the big grid cards; on the 56px search-suggestion thumbnail it
   squeezes the image down to 28px (reads as a blank box) and bloats each suggestion row.
   Scope tighter values to the --search variant only, so grid/category cards are untouched. */
.spoki-pcard.spoki-pcard--search .spoki-pcard__media{padding:0 !important;}
.spoki-pcard.spoki-pcard--search .spoki-pcard__media img{width:100% !important;height:100% !important;object-fit:cover !important;border-radius:8px !important;mix-blend-mode:normal !important;}
.spoki-pcard.spoki-pcard--search .spoki-pcard__body{padding:2px 12px !important;gap:2px !important;}
.dgwt-wcas-suggestions .dgwt-wcas-suggestion.dgwt-wcas-suggestion-product{padding-top:6px !important;padding-bottom:6px !important;}