/*
Theme Name:   Avada Chafica
Theme URI:    http://chafica.local
Description:  Child theme de Avada para Chafica — Ropa femenina chilena
Author:       Chafica
Template:     Avada
Version:      1.0.0
Text Domain:  avada-chafica
*/

/* ============================================================
   CHAFICA — VARIABLES DE MARCA
   ============================================================ */
:root {
  /* Colores principales */
  --ch-ciruela:        #43203F;
  --ch-ciruela-hover:  #341830;
  --ch-negro-tinta:    #2E2628;
  --ch-morado-medio:   #6B3F7C;

  /* Acentos malva / lila */
  --ch-malva-claro:    #BFA6B8;
  --ch-lila-suave:     #C9A9C0;
  --ch-malva-medio:    #8A6080;
  --ch-vino:           #5B2D55;

  /* Neutros y fondos */
  --ch-blanco:         #FFFFFF;
  --ch-crema:          #F0EDE8;
  --ch-marfil:         #EDE8D8;
  --ch-gris-claro:     #F1F1F3;
  --ch-texto-sec:      #5E6068;
  --ch-texto:          #3A3A3A;

  /* Funcionales */
  --ch-verde:          #2E7D5B;
  --ch-verde-bg:       #EBF7EF;
  --ch-rojo:           #B23A3A;
  --ch-rojo-vivo:      #CC2020;

  /* Tipografía */
  --ch-font-serif:     'Source Serif 4', Georgia, serif;
  --ch-font-sans:      'Josefin Sans', Arial, sans-serif;
}

/* ============================================================
   TIPOGRAFÍA GLOBAL
   ============================================================ */
body,
.fusion-body {
  font-family: var(--ch-font-sans) !important;
  color: var(--ch-texto) !important;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.fusion-title .title-heading-left,
.fusion-title .title-heading-center,
.post-title,
.product_title {
  font-family: var(--ch-font-serif) !important;
  font-weight: 500 !important;
  color: var(--ch-negro-tinta) !important;
}

/* Etiquetas tipo "EXPLORA POR CATEGORÍA" */
.ch-label {
  font-family: var(--ch-font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--ch-vino);
}

/* ============================================================
   BOTONES
   ============================================================ */
/* Botón primario — ciruela sólido */
.fusion-button.button-default,
.fusion-button-primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input[type="submit"],
.woocommerce #respond input#submit,
.single_add_to_cart_button {
  font-family: var(--ch-font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  background-color: var(--ch-ciruela) !important;
  color: var(--ch-blanco) !important;
  border-color: var(--ch-ciruela) !important;
  border-radius: 999px !important;
  padding: 13px 30px !important;
  transition: background .25s ease, border-color .25s ease !important;
}

.fusion-button.button-default:hover,
.fusion-button-primary:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input[type="submit"]:hover,
.woocommerce #respond input#submit:hover,
.single_add_to_cart_button:hover {
  background-color: var(--ch-ciruela-hover) !important;
  border-color: var(--ch-ciruela-hover) !important;
  color: var(--ch-blanco) !important;
}

/* Botón secundario — contorno malva */
.fusion-button.button-border,
.btn-secundario,
.woocommerce a.button.alt {
  background-color: transparent !important;
  color: var(--ch-ciruela) !important;
  border: 1.5px solid var(--ch-malva-medio) !important;
  border-radius: 999px !important;
  font-family: var(--ch-font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 13px 30px !important;
  transition: background .25s ease, color .25s ease, border-color .25s ease !important;
}

.fusion-button.button-border:hover,
.btn-secundario:hover {
  background-color: var(--ch-ciruela) !important;
  color: var(--ch-blanco) !important;
  border-color: var(--ch-ciruela) !important;
}

/* ============================================================
   HEADER / NAVEGACIÓN
   ============================================================ */
#header,
.fusion-header-wrapper,
.fusion-header {
  background-color: var(--ch-blanco) !important;
  border-bottom: 1px solid #f0ede8 !important;
}

.fusion-main-menu > ul > li > a,
.fusion-mobile-nav-holder li a {
  font-family: var(--ch-font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--ch-negro-tinta) !important;
}

.fusion-main-menu > ul > li > a:hover,
.fusion-main-menu > ul > li.current-menu-item > a {
  color: var(--ch-ciruela) !important;
}

/* ============================================================
   WOOCOMMERCE — TARJETAS DE PRODUCTO
   ============================================================ */
.woocommerce ul.products li.product,
.fusion-layout-column .woocommerce-loop-product__link {
  background: var(--ch-blanco) !important;
  border-radius: 10px !important;
  border: 1px solid #ede8e0 !important;
  box-shadow: 0 2px 10px rgba(67,32,63,.06) !important;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease !important;
}

.woocommerce ul.products li.product:hover {
  box-shadow: 0 6px 24px rgba(67,32,63,.13) !important;
  transform: translateY(-2px) !important;
}

/* Nombre de producto */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--ch-font-serif) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: var(--ch-negro-tinta) !important;
}

/* Precio */
.woocommerce ul.products li.product .price,
.woocommerce .price {
  font-family: var(--ch-font-sans) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--ch-ciruela) !important;
}

.woocommerce ul.products li.product .price del,
.woocommerce .price del {
  color: var(--ch-texto-sec) !important;
  font-weight: 400 !important;
}

/* Imagen de producto proporción 3:4 */
.woocommerce ul.products li.product a img {
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  width: 100% !important;
}

/* Badge SALE / descuento */
.woocommerce span.onsale {
  background-color: var(--ch-rojo-vivo) !important;
  border-radius: 999px !important;
  font-family: var(--ch-font-sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  min-height: unset !important;
  min-width: unset !important;
  line-height: 1.4 !important;
}

/* ============================================================
   WOOCOMMERCE — FICHA DE PRODUCTO (Single)
   ============================================================ */
.woocommerce div.product .product_title {
  font-family: var(--ch-font-serif) !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  color: var(--ch-negro-tinta) !important;
}

.woocommerce div.product p.price {
  font-family: var(--ch-font-sans) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  color: var(--ch-ciruela) !important;
}

/* ============================================================
   FOOTER
   ============================================================ */
#footer,
.fusion-footer,
.fusion-footer-widget-area,
.fusion-footer-copyright-area {
  background-color: var(--ch-ciruela) !important;
  color: var(--ch-malva-claro) !important;
}

.fusion-footer a,
.fusion-footer-widget-area a,
.fusion-footer-copyright-area a {
  color: var(--ch-malva-claro) !important;
}

.fusion-footer a:hover,
.fusion-footer-widget-area a:hover {
  color: var(--ch-blanco) !important;
}

.fusion-footer .widget-title,
.fusion-footer h3,
.fusion-footer h4 {
  font-family: var(--ch-font-sans) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: var(--ch-blanco) !important;
}

/* ============================================================
   SELECCIÓN DE TEXTO
   ============================================================ */
::selection {
  background: var(--ch-malva-claro);
  color: var(--ch-blanco);
}