/* Thrive Shop Styles */
:root {
  /* Brand primary (from logo): orange */
  --ts-primary: #d77735;            /* main */
  --ts-primary-contrast: #ffffff;   /* text on primary */
  --ts-primary-border: #d7773566;   /* 40% */
  --ts-primary-soft: #f9ecdf;       /* soft background */
  --ts-primary-soft-2: #f5e0cc;     /* hover soft */
}

.thrive-shop-filters {
  display: grid !important; /* vence flex do tema */
  grid-auto-flow: row !important;
  grid-template-columns: 1fr !important; /* sempre 1 coluna */
  column-count: 1 !important; /* anula multi-colunas do tema */
  gap: 20px;
  align-items: start;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 16px 0;
  background: var(--ts-primary-soft);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 24px;
  box-sizing: border-box;
}
.thrive-shop-filters > * { grid-column: 1 / -1; } /* todos os filhos ocupam a largura inteira */
.thrive-shop-filters .ts-search { order: 1; }
.thrive-shop-filters .ts-category { order: 2; }
.thrive-shop-filters .ts-actions { order: 3; }

/* Neutraliza colunas/flutuadores do tema dentro do bloco de filtros */
.thrive-shop-filters > *,
.thrive-shop-filters .ts-field,
.thrive-shop-filters .ts-actions,
.thrive-shop-filters .ts-category,
.thrive-shop-filters .ts-search {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  clear: both !important;
  flex: none !important;        /* anula flex items do tema */
  align-self: auto !important;  /* anula alinhamentos estranhos */
}

.thrive-shop-filters .ts-label {
  width: 100%;
  font-size: 12px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 6px;
}

.thrive-shop-filters input[type="text"],
.thrive-shop-filters select {
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
}

.thrive-shop-filters .ts-field { width: 100%; }
.thrive-shop-filters .ts-search input { width: 100%; max-width: 520px; }
.thrive-shop-filters .ts-search { position: relative; display: flex; align-items: center; gap: 10px; }
.thrive-shop-filters .ts-search input { padding-left: 14px; flex: 1 1 auto; }
.thrive-shop-filters .ts-search-apply {
  background: var(--ts-primary);
  color: var(--ts-primary-contrast);
  border: none;
  border-radius: 8px;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
}
.thrive-shop-filters .ts-search-apply:hover { background: #c4672b; }
.thrive-shop-filters .ts-category { width: 100%; padding-top: 4px; border-top: 0; }
.thrive-shop-filters .ts-category .ts-megamenu { margin-top: 2px; width: 100%; }
.thrive-shop-filters .ts-actions { display: flex; justify-content: flex-start; }
.thrive-shop-filters .ts-actions button { width: 100%; }

@media (min-width: 768px) {
  .thrive-shop-filters { grid-template-columns: 1fr; gap: 24px; }
  .thrive-shop-filters .ts-actions { justify-content: flex-end; align-self: end; }
  .thrive-shop-filters .ts-actions button { width: auto; }
}

.thrive-shop-filters .ts-actions button {
  width: 100%;
  background: var(--ts-primary);
  color: var(--ts-primary-contrast);
  border: none;
  border-radius: 8px;
  padding: 12px 18px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 0 rgba(0,0,0,.05);
  transition: background .15s ease, transform .05s ease;
}

.thrive-shop-filters .ts-actions button:hover,
.thrive-shop-filters .ts-actions button:focus {
  background: #c4672b;
}

.thrive-shop-filters .ts-actions button:active { transform: translateY(1px); }

.ts-cat-picker-btn {
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
  min-width: 240px;
  text-align: left;
  cursor: pointer;
}

.ts-cat-panel {
  position: absolute;
  z-index: 999;
  top: calc(100% + 6px);
  left: 0;
  width: min(340px, 90vw);
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: 0 10px 20px rgba(2, 8, 23, 0.08);
  padding: 8px;
}

.ts-cat-panel-header { display: flex; gap: 6px; margin-bottom: 8px; }
.ts-cat-panel-header .ts-cat-search {
  flex: 1;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.ts-cat-panel-header .ts-cat-clear {
  padding: 8px 10px;
  background: #f1f5f9;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
}

.ts-cat-groups { max-height: 320px; overflow: auto; display: grid; gap: 8px; }
.ts-cat-group { padding: 6px; border: 1px solid #f1f5f9; border-radius: 6px; }

.ts-parent-row { margin-bottom: 6px; }

.ts-cat-option { background: transparent; border: none; padding: 6px 8px; cursor: pointer; border-radius: 6px; }

.ts-cat-option:hover { background: #f8fafc; }

.ts-parent { font-weight: 700; }

.ts-children { margin: 0; padding-left: 12px; list-style: none; display: grid; gap: 2px; }

/* Mega-menu (mode both) */
.ts-megamenu { position: relative; display: block; width: 100%; }

.ts-megamenu .ts-label { display: block; font-size: 12px; color: #475569; margin-bottom: 6px; }

.thrive-shop-filters .ts-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 8px; /* compacto */
  padding: 0;
  margin: 4px 0 0;
  list-style: none;
  align-items: flex-start; /* evita esticar itens quando submenu abre */
}

.ts-menu-item { position: relative; padding-bottom: 8px; }

.thrive-shop-filters .ts-menu .ts-menu-item .ts-menu-btn {
  padding: 6px 10px; /* compacto */
  border-radius: 999px;
  border: 1px solid var(--ts-primary-border);
  background: #ffffff; /* pílulas brancas */
  color: #3a2f28;
  font-size: 13px; /* compacto */
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Visual highlight for selected parent without opening submenu */
.thrive-shop-filters .ts-menu .ts-menu-item > .ts-menu-btn.is-picked {
  background: var(--ts-primary-soft);
  border-color: var(--ts-primary) !important;
  color: #3a2f28;
  box-shadow: 0 0 0 2px #d7773526; /* subtle ring */
}
/* removed checkmark icon for picked parent */

.thrive-shop-filters .ts-menu .ts-menu-item .ts-menu-btn:hover {
  background: var(--ts-primary-soft-2);
  border-color: var(--ts-primary-border);
  color: #3a2f28;
}

.thrive-shop-filters .ts-menu .ts-menu-item.is-active > .ts-menu-btn {
  background: var(--ts-primary);
  color: var(--ts-primary-contrast);
  border-color: var(--ts-primary);
  box-shadow: 0 1px 0 rgba(215,119,53,.25);
}

.thrive-shop-filters .ts-menu-item:hover > .ts-submenu,
.thrive-shop-filters .ts-menu-item:focus-within > .ts-submenu,
.thrive-shop-filters .ts-menu-item.is-active > .ts-submenu { display: block !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }

/* When we intentionally close via click, temporarily suppress hover-open */
.thrive-shop-filters.is-closing .ts-menu-item:hover > .ts-submenu { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }

/* If a parent item is marked to suppress hover (until mouse leaves), never show its submenu */
.thrive-shop-filters .ts-menu-item.suppress-hover:hover > .ts-submenu,
.thrive-shop-filters .ts-menu-item.suppress-hover:focus-within > .ts-submenu,
.thrive-shop-filters .ts-menu-item.suppress-hover > .ts-submenu {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.thrive-shop-filters .ts-menu-item:hover > .ts-submenu,
.thrive-shop-filters .ts-menu-item:focus-within > .ts-submenu,
.thrive-shop-filters .ts-menu-item.is-active > .ts-submenu { display: block !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }

.thrive-shop-filters .ts-submenu-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
  background: rgba(255, 255, 255, 0.92); /* subtle panel behind buttons */
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(2, 8, 23, 0.08);
  padding: 10px;
}

.thrive-shop-filters .ts-submenu {
  position: absolute !important; /* garante flutuante, sem empurrar layout */
  left: 0;
  top: 100%; /* encostado no pai */
  min-width: 360px;
  max-width: 680px;
  z-index: 20;
  background: transparent !important; /* sem fundo atrás dos botões */
  border: none !important;
  box-shadow: none !important;
  color: #3a2f28;
  line-height: 1.35;
  cursor: pointer;
  text-align: left;
}

.thrive-shop-filters .ts-submenu-item {
  padding: 6px 10px; /* match category pill */
  border: 1px solid var(--ts-primary-border);
  border-radius: 999px; /* match pill shape */
  background: #ffffff !important; /* white like category pill */
  color: #3a2f28;
  font-size: 13px; /* match category pill */
  line-height: 1.2; /* match category pill */
  cursor: pointer;
  text-align: left;
  display: inline-flex; /* align like pills */
  align-items: center;
  gap: 6px;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.thrive-shop-filters .ts-submenu-item:hover {
  background: #f7f7f7 !important; /* neutro claro */
  border-color: #e7d2c4 !important; /* borde suave na paleta */
}
.thrive-shop-filters .ts-submenu-item.is-picked { /* selected subcategory (visual only) */
  background: var(--ts-primary-soft);
  border-color: var(--ts-primary) !important;
  box-shadow: 0 0 0 2px #d7773526;
}
/* removed checkmark icon for picked subcategory */
.thrive-shop-filters .ts-submenu-item.is-active,
.thrive-shop-filters .ts-submenu-item.is-active:hover {
  background: var(--ts-primary);
  border-color: var(--ts-primary);
  color: var(--ts-primary-contrast);
}
.ts-submenu-item.is-active:hover { background: var(--ts-primary); color: var(--ts-primary-contrast); border-color: var(--ts-primary); }
.ts-note { color: #64748b; font-size: 12px; }

/* Category disclaimer note (smaller, no bottom margin) */
.thrive-shop-filters .ts-filter-note {
  font-size: 13px;
  color: #000;
  margin: 2px 0 0 0; /* only top margin */
}

/* Price disclaimer in cards */
.ts-price-note {
  margin: 6px 0 0;
  font-size: 11px;
  color: #64748b;
}

/* Search status text (above results) */
#thrive-shop-status {
  font-size: 12px;
  color: #000;
  margin: 0 0 8px; /* space below */
  font-weight: 500; /* neutral while searching */
}
#thrive-shop-status.is-done { font-weight: 700; }

/* Mobile: make submenu behave like accordion */
@media (max-width: 1024px) {
  /* stack filters vertically: Search -> Filter -> Categories (reduced spacing) */
  .thrive-shop-filters { display: flex; flex-direction: column; gap: 4px; }
  .thrive-shop-filters .ts-search { order: 1; }
  /* make search input full width on mobile */
  .thrive-shop-filters .ts-search input { width: 100% !important; max-width: 100% !important; flex: 1 1 auto; }
  .ts-actions-mobile { order: 2; }
  .thrive-shop-filters .ts-category { order: 3; }
  .thrive-shop-filters .ts-submenu { position: static; box-shadow: none; border: none; padding: 6px 0; display: none !important; opacity: 0 !important; visibility: hidden !important; transform: none; pointer-events: none !important; }
  .thrive-shop-filters .ts-menu-item.is-active > .ts-submenu { display: block !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }
  .thrive-shop-filters .ts-menu-item.is-open-mobile > .ts-submenu { display: block !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; }
  /* tighter vertical spacing between categories on mobile */
  .thrive-shop-filters .ts-menu { gap: 2px; }
  .thrive-shop-filters .ts-menu .ts-menu-item { padding-bottom: 2px; }
  /* tighter vertical spacing inside submenu on mobile */
  .thrive-shop-filters .ts-submenu-grid { gap: 8px; padding: 12px; }
  .thrive-shop-filters .ts-submenu-item { padding: 7px 12px; line-height: 1.25; }
  /* move Filter button below categories on mobile */
  .thrive-shop-filters .ts-search-apply { display: none; }
  .ts-actions-mobile { display: block !important; margin-top: 4px; }
  /* small top margin for heads-up note on mobile */
  .thrive-shop-filters .ts-filter-note { margin: 10px 0 -10px 0; } /* larger top, zero bottom on mobile */
  .ts-actions-mobile .ts-filter-apply-mobile {
    width: 100%;
    background: var(--ts-primary);
    color: var(--ts-primary-contrast);
    border: none;
    border-radius: 8px;
    padding: 12px 16px;
    font-weight: 700;
  }
  
  /* darker card border on mobile for better contrast */
  .thrive-product-item {
    border-color: #d1d5db !important;
  }
}

/* desktop: hide mobile actions only on larger screens */
@media (min-width: 1025px) {
  .ts-actions-mobile { display: none !important; }
}

/* Product CTA uses brand color with high specificity */
.thrive-product-item a.button,
.thrive-product-item .button,
.thrive-shop-grid .thrive-product-item .button { background: var(--ts-primary) !important; color: var(--ts-primary-contrast) !important; border-color: var(--ts-primary) !important; }
.thrive-product-item a.button:hover,
.thrive-product-item .button:hover,
.thrive-shop-grid .thrive-product-item .button:hover { background: #c4672b !important; border-color: #c4672b !important; color: #fff !important; }

/* Pills child area preview animation */
.ts-children-wrap { transition: opacity .15s ease, transform .15s ease; }
.ts-children-wrap.is-preview { opacity: .85; transform: translateY(2px); }

.thrive-shop-grid {
  display: grid !important; /* override theme layouts */
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
  margin-bottom: 15px;
  float: none !important;         /* neutralize floats */
  column-count: 1 !important;     /* neutralize multi-column containers */
  columns: auto !important;       /* prevent columns from reordering */
  clear: both !important;         /* ensure new block formatting context */
}

/* Ensure items don't break across columns (if any) and keep DOM order */
.thrive-shop-grid .thrive-product-item {
  break-inside: avoid !important;
  -webkit-column-break-inside: avoid !important;
  page-break-inside: avoid !important;
}

/* Final guard: when form is closing, never show submenus even if later hover rules exist */
.thrive-shop-filters.is-closing .ts-menu-item:hover > .ts-submenu,
.thrive-shop-filters.is-closing .ts-submenu {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.thrive-product-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* product description spacing */
.thrive-product-item .desc { 
  margin-bottom: 5px;
  font-size: 13px;
  line-height: 1.8;
  margin-bottom: 0;
}

.thrive-product-item .thumb img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

.thrive-product-item .title {
  font-size: 13px;
  margin: 0 !important; /* remove extra spacing above/below title */
}

.thrive-product-item .store {
  align-self: flex-start;
  font-size: 12px;
  background: #f1f5f9;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 2px 8px;
}

.thrive-product-item .prices {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.thrive-product-item .price-old {
  color: #94a3b8;
  text-decoration: line-through;
}

.thrive-product-item .price-current {
  color: #16a34a;
  font-weight: 700;
}

/* Price disclaimer */
.thrive-product-item .price-disclaimer {
  margin: 4px 0 0 0;
  color: #6b7280;
  font-style: italic;
  line-height: 1.2;
}
.thrive-product-item .price-disclaimer small {
  font-size: 11px;
}

.thrive-product-item .button {
  margin-top: auto;
  display: inline-block;
  padding: 10px 14px;
  background: #22c55e;
  color: #fff;
  text-align: center;
  text-decoration: none;
  border-radius: 6px;
  transition: background 0.2s ease-in-out;
}

.thrive-product-item .button:hover {
  background: #16a34a;
}

.thrive-shop-pagination ul {
  list-style: none;
  display: flex;
  gap: 6px;
  padding: 0;
}

.thrive-shop-pagination a,
.thrive-shop-pagination span {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

/* Hide pagination UI when infinite scroll is active */
#thrive-shop-results.ts-infinite .thrive-shop-pagination { display: none; }

/* Loading states */
#thrive-shop-results .ts-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

#thrive-shop-results .ts-loading.more { padding: 14px; }

.ts-spinner {
  width: 24px;
  height: 24px;
  border: 3px solid #e5e7eb;
  border-top-color: var(--ts-primary);
  border-radius: 50%;
  animation: ts-spin 0.8s linear infinite;
}

@keyframes ts-spin {
  to { transform: rotate(360deg); }
}
