/*
Theme Name:   Kika Kruz
Theme URI:    https://kikakruz.com.ar
Description:  Tema hijo de Kadence para el showroom Kika Kruz. Diseño limpio: el color lo ponen las prendas.
Author:       Kika Kruz
Template:     kadence
Version:      1.0.0
Text Domain:  kikakruz
*/

/* Paleta y tipografías aprobadas (22/10/2026). Kadence lee estas variables. */
:root {
	--kk-tinta: #111111;
	--kk-blanco: #FFFFFF;
	--kk-crudo: #F2EFEA;
	--kk-arena: #CDC6B7;
	--kk-taupe: #6F655B;
	--kk-aro: #B8977E;
	--kk-chocolate: #3B2A26;
	--kk-f-titulo: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--kk-f-texto: "Jost", "Helvetica Neue", Arial, sans-serif;

	--global-palette1: var(--kk-tinta);
	--global-palette2: var(--kk-chocolate);
	--global-palette3: var(--kk-tinta);
	--global-palette4: #2A2420;
	--global-palette5: var(--kk-taupe);
	--global-palette6: #8A7F73;
	--global-palette7: #E9E4DC;
	--global-palette8: var(--kk-crudo);
	--global-palette9: var(--kk-blanco);
	--global-body-font-family: var(--kk-f-texto);
	--global-heading-font-family: var(--kk-f-titulo);
}

body { font-family: var(--kk-f-texto); font-weight: 400; color: var(--kk-tinta); }
h1, h2, h3, h4, .entry-title, .product_title, .woocommerce-loop-product__title {
	font-family: var(--kk-f-titulo);
	font-weight: 500;
	letter-spacing: 0;
	text-wrap: balance;
}
.kk-rotulo, .main-navigation .primary-menu-container > ul > li.menu-item > a {
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
}
a:focus-visible, button:focus-visible, select:focus-visible { outline: 2px solid var(--kk-aro); outline-offset: 2px; }

/* Botones: negros, rectos, sin redondeo. */
.button, button.button, .wp-block-button__link, .woocommerce a.button, .kk-boton {
	border-radius: 0;
	font-family: var(--kk-f-texto);
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 500;
}

/* Cabecera */
.site-header-main-section-left .custom-logo { max-height: 64px; width: auto; }
.site-header { border-bottom: 1px solid var(--kk-arena); }

/* Tarjetas de producto */
.woocommerce ul.products li.product { position: relative; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 19px; line-height: 1.25; }
.woocommerce ul.products li.product img { aspect-ratio: 4 / 5; object-fit: cover; background: var(--kk-crudo); }
.kk-consultar { color: var(--kk-taupe); font-size: 14px; letter-spacing: .04em; }

/* Etiquetas Nuevo / Oferta / Sin stock */
.kk-etiquetas { position: absolute; top: 10px; left: 10px; z-index: 3; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; pointer-events: none; }
.kk-etiqueta { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; padding: 4px 9px; line-height: 1.3; }
.kk-etiqueta--nuevo { background: var(--kk-tinta); color: var(--kk-blanco); }
.kk-etiqueta--oferta { background: var(--kk-aro); color: var(--kk-tinta); }
.kk-etiqueta--sin-stock { background: var(--kk-blanco); color: var(--kk-taupe); border: 1px solid var(--kk-arena); }
.woocommerce ul.products li.product.outofstock img { filter: grayscale(.5); opacity: .75; }
.single-product .woocommerce-product-gallery { position: relative; }

/* Ficha: consulta por WhatsApp */
.kk-consulta { display: grid; gap: 14px; margin: 18px 0 24px; max-width: 420px; }
.kk-consulta label { display: grid; gap: 4px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--kk-taupe); }
.kk-consulta select { font: inherit; text-transform: none; letter-spacing: 0; color: var(--kk-tinta); padding: 9px 10px; border: 1px solid var(--kk-arena); border-radius: 0; background: var(--kk-blanco); }
.kk-boton-whatsapp { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: var(--kk-tinta); color: var(--kk-blanco) !important; padding: 13px 20px; text-decoration: none; }
.kk-boton-whatsapp:hover { background: var(--kk-chocolate); }
.kk-boton-whatsapp svg { width: 20px; height: 20px; flex: none; }
.kk-nota-consulta { font-size: 14px; color: var(--kk-taupe); margin: 0; }

/* Botón flotante */
.kk-flotante { position: fixed; right: calc(18px + env(safe-area-inset-right, 0px)); bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 999; width: 56px; height: 56px; border-radius: 50%; background: var(--kk-tinta); display: grid; place-items: center; box-shadow: 0 4px 14px rgba(17, 17, 17, .25); transition: transform .2s; }
.kk-flotante:hover { transform: scale(1.06); }
.kk-flotante svg { width: 28px; height: 28px; }
@media (prefers-reduced-motion: reduce) { .kk-flotante { transition: none; } }

/* Franja de contacto y pie */
.kk-franja { background: var(--kk-chocolate); color: var(--kk-blanco); }
.kk-franja a { color: var(--kk-blanco); }
.kk-dato-rotulo { display: block; margin-bottom: 2px; }
.kk-franja .kk-dato-rotulo { color: var(--kk-arena); }
.kk-dato-rotulo { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--kk-taupe); }
.site-footer { background: var(--kk-tinta); color: var(--kk-arena); }
.site-footer a { color: var(--kk-blanco); }

/* Guía de talles */
.kk-tabla-talles table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
.kk-tabla-talles th, .kk-tabla-talles td { border-bottom: 1px solid var(--kk-arena); padding: 8px 10px; text-align: left; }
.kk-tabla-talles th { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--kk-taupe); font-weight: 500; }
.kk-pendiente { background: var(--kk-crudo); border-left: 3px solid var(--kk-aro); padding: 12px 16px; color: var(--kk-taupe); }

/* Reels en la portada */
.kk-reels { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.kk-reels video { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; background: var(--kk-crudo); display: block; }
.kk-reels { margin-bottom: 32px; }
.kk-reels-enlace { text-align: center; margin: 0; }
.kk-reels-enlace a.kk-boton,
.kk-reels-enlace a.kk-boton:visited { display: inline-block; padding: 13px 22px; background: var(--kk-tinta); color: var(--kk-blanco); text-decoration: none; line-height: 1.4; }
.kk-reels-enlace a.kk-boton:hover { background: var(--kk-chocolate); color: var(--kk-blanco); }
.kk-contacto-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px 32px; }
.kk-contacto-datos p { margin: 0; }
.kk-portada h1 { font-size: clamp(40px, 7vw, 76px); line-height: 1.05; }