/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */

/* ============================================================
   Rebranding v3 "old money mediterráneo" — Gràcia i Art
   Paleta:  navy #202B3D · charcoal #2A2724 · camel #A6905F
            olive #555E3F · cream #EFE7D8 · paper #FAF6EE
   Tipografía: Cinzel (titulares) + Poppins (cuerpo)
   Decisión aprobada — ver NOTES.md del repo. Aplicado 2026-09-11.
   Cubre variables globales de Blocksy (texto, botones, enlaces,
   titulares, fondo). El hero/franja de confianza/grid de la home
   son bloques Stackable con color literal: pendientes de editor.
   ============================================================ */

:root{
  /* tipografía de cuerpo */
  --theme-font-family: 'Poppins', sans-serif;

  /* paleta base de Blocksy reasignada */
  --theme-palette-color-1: #A6905F;  /* antes rosa: foco de formularios / selección */
  --theme-palette-color-2: #A6905F;  /* antes celeste: color de enlace */
  --theme-palette-color-3: #2A2724;  /* antes gris: texto de cuerpo */
  --theme-palette-color-4: #202B3D;  /* antes negro: titulares */
  --theme-palette-color-7: #FAF6EE;  /* paper: fondo claro de formularios */
  --theme-palette-color-8: #EFE7D8;  /* cream: fondo del sitio */

  --theme-text-color: #2A2724;
  --theme-link-initial-color: #A6905F;
  --theme-link-hover-color: #202B3D;
  --theme-selection-background-color: #A6905F;
  --theme-selection-text-color: #EFE7D8;

  --theme-headings-color: #202B3D;
  --theme-heading-1-color: #202B3D;
  --theme-heading-2-color: #202B3D;
  --theme-heading-3-color: #202B3D;
  --theme-heading-4-color: #202B3D;
  --theme-heading-5-color: #202B3D;
  --theme-heading-6-color: #202B3D;

  --theme-button-background-initial-color: #202B3D;
  --theme-button-background-hover-color: #2A2724;
  --theme-button-text-initial-color: #EFE7D8;
  --theme-button-text-hover-color: #EFE7D8;

  --theme-form-field-border-focus-color: #A6905F;
  --theme-form-selection-field-active-color: #A6905F;
}

/* Titulares en Cinzel en todo el sitio (h1-h6, incluye los que */
/* generan los bloques Stackable, que renderizan etiquetas reales) */
h1, h2, h3, h4, h5, h6{
  --theme-font-family: 'Cinzel', serif;
  letter-spacing: .02em;
}

/* Menú de navegación en Poppins (Blocksy lo fuerza a IBM Plex Mono) */
[data-header] [data-id="menu"] > ul > li > a{
  --theme-font-family: 'Poppins', sans-serif;
}

/* Logo / nombre de la tienda en el header */
[data-id="logo"] .site-title{
  --theme-font-family: 'Cinzel', serif;
  --theme-link-initial-color: #202B3D;
  letter-spacing: .08em;
}

/* Badge "OFERTA" (antes fucsia) */
.onsale{
  background-color: #202B3D !important;
  color: #EFE7D8 !important;
}

/* Cabecera lila (.hero-section) de categorías de producto, blog, autor
   y páginas individuales (Contacto, etc.) — Blocksy la aplica igual en
   todas vía [data-prefix] o meta de página; forzamos aquí sin distinguir. */
.hero-section[data-type="type-2"]{
  background-color: #EFE7D8 !important;
  background-image: none !important;
}
.hero-section[data-type="type-2"] .page-title,
.hero-section[data-type="type-2"] .entry-title{
  color: #202B3D !important;
}
.hero-section[data-type="type-2"] .ct-breadcrumbs,
.hero-section[data-type="type-2"] .ct-breadcrumbs a{
  color: #2A2724 !important;
}

/* Fila superior del header ("Síguenos" + redes) — amarillo por defecto
   de Blocksy, nunca personalizado. La fundimos con el header en cream. */
[data-header] [data-row="top"]{
  background-color: transparent !important;
}

/* Subrayado/indicador del menú al pasar el ratón o hacer clic — celeste
   por defecto de Blocksy, nunca personalizado. */
[data-header] [data-id="menu"]{
  --menu-indicator-hover-color: #A6905F !important;
  --menu-indicator-active-color: #202B3D !important;
}

/* La cabecera reparte logo/menú/iconos en 3 columnas de ancho casi igual;
   con 4 enlaces en el menú (Inicio, Camisetas, Contacto, Conócenos) no
   caben y Blocksy oculta el último sin avisar. Le damos el ancho que
   sobra en vez de un tercio fijo. */
/* Menú móvil (panel oscuro #offcanvas): el enlace de la página actual
   heredaba el color navy de "hover" y quedaba invisible sobre el fondo
   casi negro del panel. Forzamos cream para todos los enlaces de ahí. */
#offcanvas .ct-menu-link,
#offcanvas .current-menu-item > a,
#offcanvas .ct-header-text,
#offcanvas .ct-header-text p,
#offcanvas .ct-header-socials a{
  color: #EFE7D8 !important;
}

/* Cards de producto: precio en camel y ligera elevación al pasar el ratón */
[data-products] .product .price{
  color: #A6905F !important;
  font-weight: 700 !important;
}
[data-products] .product{
  transition: transform .2s ease, box-shadow .2s ease;
}
[data-products] .product:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 28px -18px rgba(42,39,36,.35);
}

/* Botones de los formularios de Forminator (newsletter, contacto) —
   tienen su propio celeste por defecto, ajeno al tema. */
.forminator-button, .forminator-button-submit{
  background-color: #202B3D !important;
  color: #EFE7D8 !important;
  border-color: #202B3D !important;
}
.forminator-button:hover, .forminator-button-submit:hover{
  background-color: #2A2724 !important;
}

#header .ct-container{
  grid-template-columns: auto 1fr auto !important;
}
[data-header] [data-id="menu"]{
  --menu-items-spacing: 32px !important;
}
/* Blocksy oculta por JS (inyectando "#menu-item-N{display:none}") los
   ítems de menú que decide que no caben, y no recalcula aunque haya
   sitio de sobra. Se lo ganamos a la fuerza: el menú principal nunca
   debería ocultar ninguno de sus ~4 enlaces de nivel superior. */
[data-header] [data-id="menu"] > ul > li{
  display: flex !important;
}

/* Aviso de envío gratuito en la ficha de producto (ver functions.php) */
.gracia-envio-aviso {
	margin-top: 14px;
	padding: 10px 14px;
	border: 1px solid var(--theme-palette-color-5, #e3dacb);
	border-radius: 4px;
	background: #f7f2e9;
	color: #202b3d;
	font-size: 14px;
	line-height: 1.45;
}

/* Barra superior con la promesa de envío, en todas las páginas (functions.php).
   Navy de marca sobre cream para que se lea sin competir con el logo. */
.gracia-barra-envio {
	background: #202b3d;
	color: #efe7d8;
	text-align: center;
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .02em;
	line-height: 1.4;
	padding: 9px 16px;
}
.gracia-barra-envio span { display: inline-block; }

@media (max-width: 480px) {
	.gracia-barra-envio { font-size: 12px; padding: 8px 14px; }
}