/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme — STEELCOM
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* ── Override WoodMart layout en la Steelcom Homepage ── */
body.steelcom-home-page .site-content,
body.steelcom-home-page #main,
body.steelcom-home-page .site-main {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

body.steelcom-home-page .content-area,
body.steelcom-home-page .wd-content-area {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  float: none !important;
}

/* Quitar sidebar en homepage */
body.steelcom-home-page .sidebar-area,
body.steelcom-home-page #secondary {
  display: none !important;
}

/* Quitar breadcrumbs en homepage */
body.steelcom-home-page .breadcrumbs-container,
body.steelcom-home-page .wd-breadcrumbs {
  display: none !important;
}

/* Contenedor WoodMart al 100% en homepage */
body.steelcom-home-page .container,
body.steelcom-home-page .wd-container {
  max-width: 100% !important;
  padding: 0 !important;
}

/* Color global Steelcom */
body.steelcom-home-page a:hover {
  color: #A8182A;
}

/* Override de botones WooCommerce */
body.steelcom-home-page .sc-btn-comprar:hover,
body.steelcom-home-page .sc-btn-hero:hover {
  color: #fff !important;
}

/* ══════════════════════════════════════════
   STEELCOM — Página de Producto
   Estilo coherente con el splash de diseño
   ══════════════════════════════════════════ */

/* Precio del producto — rojo STEELCOM */
.single-product .price .woocommerce-Price-amount,
.single-product .price ins .woocommerce-Price-amount {
  color: #C8102E !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
}

/* Precio tachado (precio anterior) */
.single-product .price del .woocommerce-Price-amount {
  color: #999 !important;
  font-size: 1.1rem !important;
}

/* Botón "Añadir al carrito" — estilo splash STEELCOM */
.single-product .single_add_to_cart_button,
.single-product button.single_add_to_cart_button {
  background-color: #C8102E !important;
  border-color: #C8102E !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  padding: 14px 32px !important;
  font-size: 0.95rem !important;
  transition: background-color 0.2s ease !important;
}
.single-product .single_add_to_cart_button:hover {
  background-color: #A50E26 !important;
  border-color: #A50E26 !important;
}

/* Badge de marca HELVEX — estilo splash */
.single-product .wd-attr-label,
.single-product .woocommerce-product-attributes-item--attribute_pa_marca td,
.single-product .woocommerce-product-attributes-item td {
  font-weight: 600;
  color: #242424;
}

/* Tabs de producto — estilo splash */
.single-product .wd-tabs .wd-tab-title,
.single-product .wc-tabs li a {
  font-weight: 600;
  color: #242424;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-size: 0.85rem;
}
.single-product .wd-tabs .wd-tab-title.active,
.single-product .wc-tabs li.active a {
  color: #C8102E;
  border-bottom-color: #C8102E;
}

/* Acordeón de tabs (Shipping, Product care) */
.single-product .wd-accordion-title {
  color: #242424 !important;
  font-weight: 600 !important;
}
.single-product .wd-accordion-item.active .wd-accordion-title {
  color: #C8102E !important;
}

/* Infobox promo — estilo badge del splash */
.single-product .wd-info-box-title {
  color: #C8102E !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}
.single-product .wd-info-box-wrap {
  border-left: 3px solid #C8102E !important;
  background: #fff8f8 !important;
  border-radius: 4px !important;
}

/* Breadcrumb — colores STEELCOM */
.single-product .breadcrumbs a,
.single-product .woocommerce-breadcrumb a {
  color: #666;
}
.single-product .breadcrumbs a:hover,
.single-product .woocommerce-breadcrumb a:hover {
  color: #C8102E;
}

/* Título del producto */
.single-product .product_title {
  color: #1a1a1a !important;
  font-weight: 700 !important;
}

/* SKU y meta */
.single-product .sku_wrapper,
.single-product .product_meta {
  color: #888;
  font-size: 0.85rem;
}

/* Sección de badges de confianza (debajo del botón) */
.steelcom-trust-badges {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding: 12px 0;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
.steelcom-trust-badges .badge-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #444;
}
.steelcom-trust-badges .badge-item svg {
  flex-shrink: 0;
}
.steelcom-trust-badges .badge-item span strong {
  color: #C8102E;
}

/* Tabla de atributos/especificaciones */
.single-product .woocommerce-product-attributes th {
  background: #f8f8f8;
  color: #1a1a1a;
  font-weight: 600;
  border-color: #eee;
}
.single-product .woocommerce-product-attributes td {
  color: #444;
  border-color: #eee;
}

/* Sección de productos relacionados */
.related.products h2,
.upsells.products h2 {
  color: #1a1a1a !important;
  font-weight: 700 !important;
}
.related.products h2 span,
.upsells.products h2 span {
  color: #C8102E;
}

/* Cards de productos relacionados — estilo splash */
.related.products .product-grid-item,
.upsells.products .product-grid-item {
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.07);
  transition: box-shadow 0.2s ease;
}
.related.products .product-grid-item:hover,
.upsells.products .product-grid-item:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.related.products .woocommerce-Price-amount,
.upsells.products .woocommerce-Price-amount {
  color: #C8102E !important;
  font-weight: 700 !important;
}
.related.products .wd-btn-add-to-cart,
.upsells.products .wd-btn-add-to-cart,
.related.products .button,
.upsells.products .button {
  background-color: #C8102E !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
.related.products .wd-btn-add-to-cart:hover,
.upsells.products .wd-btn-add-to-cart:hover,
.related.products .button:hover,
.upsells.products .button:hover {
  background-color: #A50E26 !important;
}

/* Ocultar textos genéricos de furniture en el product page body */
.single-product .wd-text-block h3:first-child {
  font-size: 1.1rem;
  color: #1a1a1a;
}

/* Texto de descripción de la tienda (texto block bajo el producto) */
.single-product .wd-text-block {
  border-top: 2px solid #C8102E;
  padding-top: 24px;
  margin-top: 40px;
}

/* ══════════════════════════════════════════════════════════════════
   STEELCOM — Cabecera una sola línea
   Técnica: CSS Grid + display:contents en las filas intermedias
   JS (header.js) mueve el buscador al lado del menú de navegación
   ══════════════════════════════════════════════════════════════════ */

@media (min-width: 1025px) {

  /* 1 · Ocultar barra superior (monedas, teléfono, "Contact expert") */
  .whb-top-bar { display: none !important; }

  /* 2 · Grid de 3 columnas en el contenedor principal del header */
  .whb-main-header {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    grid-template-rows: 64px !important;
    align-items: center !important;
    padding: 0 28px !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.09) !important;
  }

  /* 3 · Hacer "transparentes" al grid los contenedores intermedios
        (siguen en el DOM; sus hijos pasan a ser grid-items directos) */
  .whb-general-header,
  .whb-header-bottom,
  .whb-general-header > .container,
  .whb-header-bottom  > .container,
  .whb-general-header-inner,
  .whb-header-bottom-inner {
    display: contents !important;
  }

  /* 4 · COLUMNA 1: Logo */
  .whb-general-header .whb-col-left {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: center !important;
    padding-right: 20px !important;
  }

  .whb-general-header .whb-col-left .wd-logo img {
    max-width: 155px !important;
    height: auto !important;
  }

  /* 5 · COLUMNA 2: Menú + Buscador (JS los une en este mismo flex) */
  .whb-header-bottom .whb-col-left {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    overflow: visible !important;
    position: relative !important;
  }

  /* Ocultar la columna de búsqueda original (JS la movió) */
  .whb-general-header .whb-col-center { display: none !important; }

  /* 6 · Buscador compacto (en su nueva posición dentro del header-bottom) */
  .whb-header-bottom .whb-col-left .wd-header-search-form {
    flex: 0 0 190px !important;
    position: relative !important;
  }

  .whb-header-bottom .whb-col-left .wd-search-form .woodmart-ajax-search {
    display: flex !important;
    align-items: stretch !important;
    height: 32px !important;
  }

  .whb-header-bottom .whb-col-left .wd-search-form input.s {
    flex: 1 !important;
    height: 32px !important;
    min-width: 0 !important;
    font-size: 0.77rem !important;
    padding: 0 8px !important;
    border: 1px solid #d4d4d4 !important;
    border-right: none !important;
    border-radius: 3px 0 0 3px !important;
    background: #f6f6f6 !important;
    outline: none !important;
  }

  .whb-header-bottom .whb-col-left .wd-search-form input.s:focus {
    background: #fff !important;
    border-color: #C8102E !important;
  }

  .whb-header-bottom .whb-col-left .wd-search-form .searchsubmit {
    flex: 0 0 34px !important;
    height: 32px !important;
    width: 34px !important;
    padding: 0 !important;
    background: #C8102E !important;
    border: none !important;
    border-radius: 0 3px 3px 0 !important;
    cursor: pointer !important;
    font-size: 0 !important;
    color: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Icono de lupa en el botón de búsqueda */
  .whb-header-bottom .whb-col-left .wd-search-form .searchsubmit::after {
    content: '' !important;
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat center / contain !important;
  }

  /* Dropdown de resultados AJAX */
  .whb-header-bottom .whb-col-left .wd-search-results-wrapper {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 340px !important;
    z-index: 9999 !important;
  }

  /* 7 · COLUMNA 3: Iconos pequeños y ordenados */
  .whb-general-header .whb-col-right {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    padding-left: 14px !important;
    border-left: 1px solid #ebebeb !important;
  }

  .whb-general-header .whb-col-right .wd-tools-element {
    padding: 0 7px !important;
  }

  /* Reducir tamaño de iconos (font icons de WoodMart) */
  .whb-general-header .whb-col-right .wd-tools-icon {
    font-size: 17px !important;
    width: 17px !important;
    height: 17px !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .whb-general-header .whb-col-right .wd-tools-icon::before {
    font-size: 17px !important;
  }

  /* Ocultar texto del carrito (S/ 0.00) */
  .whb-general-header .whb-col-right .wd-tools-text { display: none !important; }

  /* Ocultar la palabra "items" del contador */
  .whb-general-header .whb-col-right .wd-tools-count > span { display: none !important; }

  /* Badge compacto del carrito */
  .whb-general-header .whb-col-right .wd-tools-count {
    font-size: 0.6rem !important;
    min-width: 14px !important;
    height: 14px !important;
    line-height: 14px !important;
    padding: 0 3px !important;
    border-radius: 7px !important;
    background: #C8102E !important;
    color: #fff !important;
  }

  /* 8 · Ocultar columnas vacías / innecesarias */
  .whb-header-bottom .whb-col-center,
  .whb-header-bottom .whb-col-right,
  .whb-general-header .whb-mobile-left,
  .whb-general-header .whb-mobile-center,
  .whb-general-header .whb-mobile-right,
  .whb-header-bottom .whb-col-mobile {
    display: none !important;
  }

  /* 9 · Menú principal: texto compacto y sin espacio extra vertical */
  .whb-header-bottom .whb-col-left .wd-nav-main > .menu > .menu-item > .woodmart-nav-link {
    padding-left: 9px !important;
    padding-right: 9px !important;
    font-size: 0.83rem !important;
    white-space: nowrap !important;
  }

  /* Separador visual entre logo y menú */
  .whb-header-bottom .whb-col-left .wd-nav-main {
    border-left: 1px solid #ebebeb !important;
    padding-left: 12px !important;
    margin-left: 4px !important;
  }

}

