/* Estilos front para Woop Dropshipping */
.woopds-buscador { position: relative; max-width: 860px; }

/* ---- Toolbar (categorías + buscador) ---- */
.woopds-toolbar {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 10px;
  align-items: center;
}

.woopds-cat-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  line-height: 1;
  user-select: none;
}

.woopds-cat-toggle:hover { background: #f9fafb; }

.woopds-cat-icon svg rect { fill: #111827; transition: transform .2s ease; }
.woopds-cat-toggle.is-open .woopds-cat-icon svg { transform: rotate(90deg); }

.woopds-input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 16px;
  outline: none;
}
.woopds-input:focus {
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px rgba(79,70,229,0.12);
}

/* ---- Sugerencias búsqueda ---- */
.woopds-suggestions {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  z-index: 50;
  display: none;
  overflow: hidden;
}
.woopds-suggestions.is-visible { display: block; }

.woopds-suggestion {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  text-decoration: none;
  color: #111827;
  border-bottom: 1px solid #f3f4f6;
}
.woopds-suggestion:last-child { border-bottom: none; }
.woopds-suggestion img {
  width: 44px; height: 44px; object-fit: cover; border-radius: 6px; background: #f3f4f6;
}
.woopds-suggestion span {
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px;
}
.woopds-view-all {
  display: block; padding: 10px 12px; text-align: center; text-decoration: none; font-weight: 600;
}

/* ---- Categorías dropdown ---- */
.woopds-categories {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  z-index: 51; /* por encima de .woopds-suggestions */
  display: none;
  overflow: hidden;
}
.woopds-categories.is-visible { display: block; }

.woopds-cat-item {
  display: block;
  padding: 11px 14px;
  text-decoration: none;
  color: #111827;
  border-bottom: 1px solid #f3f4f6;
}
.woopds-cat-item:last-child { border-bottom: none; }
.woopds-cat-item:hover { background: #f9fafb; }

.woopds-cat-empty { padding: 12px 14px; color: #6b7280; font-size: 14px; }

/* === WoopCatBlock · estilos para Divi === */
.et_pb_row_woopcb_top, .et_pb_row_woopcb_products{width:100%;max-width:100%}
.et_pb_row_woopcb_products{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.et_pb_row_woopcb_top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
@media (max-width: 980px){
  .et_pb_row_woopcb_products{grid-template-columns:repeat(3,minmax(0,1fr))}
  .et_pb_row_woopcb_top{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .et_pb_row_woopcb_products{grid-template-columns:repeat(2,minmax(0,1fr))}
  .et_pb_row_woopcb_top{grid-template-columns:1fr}
}
.woopcb_prod_link, .woopcb_sub_link{position:relative;display:block}
.woopcb_price, .woopcb_chip{position:absolute;left:12px;bottom:12px;background:#fff;border-radius:999px;padding:6px 10px;font-weight:700;font-size:.9rem;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.et_pb_image_woopcb_prod .et_pb_image_wrap, .et_pb_image_woopcb_sub .et_pb_image_wrap{display:block;overflow:hidden;border-radius:18px;background:#f6f8fb}
.et_pb_image_woopcb_prod img, .et_pb_image_woopcb_sub img{width:100%;height:auto;display:block}
.et_pb_button_woopcb_btn{border-radius:12px}

/* === WoopSubcards for Divi (4 cards) === */
.et_pb_row_woopsc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;width:100%;max-width:100%}
@media (max-width: 980px){ .et_pb_row_woopsc{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 640px){ .et_pb_row_woopsc{grid-template-columns:1fr} }
.et_pb_image_woopsc .et_pb_image_wrap{display:block;overflow:hidden;border-radius:18px;background:#f6f8fb}
.et_pb_image_woopsc img{width:100%;height:auto;display:block}
.et_pb_text_woopsc_title p{margin:.6rem 0 0;font-size:1.05rem}
.et_pb_text_woopsc_desc p{margin:.25rem 0 0;color:#6b7280;font-size:.95rem}


/* === WoopTopcats (5 columns) === */
.et_pb_row_wooptc{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;width:100%;max-width:100%}
@media (max-width: 980px){ .et_pb_row_wooptc{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width: 640px){ .et_pb_row_wooptc{grid-template-columns:repeat(2,minmax(0,1fr))} }
.et_pb_image_wooptc .et_pb_image_wrap{display:block;overflow:hidden;border-radius:18px;background:#f6f8fb}
.et_pb_image_wooptc img{width:100%;height:auto;display:block}
.et_pb_text_wooptc_title p{margin:.6rem 0 0;font-size:1.05rem}
.et_pb_text_wooptc_desc p{margin:.25rem 0 0;color:#6b7280;font-size:.95rem}