/*
Theme Name: Mujeres 4x4
Theme URI: https://thinkstudiogt.com
Template: blocksy
Author: ThinkStudio Guatemala
Author URI: https://thinkstudiogt.com
Description: Plantilla oficial Mujeres 4x4, creada por ThinkStudio Guatemala. Compatible al 100% con Elementor, WooCommerce y Eventin.
Version: 2.0.0
Text Domain: mujeres4x4
*/

:root {
  /* Tipografías Oficiales */
  --font-heading: 'Poppins', sans-serif;
  --font-body: 'Plus Jakarta Sans', sans-serif;
  --theme-font-family: 'Plus Jakarta Sans', sans-serif;

  /* Paleta Base Blocksy */
  --theme-palette-color-1: #E84B7A; /* Accent Rosa (5%) */
  --theme-palette-color-2: #D03D69; /* Accent Hover */
  --theme-palette-color-3: #596348; /* Secondary Oliva */
  --theme-palette-color-4: #24301D; /* Títulos base en Verde Army */
  --theme-palette-color-5: #DED4C2; /* Sand (10%) */
  --theme-palette-color-6: #B6A575; /* Khaki (10%) */
  --theme-palette-color-7: #F6F2E9; /* Cream Base (60%) */
  --theme-palette-color-8: #FFFDF8; /* Warm White (60%) */

  /* Variables Oficiales */
  --color-primary: #24301D;
  --color-secondary: #596348;
  --color-text: #20251D;
  --color-accent: #E84B7A;
  --color-accent-hover: #D03D69;
  --color-cream: #F6F2E9;
  --color-sand: #DED4C2;
  --color-khaki: #B6A575;
  --color-warm-white: #FFFDF8;

  --theme-headings-color: #24301D;
}

body {
  font-family: var(--font-body) !important;
  color: var(--color-text);
  background-color: var(--color-cream);
}

/* -------------------------------------------------------------
   IMAGEN DE PRODUCTO CUADRADA (1:1) EN WOOCOMMERCE & BLOCKSY
   ------------------------------------------------------------- */
/* Ficha de Producto Individual (Single Product) */
.woocommerce div.product div.images,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
.woocommerce div.product div.images .woocommerce-product-gallery__image,
.woocommerce div.product div.images .woocommerce-product-gallery__image a,
.woocommerce div.product div.images .flex-viewport,
.ct-product-gallery,
.ct-product-gallery .flex-viewport,
.ct-product-gallery figure,
.ct-product-gallery .woocommerce-product-gallery__image {
  aspect-ratio: 1 / 1 !important;
  max-height: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image img,
.woocommerce div.product div.images img,
.ct-product-gallery img {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Miniaturas de la Galería (Thumbnails) */
.woocommerce div.product div.images .flex-control-thumbs li img,
.ct-product-gallery .flex-control-thumbs li img {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 4px !important;
}

/* Catálogo de Tienda (Shop / Archive) */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce ul.products li.product .ct-image-container,
.woocommerce ul.products li.product img {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 6px !important;
}

/* -------------------------------------------------------------
   TIPOGRAFÍA POPPINS PARA TODOS LOS TÍTULOS Y ENCABEZADOS
   ------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.ct-block-title,
.card-title,
.site-title,
.product_title,
.woocommerce-loop-product__title,
.woocommerce-cart .cart_totals h2,
.woocommerce-checkout h3 {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700;
  letter-spacing: -0.2px;
}

/* Títulos en Páginas: Color Crema #F6F2E9 por defecto */
body.page {
  --theme-headings-color: #F6F2E9;
}

body.page h1:not([style*="color"]):not(.elementor-heading-title),
body.page h2:not([style*="color"]):not(.elementor-heading-title),
body.page h3:not([style*="color"]):not(.elementor-heading-title),
body.page h4:not([style*="color"]):not(.elementor-heading-title),
body.page h5:not([style*="color"]):not(.elementor-heading-title),
body.page h6:not([style*="color"]):not(.elementor-heading-title),
body.page .page-title,
body.page .entry-title {
  color: #F6F2E9;
  font-family: 'Poppins', sans-serif;
}

/* Títulos en Entradas de Blog: Mantener Verde Army oscuro para contraste */
body.single-post h1:not(.elementor-heading-title),
body.single-post h2:not(.elementor-heading-title),
body.blog h2:not(.elementor-heading-title),
article.post h2:not(.elementor-heading-title) {
  color: #24301D;
  font-family: 'Poppins', sans-serif;
}

/* Compatibilidad total con Elementor: respeta cualquier color que elijas */
.elementor-element .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title {
  font-family: 'Poppins', sans-serif;
}

/* Botones en Poppins */
button,
.btn,
.button,
.header-pill-btn,
.woocommerce ul.products li.product .button,
.woocommerce div.product form.cart .button,
.woocommerce .cart .button,
.woocommerce .checkout-button,
.woocommerce #payment #place_order,
input[type="submit"] {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px;
}

/* -------------------------------------------------------------
   CABECERA EXACTA AL DISEÑO (MUJERES 4X4 + NAVEGACIÓN + CÁPSULAS)
   ------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background-color: var(--color-warm-white, #FFFDF8);
  border-bottom: 1px solid rgba(222, 212, 194, 0.45);
  padding: 16px 0;
}

.header-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 30px;
}
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '521825698805484');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=521825698805484&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->

/* Logotipo */
.brand-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
}

body.page .site-header .brand-title,
.brand-title {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: #24301D !important;
  line-height: 1;
}

.brand-badge-4x4 {
  background-color: #E84B7A;
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.5px;
  padding: 4px 8px;
  border-radius: 6px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Menú Central */
.main-navigation ul {
  display: flex;
  align-items: center;
  gap: 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-navigation a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 15px;
  font-weight: 500;
  color: #20251D;
  text-decoration: none;
  transition: color 0.2s ease;
}

.main-navigation a:hover {
  color: #E84B7A;
}

/* Acciones a la Derecha (Cápsulas) */
.header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-pill-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: #F6F2E9;
  border: 1px solid #DED4C2;
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 600;
  color: #20251D;
  text-decoration: none;
  transition: all 0.25s ease;
}

.header-pill-btn:hover {
  background-color: #FFFFFF;
  border-color: #E84B7A;
  color: #E84B7A;
}

.cart-pill {
  padding: 7px 12px 7px 14px;
  gap: 8px;
}

.cart-pill-badge {
  background-color: #E84B7A;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 700;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* -------------------------------------------------------------
   WOOCOMMERCE ESTILO BLOCKSY
   ------------------------------------------------------------- */
.woocommerce ul.products li.product {
  background-color: #FFFDF8;
  border: 1px solid #DED4C2;
  border-radius: 10px;
  padding: 22px;
  text-align: center;
  box-shadow: 0 4px 15px rgba(36, 48, 29, 0.04);
  transition: all 0.3s ease;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-5px);
  border-color: #E84B7A;
}

.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Poppins', sans-serif !important;
  color: #24301D;
  font-size: 16px;
  font-weight: 700;
}

.woocommerce ul.products li.product .price {
  font-family: 'Poppins', sans-serif;
  color: #E84B7A;
  font-weight: 800;
}

.woocommerce span.onsale {
  background-color: #E84B7A;
  color: #FFFFFF;
  border-radius: 4px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}

.woocommerce ul.products li.product .button,
.woocommerce div.product form.cart .button,
.woocommerce .cart .button,
.woocommerce .checkout-button,
.woocommerce #payment #place_order {
  background-color: #E84B7A !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  transition: all 0.25s ease !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce div.product form.cart .button:hover,
.woocommerce .checkout-button:hover,
.woocommerce #payment #place_order:hover {
  background-color: #D03D69 !important;
}
