/*
Theme Name: Blocksy Child
Template: blocksy
Version: 2.0.0
*/

/* ══════════════════════════════════════════════════════
   LO TENGO ECOMMERCE — Design System v2
   Amarillo: #FFFF00  |  Violeta: #8040E8
   ══════════════════════════════════════════════════════ */

:root {
  --lt-yellow:       #FFFF00;
  --lt-violet:       #8040E8;
  --lt-violet-dark:  #6030C0;
  --lt-violet-light: #F0EAFF;
  --lt-bg:           #F5F5F5;
  --lt-white:        #FFFFFF;
  --lt-text:         #1A1A1A;
  --lt-text-muted:   #666666;
  --lt-border:       #E8E8E8;
  --lt-radius:       6px;
  --lt-shadow:       0 1px 4px rgba(0,0,0,.10);
  --lt-shadow-hover: 0 4px 16px rgba(128,64,232,.18);
}

body {
  background: var(--lt-bg) !important;
  color: var(--lt-text) !important;
}

/* ══════════════════════════════════════════════════════
   HEADER
   Blocksy Customizer tiene: altura 76px, fondo #FFFF00,
   sticky standard (sin shrink). Solo agregamos:
   - sticky background override (Blocksy default = gris)
   - iconos violeta sobre amarillo
   - barra de búsqueda estilo ML
   ══════════════════════════════════════════════════════ */

/* Sticky: mantener amarillo (Blocksy default = gris palette-8) */
[data-header*="type-1"] .ct-header [data-sticky*="yes"] [data-row*="middle"] {
  background-color: #FFFF00 !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.12) !important;
}

/* Ocultar título del sitio (solo logo) */
.site-branding .site-title,
.site-branding .site-title-container,
.site-branding .site-description {
  display: none !important;
}

/* Íconos: violeta sobre amarillo */
[data-row*="middle"] svg,
[data-row*="middle"] .ct-icon {
  color: var(--lt-violet) !important;
}
[data-id="cart"] .count,
.ct-cart-content .cart-count-wrapper {
  background: var(--lt-violet) !important;
  color: #fff !important;
}

/* Search toggle: barra ML */
[data-row*="middle"] .ct-header-search.ct-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: #fff !important;
  border: 2px solid var(--lt-violet) !important;
  border-radius: 4px !important;
  padding: 8px 16px !important;
  width: 100% !important;
  max-width: 560px !important;
  cursor: text !important;
}
[data-row*="middle"] .ct-header-search.ct-toggle svg {
  color: var(--lt-violet) !important;
  flex-shrink: 0 !important;
}
[data-row*="middle"] .ct-header-search.ct-toggle .ct-label { display: none !important; }
[data-row*="middle"] .ct-header-search.ct-toggle::after {
  content: "Buscar en LO TENGO..." !important;
  color: #aaa !important;
  font-size: 15px !important;
  flex: 1 !important;
  text-align: left !important;
}

/* Search modal */
#search-modal { background: rgba(0,0,0,.5) !important; }
#search-modal .ct-search-form { background: #fff !important; border-radius: 4px !important; }

/* ══════════════════════════════════════════════════════
   BARRA DE CATEGORÍAS (PHP hook)
   ══════════════════════════════════════════════════════ */
#lt-cat-nav {
  background: var(--lt-violet);
  width: 100%;
  position: relative;
  z-index: 99;
  display: flex;
  justify-content: center;
}
.lt-cat-nav-inner {
  display: flex;
  align-items: center;
  max-width: 1290px;
  width: 100%;
  padding: 0 20px;
  overflow-x: auto;
  scrollbar-width: none;
}
.lt-cat-nav-inner::-webkit-scrollbar { display: none; }
.lt-cat-link {
  color: #fff !important;
  font-size: 13px;
  font-weight: 500;
  padding: 13px 16px;
  white-space: nowrap;
  text-decoration: none !important;
  display: inline-block;
  transition: color .15s, background .15s;
}
.lt-cat-link:hover {
  color: var(--lt-yellow) !important;
  background: rgba(255,255,255,.08);
}
@media (max-width: 767px) {
  #lt-cat-nav { justify-content: flex-start; }
  .lt-cat-link { padding: 10px 12px; font-size: 12px; }
}

/* ══════════════════════════════════════════════════════
   HERO SECTION — ocultar en tienda/categorías/producto
   ══════════════════════════════════════════════════════ */
body.tax-product_cat .hero-section,
body.post-type-archive-product .hero-section,
body.single-product .hero-section,
[data-prefix="woo_categories"] .hero-section,
[data-prefix="woo_listing"] .hero-section,
[data-prefix="product"] .hero-section {
  display: none !important;
}
body.tax-product_cat .woocommerce-products-header,
body.post-type-archive-product .woocommerce-products-header,
body.single-product .woocommerce-products-header {
  display: none !important;
}
body.tax-product_cat .ct-container[data-vertical-spacing],
body.post-type-archive-product .ct-container[data-vertical-spacing] {
  --theme-content-vertical-spacing: 16px !important;
  padding-top: 16px !important;
}
body.single-product .ct-container[data-vertical-spacing] {
  --theme-content-vertical-spacing: 24px !important;
  padding-top: 24px !important;
}

/* ══════════════════════════════════════════════════════
   SHOP — grid de productos
   ══════════════════════════════════════════════════════ */
body.woocommerce-shop,
body.woocommerce-page,
body.post-type-archive-product,
body.tax-product_cat {
  background: var(--lt-bg) !important;
}
ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
ul.products li.product {
  background: var(--lt-white) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: var(--lt-radius) !important;
  box-shadow: var(--lt-shadow) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transition: box-shadow .2s, transform .2s !important;
}
ul.products li.product:hover {
  box-shadow: var(--lt-shadow-hover) !important;
  transform: translateY(-2px) !important;
}
ul.products li.product img {
  width: 100% !important;
  height: 200px !important;
  object-fit: contain !important;
  background: var(--lt-white) !important;
  padding: 12px !important;
  display: block !important;
}
ul.products li.product .woocommerce-loop-product__title {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--lt-text) !important;
  padding: 8px 12px 4px !important;
  margin: 0 !important;
  line-height: 1.4 !important;
  flex: 1 !important;
}
ul.products li.product .price {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--lt-text) !important;
  padding: 4px 12px 8px !important;
  display: block !important;
}
ul.products li.product .price ins { text-decoration: none !important; }
ul.products li.product .price del {
  font-size: 13px !important;
  color: var(--lt-text-muted) !important;
  font-weight: 400 !important;
}
ul.products li.product .onsale {
  background: var(--lt-violet) !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 3px 7px !important;
  top: 10px !important; left: 10px !important; right: auto !important; margin: 0 !important;
}
ul.products li.product .add_to_cart_button,
ul.products li.product a.button,
ul.products li.product button.button {
  display: block !important;
  width: calc(100% - 24px) !important;
  margin: 0 12px 12px !important;
  background: var(--lt-violet) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--lt-radius) !important;
  padding: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: background .2s !important;
  text-decoration: none !important;
}
ul.products li.product .add_to_cart_button:hover,
ul.products li.product a.button:hover {
  background: var(--lt-violet-dark) !important;
  color: #fff !important;
}

/* ══════════════════════════════════════════════════════
   SINGLE PRODUCT
   ══════════════════════════════════════════════════════ */
.single-product div.product {
  background: var(--lt-white) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: var(--lt-radius) !important;
  padding: 24px !important;
}
.single-product .single_add_to_cart_button,
.single-product .single_add_to_cart_button.button {
  background: var(--lt-violet) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--lt-radius) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 14px 32px !important;
  transition: background .2s !important;
}
.single-product .single_add_to_cart_button:hover { background: var(--lt-violet-dark) !important; }

/* ══════════════════════════════════════════════════════
   SIDEBAR, BREADCRUMBS, PAGINACIÓN
   ══════════════════════════════════════════════════════ */
.ct-sidebar {
  background: var(--lt-white) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: var(--lt-radius) !important;
  padding: 20px !important;
}
.ct-sidebar .widget-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-bottom: 2px solid var(--lt-violet) !important;
  padding-bottom: 8px !important;
  margin-bottom: 14px !important;
}
.ct-sidebar ul li a { color: var(--lt-text) !important; }
.ct-sidebar ul li a:hover { color: var(--lt-violet) !important; }
.ct-sidebar .current-cat > a { color: var(--lt-violet) !important; font-weight: 700 !important; }
.price_slider_wrapper .ui-slider-range { background: var(--lt-violet) !important; }
.price_slider_wrapper .ui-slider-handle { background: var(--lt-violet) !important; }
.woocommerce-breadcrumb { background: transparent !important; font-size: 13px !important; color: var(--lt-text-muted) !important; }
.woocommerce-breadcrumb a { color: var(--lt-violet) !important; }
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span { border: 1px solid var(--lt-border) !important; color: var(--lt-violet) !important; border-radius: 4px !important; }
.woocommerce-pagination ul li span.current { background: var(--lt-violet) !important; color: #fff !important; border-color: var(--lt-violet) !important; font-weight: 700 !important; }
.woocommerce-pagination ul li a:hover { background: var(--lt-violet-light) !important; }

/* ══════════════════════════════════════════════════════
   BOTONES WOOCOMMERCE GLOBAL
   ══════════════════════════════════════════════════════ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--lt-violet) !important;
  color: #fff !important;
  border-radius: var(--lt-radius) !important;
  font-weight: 700 !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover { background: var(--lt-violet-dark) !important; color: #fff !important; }
.woocommerce #payment #place_order { background: var(--lt-violet) !important; font-size: 16px !important; font-weight: 700 !important; }

/* ══════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════ */
.ct-footer { background: var(--lt-violet) !important; color: rgba(255,255,255,.85) !important; }
.ct-footer a { color: rgba(255,255,255,.75) !important; }
.ct-footer a:hover { color: var(--lt-yellow) !important; }
.ct-footer .widget-title { color: var(--lt-yellow) !important; }
.ct-footer-copyright,
.ct-footer-copyright-area {
  background: var(--lt-violet-dark) !important;
  color: rgba(255,255,255,.5) !important;
  font-size: 12px !important;
  padding: 14px 0 !important;
}
.ct-footer-copyright a[href*="creativethemes"],
.ct-footer-copyright a[href*="wordpress.org"] { display: none !important; }

/* ══════════════════════════════════════════════════════
   LOGO
   ══════════════════════════════════════════════════════ */
.site-logo-container img { max-height: 60px !important; width: auto !important; }
@media (max-width: 999px) { .site-logo-container img { max-height: 44px !important; } }

/* ══════════════════════════════════════════════════════
   MOBILE
   ══════════════════════════════════════════════════════ */
@media (max-width: 999px) {
  ul.products { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important; gap: 8px !important; }
  ul.products li.product img { height: 160px !important; }
}
@media (max-width: 480px) {
  ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
}

/* ══════════════════════════════════════════════════════
   MENSAJES WOO
   ══════════════════════════════════════════════════════ */
.woocommerce-message { border-top-color: var(--lt-violet) !important; }
.woocommerce-message::before { color: var(--lt-violet) !important; }
.woocommerce-info { border-top-color: var(--lt-violet) !important; }