/* ------------------------------------------------------------------
   SIMONE — ajustes posteriores al lanzamiento.
   Se carga después de skin.css y topbar.css (functions.php), así que
   gana a cualquier regla de la piel con la misma especificidad.
   Cada bloque lleva versión y motivo. Cuando skin.css se reescriba,
   estos bloques se integran en ella y este fichero vuelve a vacío.
   Parte PHP de los mismos arreglos: inc/fixes.php.
   ------------------------------------------------------------------ */

/* 1.9.7 · 21-09-2026 · Ficha de producto variable: la etiqueta de la
   variación («SIZE») salía centrada mientras el desplegable va a la
   izquierda. Causa: el navegador centra <th> por defecto y la piel
   solo tocaba padding/display. Se alinea a la izquierda, sobre el
   desplegable, en todos los tamaños. */
.lx-product .summary form.cart table.variations th.label{text-align:left;width:auto}
.lx-product .summary form.cart table.variations th.label label{display:block;text-align:left}

/* 1.9.7 · 21-09-2026 · Métodos de envío (carrito y checkout). La hoja
   del plugin de Envia (envia-shipping-public.css) convierte cada
   etiqueta en tres piezas sueltas —nombre, precio, «(incl. VAT)»—
   repartidas a lo ancho con flex space-between; en PC caben en una
   línea, en el móvil se desparraman. inc/fixes.php envuelve nombre y
   precio en .lx-ship-name / .lx-ship-price; aquí se colocan: nombre a
   la izquierda, precio a la derecha (en el móvil con el IVA debajo).
   Los selectores llevan el id para ganar a los del plugin. */
.lx-cart .cart_totals ul#shipping_method,.lx-checkout ul#shipping_method{max-width:none;min-width:0;width:100%}
.lx-cart .cart_totals ul#shipping_method>li,.lx-checkout ul#shipping_method>li{display:flex;flex-wrap:nowrap;align-items:flex-start;gap:12px;margin:0 0 10px;padding:0;text-align:left}
.lx-cart .cart_totals ul#shipping_method>li:hover,.lx-checkout ul#shipping_method>li:hover{box-shadow:none}
.lx-cart .cart_totals ul#shipping_method>li input.shipping_method,.lx-checkout ul#shipping_method>li input.shipping_method{flex:none;margin:4px 0 0;accent-color:#0A0A0A}
.lx-cart .cart_totals ul#shipping_method li label,.lx-checkout ul#shipping_method li label{display:flex!important;flex-wrap:nowrap;justify-content:space-between;align-items:baseline;gap:16px;flex:1 1 auto;width:auto;min-width:0;margin:0;font-weight:300;line-height:1.5;text-align:left}
.lx-cart .cart_totals ul#shipping_method li label .lx-ship-name,.lx-checkout ul#shipping_method li label .lx-ship-name{flex:1 1 auto;min-width:0;align-self:auto;font-weight:300}
.lx-cart .cart_totals ul#shipping_method li label .lx-ship-price,.lx-checkout ul#shipping_method li label .lx-ship-price,.lx-cart .cart_totals ul#shipping_method li label .lx-ship-price span,.lx-checkout ul#shipping_method li label .lx-ship-price span{flex:none;align-self:auto;text-align:right;white-space:nowrap;font-weight:400}
.lx-cart .cart_totals ul#shipping_method li label .tax_label,.lx-checkout ul#shipping_method li label .tax_label{font-size:11px;color:var(--lx-mute);font-weight:300}
@media (max-width:820px){
	/* «(incl. VAT)» debajo del precio: deja el ancho al nombre del transportista. */
	.lx-cart .cart_totals ul#shipping_method li label .lx-ship-price,.lx-checkout ul#shipping_method li label .lx-ship-price{display:flex;flex-direction:column;align-items:flex-end;line-height:1.3}
	.lx-cart .cart_totals ul#shipping_method li label .tax_label,.lx-checkout ul#shipping_method li label .tax_label{line-height:1.2}
	/* Carrito: la fila «Shipment» se apila (título arriba, transportistas a todo el ancho), como ya hace el checkout. */
	.lx-cart .woocommerce .cart_totals table.shop_table tr.woocommerce-shipping-totals{flex-direction:column;align-items:stretch;gap:8px}
	.lx-cart .woocommerce .cart_totals table.shop_table tr.woocommerce-shipping-totals th{padding-bottom:0!important}
	.lx-cart .woocommerce .cart_totals table.shop_table tr.woocommerce-shipping-totals td{padding-top:0!important;text-align:left!important}
	.lx-cart .cart_totals tr.woocommerce-shipping-totals .woocommerce-shipping-destination{text-align:left;margin:8px 0 0}
}

/* 1.9.10 · 22-09-2026 · Cuadro de autor («Written and reviewed by ·
   Pablo Ramos») en entradas y fichas de producto (inc/author-box.php).
   Va dentro de .entry, donde la piel fija tamaño y márgenes de h3 y p
   con más especificidad que .lx-author; aquí se devuelve el aspecto
   exacto de la tarjeta de los capítulos. En la ficha, cuando el
   producto no tiene texto de fórmula, la tarjeta es lo único de la
   sección: sin el margen superior de 56 px. */
.lx-article .entry .lx-author h3,.lx-formula .entry .lx-author h3{font-size:22px;font-weight:400;text-transform:none;letter-spacing:0;margin:0;color:var(--lx-ink)}
.lx-article .entry .lx-author p,.lx-formula .entry .lx-author p{font-size:14px;margin:0;line-height:1.65}
.lx-formula .entry .lx-author:first-child{margin-top:0}

/* 1.9.12 · 22-09-2026 · Acordeón «Ingredients (INCI)» en la ficha de
   producto (inc/inci-tab.php). Lista larga en cuerpo pequeño; en las
   rutinas, un subtítulo por producto. */
.lx-acc .lx-inci h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--lx-ink);margin:22px 0 6px}
.lx-acc .lx-inci h4:first-child{margin-top:0}
.lx-acc .lx-inci .lx-inci-list{font-size:13px;line-height:1.75;margin:0}
.lx-acc .lx-inci .lx-inci-note{margin-top:14px}

/* 1.9.13 · 23-09-2026 · Banner de cookies (WPConsent, inc/consent.php).
   WooCommerce solo guarda el origen del pedido si el visitante acepta la
   categoría «marketing»; el 86 % no tocaba el banner y compraba igual.
   (a) Velo detrás del banner mientras está visible: hay que elegir.
   (b) «Accept All» y «Reject All» iguales, en negro, como manda la AEPD
   (rechazar tan fácil como aceptar); «Manage preferences» perfilado.
   El banner vive en un shadow DOM: solo se puede tocar vía ::part(). */
.lx-consent-veil{display:none;position:fixed;inset:0;z-index:899999;background:rgba(10,10,10,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
html.lx-consent-open .lx-consent-veil{display:block}
#wpconsent-container::part(wpconsent-button-accept),#wpconsent-container::part(wpconsent-button-cancel),#wpconsent-container::part(wpconsent-button-preferences){height:44px;padding:10px 20px;border-radius:0;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;line-height:1.2;flex:1 1 0;box-shadow:none;transition:background-color .2s,color .2s}
#wpconsent-container::part(wpconsent-button-accept),#wpconsent-container::part(wpconsent-button-cancel){background:#0A0A0A;color:#fff;border:1px solid #0A0A0A}
#wpconsent-container::part(wpconsent-button-accept):hover,#wpconsent-container::part(wpconsent-button-cancel):hover{background:#333;border-color:#333}
#wpconsent-container::part(wpconsent-button-preferences){background:#fff;color:#0A0A0A;border:1px solid #0A0A0A}
#wpconsent-container::part(wpconsent-button-preferences):hover{background:#0A0A0A;color:#fff}
#wpconsent-container::part(wpconsent-banner){border-radius:0}

/* 1.9.14 · 23-09-2026 · Hero en móvil (≤ 820 px): la foto —o el vídeo en la
   home— pasa a fondo de toda la primera pantalla y el texto va encima, en
   blanco, pegado abajo (Pablo, mockup aprobado). En PC no cambia nada. La
   sección crece con el contenido (min-height, no height), así que un título
   largo (DE/FR) nunca se sale de la foto: la foto es absoluta y cubre siempre.
   Los heros sin foto (.no-image) se quedan como estaban. */
@media (max-width:820px){
	.lx-hero:not(.no-image){position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:min(680px,84vh);min-height:min(680px,84svh);height:auto;background:var(--lx-ink);color:#fff;isolation:isolate;overflow:hidden}
	.lx-hero:not(.no-image) .visual{position:absolute;inset:0;min-height:0;height:auto;order:0;z-index:0}
	.lx-hero:not(.no-image) .visual img,.lx-hero:not(.no-image) .visual .bg-video{filter:grayscale(1) brightness(.62)}
	.lx-hero:not(.no-image) .visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,0) 0%,rgba(10,10,10,.18) 38%,rgba(10,10,10,.8) 100%);pointer-events:none}
	.lx-hero:not(.no-image) .visual .lx-fig{display:none}
	.lx-hero:not(.no-image) .copy{position:relative;z-index:1;gap:22px;padding:56px var(--lx-pad) 40px;max-width:none;width:auto;color:#fff}
	.lx-hero:not(.no-image) .copy .lx-eyebrow,.lx-hero:not(.no-image) .copy .lx-eyebrow a,.lx-hero:not(.no-image) .copy .hero-meta{color:rgba(255,255,255,.72)}
	.lx-hero:not(.no-image) .copy .lx-title{color:#fff}
	.lx-hero:not(.no-image) .copy .lx-title span,.lx-hero:not(.no-image) .copy .lx-title em{color:rgba(255,255,255,.72)}
	.lx-hero:not(.no-image) .copy .lx-lead{color:rgba(255,255,255,.86);max-width:none}
	.lx-hero:not(.no-image) .copy .lx-fig{color:rgba(255,255,255,.6)}
	.lx-hero:not(.no-image) .copy .lx-btn{background:#fff;color:var(--lx-ink)!important;border-color:#fff}
	.lx-hero:not(.no-image) .copy .lx-btn.ghost{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.7)}
	.lx-hero:not(.no-image) .copy .lx-btn:hover{background:transparent;color:#fff!important;border-color:#fff}
	.lx-hero:not(.no-image) .actions{gap:12px}
	.lx-hero:not(.no-image) .actions .lx-btn{flex:1 1 calc(50% - 6px);min-height:48px;padding:12px 14px;font-size:10px}
}
/* Apaisado en el móvil: la pantalla es baja; que el hero no intente llenar el 84 % y crezca solo lo que pida el texto. */
@media (max-width:820px) and (max-height:500px){
	.lx-hero:not(.no-image){min-height:0}
	.lx-hero:not(.no-image) .copy{padding-top:120px}
}

/* 1.9.15 · 23-09-2026 · Tarjeta de FAQ sin enlace (inc/sections.php): en una web
   de un solo idioma el artículo enlazado puede no existir; la tarjeta se pinta
   igual, sin «Leer más». */
.lx-faq-grid>div{display:flex;flex-direction:column;gap:14px;padding:28px 0;border-top:1px solid var(--lx-ink);color:var(--lx-ink)}

/* 1.9.16 · 23-09-2026 · Newsletter → Klaviyo: estado bajo el formulario (main.js). */
.lx-newsletter-status{margin:14px 0 0;font-size:13px;font-weight:300;line-height:1.6;color:var(--lx-ink)}
.lx-newsletter-status.is-error{color:#b3261e}
.lx-newsletter form[hidden]{display:none} /* the skin's display:flex would otherwise beat the hidden attribute after a successful sign-up */

/* 1.9.19 · 23-09-2026 · Polonia (Pablo). (a) PC: el logo polaco no tiene margen propio y tocaba la barra negra; Personalizar →
   Identidad del sitio → «Space above the header logo» (--logo-top, 0 por defecto: la .com no cambia).
   (b) Móvil: la barra deja solo los códigos de idioma; sin WPML quedaba una franja negra vacía. Con .no-lang (header.php)
   muestra la primera parte del mensaje («Bezpłatna analiza włosów i skóry głowy»), centrada y recortada si no cupiera. */
@media (min-width:821px){
	.site-header .lx-masthead .brand{padding-top:var(--logo-top,0px)}
}
@media (max-width:820px){
	.lx-topbar.no-lang .msg{display:flex!important;justify-content:center;min-width:0;max-width:100%}
	.lx-topbar.no-lang .msg>span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
	.lx-topbar.no-lang .msg .tb-b,.lx-topbar.no-lang .msg .app{display:none}
}

/* 1.9.20 · 23-09-2026 · El mismo aire en el móvil (Pablo): dos tercios de --logo-top encima del logo y un tercio debajo,
   para que tampoco quede pegado a la línea inferior de la cabecera (en Polonia, 12 px → 8 + 4 px). 0 en la .com. */
@media (max-width:820px){
	.site-header .lx-masthead .brand{padding-top:calc(var(--logo-top,0px) * .66);padding-bottom:calc(var(--logo-top,0px) * .33)}
}

/* 1.9.21 · 23-09-2026 · «PL» en el selector de idiomas → simonetrichology.pl (inc/pl-link.php).
   Va tras una raya fina y con una flecha ↗: abre otra web, no cambia de idioma dentro de esta.
   Sirve igual en la barra superior (ordenador y móvil) y en el pie del menú del móvil. */
.lang .lang-sep{display:inline-block;width:1px;height:11px;background:currentColor;opacity:.35;align-self:center;margin:0 -2px}
.lang a.lang-ext{display:inline-flex;align-items:flex-start;gap:3px}
.lang a.lang-ext svg{width:7px;height:7px;margin-top:1px;flex:0 0 auto}
