/**
 * Hover preview card for the "Tessuti" mega-menu.
 *
 * The menu is capped at 80vh (theme). A text list fits that budget; inline
 * thumbnails push the tall "Materiali Naturali" column past it and force an
 * internal scrollbar on normal-height screens. So the row keeps a hidden
 * swatch that only carries the data for the hover card, and the visual preview
 * is the card shown beside the hovered row (js/tessuti-hovercard.js). Empty
 * fabrics are removed upstream in sdt_custom_views_pre_render().
 */

/* The swatch is a data holder only, not rendered inline. */
.sdt-fabric-swatch {
  display: none;
}

/* Let the hover card escape the menu wrappers. */
.tessuti-menu,
.tessuti-menu .container-tree,
.tessuti-menu .container-tree ul,
.tessuti-menu .container-tree li,
.categories-menu,
.categories-menu .container-tree,
.categories-menu .container-tree ul,
.categories-menu .container-tree li {
  overflow: visible;
}

/* --- Hover preview card (positioned beside the row by JS, viewport-fixed) */
.tessuti-hovercard {
  position: fixed;
  top: 0;
  left: 0;
  width: 236px;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e2e8f2;
  box-shadow: 0 20px 46px rgba(0, 47, 133, 0.22);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity 0.16s ease-out, transform 0.16s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 0.16s;
  pointer-events: none;
  z-index: 2147483000;
}

.tessuti-hovercard.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 0.16s ease-out, transform 0.16s cubic-bezier(0.22, 1, 0.36, 1);
}

.tessuti-hovercard__img {
  display: block;
  width: 100%;
  height: 176px;
  object-fit: cover;
  background: #f2f5fa;
}

.tessuti-hovercard__cap { padding: 13px 16px 15px; }

.tessuti-hovercard__name {
  margin: 0;
  font-family: "Parkinsans", system-ui, sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.15;
  color: #16233f;
}

.tessuti-hovercard__blurb {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: #6a7280;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 1199.98px) {
  .tessuti-hovercard { display: none; }
}