/* assets/css/en-search-card.css
   Scope: Search results only (.en-woo-search body class)
   Purpose:
   - Add a subtle gap between cards
   - Keep container gutters sane on Flatsome rows
   - Ensure long titles never overflow the card
   - Provide safe column fallbacks for 4/3/2 layouts
*/

/* ---------- Results grid wrapper ---------- */
body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid) {
  display: flex;
  flex-wrap: wrap;
  gap: 12px; /* subtle "breath of air" between cards */
  margin-left: 0 !important;   /* neutralize Flatsome negative gutters on search */
  margin-right: 0 !important;
  padding-left: 0;
  padding-right: 0;
}

body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid).en-card-grid {
  display: grid;
}

/* Neutralize any per-item paddings/margins so gap controls spacing */
body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid) > :is(.product, .en-card-grid__item) {
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  list-style: none;
  box-sizing: border-box;
  flex: 1 1 100%;
  width: 100% !important;
  max-width: 100% !important;
}

body.en-woo-search .en-product-card {
  height: var(--en-card-locked-height, auto) !important;
  min-height: var(--en-card-equalized-height, auto) !important;
}

body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid) > :is(.product, .en-card-grid__item)[style*="min-height"] {
  min-height: auto !important;
}

body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid) > :is(.product, .en-card-grid__item)[style*="height"] {
  height: auto !important;
}

/* ---------- Column fallbacks (in case theme utilities don't apply here) ---------- */
@media (min-width: 1024px) {
  body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid):not(.en-card-grid) > :is(.product, .en-card-grid__item) {
    flex: 0 0 calc((100% - 36px) / 4);
    width: calc((100% - 36px) / 4) !important;
    max-width: calc((100% - 36px) / 4) !important;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid):not(.en-card-grid) > :is(.product, .en-card-grid__item) {
    flex: 0 0 calc((100% - 24px) / 3);
    width: calc((100% - 24px) / 3) !important;
    max-width: calc((100% - 24px) / 3) !important;
  }
}
@media (min-width: 544px) and (max-width: 767px) {
  body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid):not(.en-card-grid) > :is(.product, .en-card-grid__item) {
    flex: 0 0 calc((100% - 12px) / 2);
    width: calc((100% - 12px) / 2) !important;
    max-width: calc((100% - 12px) / 2) !important;
  }
}
/* tiny screens */
@media (max-width: 543px) {
  body.en-woo-search :is(.products, .facetwp-template, .en-fwp-products-grid):not(.en-card-grid) > :is(.product, .en-card-grid__item) {
    flex: 0 0 100%;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ---------- Card internals: long titles & safe overflow ---------- */
body.en-woo-search .en-card-link,
body.en-woo-search .en-card-title {
  min-width: 0; /* critical for flex children to allow wrapping, avoids overflow to the right */
}

body.en-woo-search .en-card-title {
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

/* Ensure descriptions animate smoothly on hover while respecting natural height */
/* FUTURE WORK ON PRODUCT CARDS: search-specific hover reveal disabled */

/* Optional: small visual separation if equalize scripts inject heights briefly */
body.en-woo-search .en-product-card.loaded {
  /* no visual change, just a hook we toggle from JS after cleanup */
}

/* ---------- FiboSearch live results ---------- */
.dgwt-wcas-suggestion-product .dgwt-wcas-st {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  row-gap: 4px;
}

.dgwt-wcas-suggestion-product .dgwt-wcas-st > span,
.dgwt-wcas-suggestion-product .dgwt-wcas-st .dgwt-wcas-st-title,
.dgwt-wcas-suggestion-product .dgwt-wcas-st .dgwt-wcas-sku {
  display: block !important;
  width: 100%;
  white-space: normal !important;
}

.dgwt-wcas-suggestion-product .dgwt-wcas-sku {
  margin: 0;
  line-height: 1.25;
  opacity: 0.78;
}

.dgwt-wcas-sp .en-fibo-price-stack,
.dgwt-wcas-pd-price .en-fibo-price-stack,
.dgwt-wcas-tpd-price .en-fibo-price-stack {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.dgwt-wcas-sp .en-fibo-price-line,
.dgwt-wcas-pd-price .en-fibo-price-line,
.dgwt-wcas-tpd-price .en-fibo-price-line {
  display: flex;
  gap: 6px;
  align-items: baseline;
  line-height: 1.25;
}

.dgwt-wcas-sp .en-fibo-price-line {
  justify-content: flex-end;
}

.dgwt-wcas-pd-price .en-fibo-price-line,
.dgwt-wcas-tpd-price .en-fibo-price-line {
  justify-content: flex-start;
}

.en-fibo-price-line .en-fibo-price-label {
  font-size: 1em;
  opacity: 0.78;
}

.en-fibo-price-line .en-fibo-price-amount {
  font-size: 1em;
}

.en-fibo-price-line--ex {
  font-size: 0.8em;
}

.en-fibo-price-line--inc {
  font-size: 0.6em;
}

.en-fibo-price-line--ex .en-fibo-price-amount {
  font-weight: 700;
}

.en-fibo-price-line--inc .en-fibo-price-amount,
.en-fibo-price-line--inc .en-fibo-price-label {
  font-weight: 500;
  opacity: 0.88;
}

/* ---------- Header search expansion ---------- */
@media (min-width: 850px) {
  .hide-for-medium .header-nav-main,
  .hide-for-medium .header-search-form,
  .hide-for-medium .header-search-form .header-search-form-wrapper {
    overflow: visible !important;
  }

  .hide-for-medium .header-nav-main {
    width: 100% !important;
  }

  .hide-for-medium .header-search-form {
    --en-fibo-right-gap: 20px;
    --en-fibo-open-w: clamp(560px, 70vw, 1100px);
    position: relative;
    flex: 1 1 auto;
    width: 100% !important;
    min-width: 260px;
    max-width: none !important;
    min-inline-size: 0;
    overflow: visible !important;
    z-index: 20;
  }

  .hide-for-medium .header-search-form .header-search-form-wrapper {
    position: relative;
    width: 100%;
    min-height: 40px;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: calc(100% - var(--en-fibo-right-gap)) !important;
    max-width: none !important;
    transition: width 110ms ease, transform 110ms ease;
    z-index: 2200 !important;
    will-change: width, transform;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp .dgwt-wcas-suggestions-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp .dgwt-wcas-details-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-suggestions-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-details-wrapp {
    z-index: 2201 !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp .dgwt-wcas-suggestions-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp.dgwt-wcas-is-detail-box .dgwt-wcas-suggestions-wrapp {
    max-width: none !important;
  }

  .hide-for-medium .header-search-form:focus-within .dgwt-wcas-search-wrapp,
  .hide-for-medium .header-search-form.en-fibo-expanded .dgwt-wcas-search-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp.dgwt-wcas-active,
  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp.dgwt-wcas-search-focused {
    width: min(var(--en-fibo-open-w), calc(100vw - 24px - var(--en-fibo-right-gap))) !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-form,
  .hide-for-medium .header-search-form .dgwt-wcas-sf-wrapp,
  .hide-for-medium .header-search-form .dgwt-wcas-search-input {
    width: 100% !important;
    max-width: none !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-form,
  .hide-for-medium .header-search-form .dgwt-wcas-sf-wrapp {
    transition: width 110ms ease !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-input {
    display: block !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    transition: width 110ms ease !important;
  }

  .hide-for-medium .header-search-form.en-fibo-expanded .dgwt-wcas-search-wrapp,
  .hide-for-medium .header-search-form.en-fibo-expanded .dgwt-wcas-search-form,
  .hide-for-medium .header-search-form.en-fibo-expanded .dgwt-wcas-sf-wrapp,
  .hide-for-medium .header-search-form.en-fibo-expanded .dgwt-wcas-search-input {
    transition-duration: 0ms !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp.dgwt-wcas-search-darkoverl-on .dgwt-wcas-search-form {
    background-color: transparent !important;
  }

  .hide-for-medium .header-search-form .dgwt-wcas-search-input:focus {
    box-shadow: none !important;
  }

  .dgwt-wcas-darkened-overlay {
    display: none !important;
  }

  body.en-fibo-header-active::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    pointer-events: none;
    z-index: 1100;
  }

  body.en-fibo-header-active #header {
    position: relative;
    z-index: 1300 !important;
  }

  body.en-fibo-header-active .header-wrapper {
    z-index: 1300 !important;
  }

  body.en-fibo-header-active .header-wrapper:not(.stuck) {
    position: relative;
  }

  body.en-fibo-header-active .header-wrapper.stuck {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
  }

  body.en-fibo-header-active .header-main,
  body.en-fibo-header-active .header-bottom {
    position: relative;
  }

  body.en-fibo-header-active .header-main::before,
  body.en-fibo-header-active .header-bottom::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    pointer-events: none;
    z-index: 1305;
  }

  body.en-fibo-header-active .header-main .header-inner,
  body.en-fibo-header-active .header-bottom .container {
    position: relative;
    z-index: 1306;
  }

  body.en-fibo-header-active .flex-col.hide-for-medium.flex-left.flex-grow,
  body.en-fibo-header-active .flex-col.hide-for-medium.flex-left.flex-grow .header-nav-main.nav-left,
  body.en-fibo-header-active .hide-for-medium .header-search-form,
  body.en-fibo-header-active .hide-for-medium .header-search-form .header-search-form-wrapper {
    position: relative;
    z-index: 1405 !important;
  }

  body.en-fibo-header-active .header-main .flex-col.hide-for-medium.flex-right,
  body.en-fibo-header-active .header-main .header-nav.nav-right {
    position: relative;
    z-index: 1300 !important;
  }

  body.en-fibo-header-active .hide-for-medium .header-search-form,
  body.en-fibo-header-active .hide-for-medium .header-search-form .dgwt-wcas-search-wrapp,
  body.en-fibo-header-active .hide-for-medium .header-search-form .dgwt-wcas-suggestions-wrapp,
  body.en-fibo-header-active .hide-for-medium .header-search-form .dgwt-wcas-details-wrapp,
  body.en-fibo-header-active .dgwt-wcas-suggestions-wrapp,
  body.en-fibo-header-active .dgwt-wcas-details-wrapp {
    z-index: 2201 !important;
  }

  /* Sticky header state: guarantee search layer remains above right-side menu/cart links. */
  .header-wrapper.stuck,
  .header-wrapper.stuck #masthead,
  .header-wrapper.stuck .header-main,
  .header-wrapper.stuck .header-inner,
  .header-wrapper.stuck .header-nav-main,
  .header-wrapper.stuck .header-search-form,
  .header-wrapper.stuck .header-search-form .header-search-form-wrapper {
    overflow: visible !important;
  }

  .header-wrapper.stuck .header-main .flex-col.hide-for-medium.flex-left.flex-grow,
  .header-wrapper.stuck .header-main .header-nav.nav-left,
  .header-wrapper.stuck .header-main .header-search-form,
  .header-wrapper.stuck .header-main .header-search-form .header-search-form-wrapper {
    position: relative;
    z-index: 4600 !important;
  }

  .header-wrapper.stuck .header-main .header-search-form {
    --en-fibo-right-gap: clamp(28px, 2.5vw, 48px);
  }

  .header-wrapper.stuck .header-main .header-search-form .dgwt-wcas-search-wrapp {
    position: absolute !important;
    z-index: 4600 !important;
  }

  .header-wrapper.stuck .header-main .header-search-form .dgwt-wcas-suggestions-wrapp,
  .header-wrapper.stuck .header-main .header-search-form .dgwt-wcas-details-wrapp {
    z-index: 4601 !important;
  }

  .header-wrapper.stuck .header-main .flex-col.hide-for-medium.flex-left.flex-grow {
    min-width: 0;
  }

  .header-wrapper.stuck .header-main .flex-col.hide-for-medium.flex-right,
  .header-wrapper.stuck .header-main .header-nav.nav-right {
    position: relative;
    z-index: 4300 !important;
  }
}

/* ---------- Details image fit ---------- */
.dgwt-wcas-details-main-image {
  min-height: 220px;
  height: clamp(220px, 28vh, 320px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.dgwt-wcas-details-main-image img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center center;
  padding: 8px;
}