/* Hallmark · macrostructure: Manifesto oscuro + catálogo · tone: técnico/contundente · anchor hue: rojo 25
 * theme: studied-DNA (source: https://streamnet.cc) · paper #0A0A0A · accent #D6323C
 * display: Archivo (heavy, condensado) · body: Archivo · label: JetBrains Mono
 * Hallmark · pre-emit critique: P4 H5 E4 S5 R4 V4
 */
/* tokens.css se carga aparte desde functions.php */

*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  /* v2: resplandores rojos repartidos por toda la página, no solo la portada */
  background:
    radial-gradient(55rem 40rem at 105% 18rem, var(--color-glow-soft), transparent 70%),
    radial-gradient(50rem 38rem at -10% 85rem, var(--color-glow-soft), transparent 70%),
    radial-gradient(55rem 40rem at 110% 150rem, var(--color-glow-soft), transparent 70%),
    radial-gradient(50rem 38rem at -10% 220rem, var(--color-glow-soft), transparent 70%),
    radial-gradient(60rem 40rem at 50% 100%, var(--color-glow-soft), transparent 70%),
    var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-display);
  font-size: var(--text-body);
  line-height: 1.55;
  font-variation-settings: "wdth" 100;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
h1, h2, h3 { font-style: normal; margin: 0; line-height: 1.02; letter-spacing: -0.02em; overflow-wrap: anywhere; min-width: 0; }
p { margin: 0; }

.wrap { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }

/* Etiquetas mono */
.label {
  font-family: var(--font-mono);
  font-size: var(--text-label);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-ink-2);
}
.eyebrow { display: inline-flex; align-items: center; gap: var(--space-3); }
.eyebrow::before { content: ""; width: 1.6rem; height: 2px; background: var(--color-accent); }

/* Botones: rojo lleno solo para la acción principal */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 48px; padding: 0 var(--space-5);
  font-family: var(--font-mono); font-size: var(--text-small); font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap;
  border-radius: var(--radius-1); border: 1px solid transparent; cursor: pointer;
  transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out);
}
.btn-primary { background: var(--color-accent); color: var(--color-accent-ink); }
.btn-primary:hover { background: var(--color-accent-hi); }
.btn-primary:active { transform: translateY(1px); }
.btn-ghost { border-color: var(--color-rule-2); color: var(--color-ink); background: transparent; }
.btn-ghost:hover { border-color: var(--color-accent); color: var(--color-accent-hi); }
.btn-outline { border-color: var(--color-accent); color: var(--color-accent-hi); background: transparent; }
.btn-outline:hover { background: var(--color-accent); color: var(--color-accent-ink); }
.btn[disabled] { background: var(--color-paper-3); color: var(--color-ink-3); border-color: var(--color-rule); cursor: not-allowed; transform: none; }
.btn-block { width: 100%; }

/* ---------- Cabecera ---------- */
.site-head { position: sticky; top: 0; z-index: 20; background: linear-gradient(180deg, var(--color-head), var(--color-head-2)); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-bottom: 1px solid var(--color-head-rule); box-shadow: 0 10px 30px -12px var(--color-shadow); }
.site-head .sn-search input { background: var(--color-head-2); border-color: var(--color-head-rule); }
.site-head .sn-search button { background: var(--color-head); border-color: var(--color-head-rule); }
.site-head .cat-nav { border-top-color: var(--color-head-rule); background: transparent; }
/* Categorías centradas; si no entran (celular) se deslizan sin cortar la primera */
.cat-nav li:first-child { margin-left: auto; }
.cat-nav li:last-child { margin-right: auto; }
.site-head .cat-nav a { color: var(--color-ink); opacity: 0.82; }
.site-head .cat-nav a:hover, .site-head .cat-nav a[aria-current] { opacity: 1; background: var(--color-head); }
.site-head .btn-primary { box-shadow: 0 0 0 1px var(--color-accent-hi); }
.head-row { display: flex; align-items: center; gap: var(--space-4); min-height: 64px; }
.logo img { width: 52px; height: 52px; }
.sn-search { flex: 1; display: flex; max-width: 380px; margin-inline: auto; }
.sn-search input {
  flex: 1; min-width: 0; height: 42px; padding: 0 var(--space-4);
  background: var(--color-paper-2); border: var(--rule-2); border-right: 0; border-radius: var(--radius-1) 0 0 var(--radius-1);
  color: var(--color-ink); font-family: var(--font-mono); font-size: var(--text-small);
}
.sn-search input::placeholder { color: var(--color-ink-3); }
.sn-search button { width: 46px; border: var(--rule-2); background: var(--color-paper-3); border-radius: 0 var(--radius-1) var(--radius-1) 0; cursor: pointer; }
.head-actions { display: flex; align-items: center; gap: var(--space-2); }
.icon-link { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-width: 44px; min-height: 44px; font-size: var(--text-small); }
.icon-link svg { width: 22px; height: 22px; }
.icon-link .txt { display: none; }
.badge-count { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--color-accent); color: var(--color-accent-ink); font-family: var(--font-mono); font-size: 0.7rem; display: grid; place-items: center; }
.head-cta { display: none; }

.cat-nav { border-top: var(--rule-1); }
.cat-nav ul { list-style: none; margin-block: 0; padding: 0; display: flex; gap: var(--space-2); overflow-x: auto; scrollbar-width: none; padding-block: var(--space-2); }
.cat-nav ul::-webkit-scrollbar { display: none; }
.cat-nav a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--space-3); white-space: nowrap; border-radius: 999px; font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-ink-2); }
.cat-nav a:hover, .cat-nav a[aria-current] { color: var(--color-ink); background: var(--color-paper-3); }

/* ---------- Portada ---------- */
.hero { position: relative; padding-block: var(--space-7) var(--space-6); isolation: isolate; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 60% at 30% 0%, var(--color-glow-hi), transparent 70%); }
.hero h1 { font-size: var(--text-h1); font-weight: 800; font-variation-settings: "wdth" 88; margin-top: var(--space-4); max-width: 14ch; }
.hero h1 .hl { color: var(--color-accent); }
.hero .lead { font-size: var(--text-lead); color: var(--color-ink-2); max-width: 44ch; margin-top: var(--space-4); }
.hero-ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.trust { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin-top: var(--space-5); padding: 0; list-style: none; }
.trust li { display: inline-flex; align-items: center; gap: var(--space-2); }
.trust li::before { content: "✓"; color: var(--color-accent-hi); font-family: var(--font-mono); }

/* Tablet: se enciende al entrar + carrusel 3D deslizable (dedo, mouse, flechas, puntos) */
.stage { position: relative; margin-top: var(--space-6); height: clamp(330px, 62vw, 440px); perspective: 1600px; perspective-origin: 50% 47%; touch-action: pan-y; user-select: none; cursor: grab; }
.stage:active { cursor: grabbing; }
.stage:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 6px; border-radius: var(--radius-2); }
.ember { position: absolute; top: 50%; left: 50%; width: min(420px, 90vw); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, var(--color-ember) 0%, var(--color-ember-2) 38%, transparent 68%); opacity: 0; scale: 0.85; transition: opacity 0.6s ease, scale 0.6s ease; }
.is-on .ember { opacity: 1; scale: 1; transition-delay: 1.3s; }
.ember.pulse { scale: 1.1; transition-duration: 0.18s; transition-delay: 0s; }
.tablet { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -52%) rotateX(8deg); width: min(560px, 92%); aspect-ratio: 4 / 3; border-radius: 22px; padding: 12px; background: linear-gradient(145deg, var(--color-bezel-hi) 0%, var(--color-bezel) 22%, var(--color-bezel-lo) 60%, var(--color-bezel-hi) 100%); box-shadow: 0 46px 96px var(--color-shadow), 0 10px 40px var(--color-glow-hi); }
.tablet-screen { position: relative; width: 100%; height: 100%; border-radius: 13px; overflow: hidden; background: var(--color-screen); }
.ui { position: absolute; inset: 0; padding: 4% 5%; display: flex; flex-direction: column; gap: 6%; opacity: 0; transition: opacity 0.5s ease; }
.is-on .ui { opacity: 1; transition-delay: 0.62s; }
.ui-nav { display: flex; gap: 8px; align-items: center; }
.ui-nav i { width: 10px; height: 10px; border-radius: 50%; background: var(--color-rule-2); }
.ui-nav u { height: 5px; width: 30px; border-radius: 2px; background: var(--color-rule); }
.ui-nav s { margin-left: auto; height: 13px; width: 80px; border-radius: 3px; background: var(--color-paper-3); }
.ui-banner { flex: 1; border-radius: 8px; background: radial-gradient(70% 88% at 78% 40%, var(--color-ember), transparent 62%), radial-gradient(50% 70% at 20% 80%, var(--color-glow-hi), transparent 65%), linear-gradient(115deg, var(--color-paper-2), var(--color-screen)); }
.ui-row { display: flex; gap: 6px; }
.ui-row i { flex: 1; aspect-ratio: 2 / 3; max-height: 60px; border-radius: 4px; background: linear-gradient(160deg, var(--color-paper-3), var(--color-screen)); opacity: 0; translate: 0 9px; transition: opacity 0.34s ease, translate 0.34s var(--ease-out); }
.is-on .ui-row i { opacity: 1; translate: 0 0; }
.is-on .ui-row i:nth-child(2) { transition-delay: 0.78s; } .is-on .ui-row i:nth-child(3) { transition-delay: 0.84s; }
.is-on .ui-row i:nth-child(4) { transition-delay: 0.9s; } .is-on .ui-row i:nth-child(5) { transition-delay: 0.96s; }
.is-on .ui-row i:nth-child(1) { transition-delay: 0.72s; } .is-on .ui-row i:nth-child(6) { transition-delay: 1.02s; }
.power-line { position: absolute; top: 50%; left: 0; right: 0; height: 2px; margin-top: -1px; background: var(--color-ink); box-shadow: 0 0 18px 3px var(--color-ink-2); transform: scaleX(0); opacity: 0; }
.is-on .power-line { animation: power-on 1.05s cubic-bezier(0.5, 0, 0.2, 1) forwards; }
@keyframes power-on {
  0% { transform: scaleX(0); opacity: 0; }
  16% { transform: scaleX(0.06); opacity: 1; }
  46% { transform: scaleX(1); opacity: 1; }
  62% { transform: scaleX(1) scaleY(46); opacity: 0.32; }
  100% { transform: scaleX(1) scaleY(46); opacity: 0; }
}
.carousel { position: absolute; inset: 0; transform-style: preserve-3d; opacity: 0; transition: opacity 0.6s ease; }
.is-on .carousel { opacity: 1; transition-delay: 1.18s; }
.c-card { position: absolute; top: 50%; left: 50%; width: clamp(118px, 30vw, 160px); aspect-ratio: 1; translate: -50% -50%; border-radius: 18px; overflow: hidden; border: var(--rule-1); background: var(--color-paper-3); transition: transform 0.55s var(--ease-out), opacity 0.55s, box-shadow 0.4s, border-color 0.3s; }
.c-card img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-user-drag: none; }
.c-card.active { border-color: var(--color-accent); box-shadow: 0 24px 56px var(--color-shadow), 0 0 34px var(--color-ember); }
.c-card:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
.ticket { display: block; position: relative; max-width: 340px; margin: calc(-1 * var(--space-2)) auto 0; padding: var(--space-3) var(--space-4); border: var(--rule-2); border-radius: 3px; background: var(--color-paper-2); opacity: 0; translate: 0 8px; transition: opacity 0.5s ease, translate 0.5s ease; }
.is-on .ticket { opacity: 1; translate: 0 0; transition-delay: 1.5s; }
.ticket .top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.ticket h3 { font-size: 1.1rem; }
.ticket .seal { flex: none; border: 1.5px solid var(--color-accent); color: var(--color-accent-hi); font-family: var(--font-mono); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; padding: 2px 6px; rotate: -6deg; }
.ticket hr { border: 0; border-top: 1px dashed var(--color-rule-2); margin: var(--space-3) calc(-1 * var(--space-4)); }
.ticket .bottom { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); }
.dots { display: flex; justify-content: center; gap: 4px; margin-top: var(--space-3); }
.dots button { width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.dots button::before { content: ""; width: 6px; height: 6px; background: var(--color-rule-2); transition: width var(--dur-2), background-color var(--dur-2); }
.dots button[aria-current="true"]::before { width: 18px; background: var(--color-accent); }
.swipe-hint { text-align: center; margin-top: var(--space-2); }
@media (prefers-reduced-motion: reduce) {
  .ember, .ui, .ui-row i, .carousel, .ticket, .c-card { transition: none !important; }
  .is-on .power-line { animation: none; }
}
.price { font-family: var(--font-mono); font-weight: 700; color: var(--color-ink); font-size: 1.15rem; white-space: nowrap; }
.price small { font-weight: 400; font-size: var(--text-label); color: var(--color-ink-2); margin-right: var(--space-1); text-transform: uppercase; letter-spacing: 0.08em; }

/* Cinta de precios */
.ticker { border-block: var(--rule-1); overflow: hidden; padding-block: var(--space-3); }
.ticker-track { display: flex; gap: var(--space-7); width: max-content; animation: ticker 40s linear infinite; }
.ticker:hover .ticker-track, .ticker:focus-within .ticker-track { animation-play-state: paused; }
.ticker a { font-family: var(--font-mono); font-size: var(--text-small); text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-ink-2); white-space: nowrap; }
.ticker a b { color: var(--color-accent-hi); font-weight: 500; }
.ticker a:hover { color: var(--color-ink); }
@keyframes ticker { to { transform: translateX(-50%); } }

/* Secciones */
.section { padding-block: var(--space-8); border-bottom: var(--rule-1); }
.section-head { display: grid; gap: var(--space-3); margin-bottom: var(--space-6); }
.section-head h2 { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 92; max-width: 18ch; }
.section-head p { color: var(--color-ink-2); max-width: 52ch; }

/* Cómo comprar */
.steps { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); counter-reset: paso; list-style: none; margin: 0; padding: 0; }
.steps li { border: var(--rule-1); border-radius: var(--radius-2); padding: var(--space-5); background: var(--color-paper-2); }
.steps .n { font-family: var(--font-mono); color: var(--color-accent-hi); font-size: var(--text-small); }
.steps h3 { font-size: var(--text-h3); margin-block: var(--space-3) var(--space-2); }
.steps p { color: var(--color-ink-2); font-size: var(--text-small); }
.pay { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-5); align-items: center; }
.chip { display: inline-flex; align-items: center; min-height: 34px; padding: 0 var(--space-3); border: var(--rule-2); border-radius: 999px; font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.06em; color: var(--color-ink); white-space: nowrap; }

/* Categorías */
.cats { border: var(--rule-1); border-radius: var(--radius-2); overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr); }
.cat { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-2) var(--space-4); padding: var(--space-5); border-bottom: var(--rule-1); transition: background-color var(--dur-1) var(--ease-out); }
.cat:hover { background: var(--color-paper-3); }
.cat:hover .arrow { color: var(--color-accent-hi); transform: translateX(3px); }
.cat h3 { font-size: var(--text-h3); }
.cat .some { grid-column: 1 / -1; font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); }
.cat .arrow { font-family: var(--font-mono); color: var(--color-ink-3); transition: transform var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out); }
.cat .price { font-size: 0.95rem; }

/* Entregas recientes */
.cards3 { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); }
.card { border: var(--rule-1); border-radius: var(--radius-2); padding: var(--space-5); background: var(--color-paper-2); display: grid; gap: var(--space-2); }
.card .top { display: flex; justify-content: space-between; gap: var(--space-3); }
.sn-tag { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 2px 8px; border: 1px solid var(--color-accent); color: var(--color-accent-hi); border-radius: 2px; white-space: nowrap; }
.sn-tag.ok { border-color: var(--color-ok); color: var(--color-ok); }
.card h3 { font-size: var(--text-h3); }
.card p { color: var(--color-ink-2); font-size: var(--text-small); }

/* Números */
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: var(--rule-1); border-radius: var(--radius-2); overflow: hidden; }
.stat { padding: var(--space-5); border-right: var(--rule-1); border-bottom: var(--rule-1); }
.stat b { display: block; font-size: clamp(2rem, 1.4rem + 2.4vw, 3.2rem); font-weight: 800; font-variation-settings: "wdth" 90; line-height: 1; }

/* Testimonios */
.quote { margin: 0; border: var(--rule-1); border-radius: var(--radius-2); padding: var(--space-5); background: var(--color-paper-2); display: grid; gap: var(--space-4); }
.quote blockquote { margin: 0; font-size: var(--text-lead); }
.quote figcaption { display: flex; align-items: center; gap: var(--space-3); font-size: var(--text-small); }
.ini { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--color-accent); color: var(--color-accent-hi); font-family: var(--font-mono); font-size: 0.72rem; border-radius: 2px; flex: none; }

/* CTA final */
.final { padding-block: var(--space-9); text-align: left; }
.final h2 { font-size: var(--text-h2); font-weight: 800; max-width: 16ch; }
.final .hero-ctas { margin-top: var(--space-6); }

/* ---------- Pie ---------- */
.site-foot { border-top: var(--rule-2); padding-block: var(--space-8) var(--space-6); background: var(--color-paper-2); }
.foot-grid { display: grid; gap: var(--space-6); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.foot-grid h4 { margin: 0 0 var(--space-4); }
.foot-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.foot-grid a { color: var(--color-ink-2); font-size: var(--text-small); white-space: nowrap; }
.foot-grid a:hover { color: var(--color-ink); }
.foot-grid li { font-size: var(--text-small); color: var(--color-ink-2); }
.foot-bottom { margin-top: var(--space-7); padding-top: var(--space-5); border-top: var(--rule-1); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-4); align-items: center; }

/* Chat flotante (uno solo) */
.chat-fab { position: fixed; right: var(--space-4); bottom: var(--space-4); z-index: 30; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--color-accent); color: var(--color-accent-ink); box-shadow: 0 10px 30px -8px var(--color-glow); }
.chat-fab svg { width: 26px; height: 26px; }

/* ---------- Tienda ---------- */
.page-head { padding-block: var(--space-6) var(--space-4); }
.page-head h1 { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin-top: var(--space-3); }
.filters { position: sticky; top: 117px; z-index: 10; background: color-mix(in srgb, var(--color-paper) 94%, transparent); backdrop-filter: blur(8px); border-bottom: var(--rule-1); }
.filters .row { display: flex; gap: var(--space-2); overflow-x: auto; scrollbar-width: none; padding-block: var(--space-3); }
.filters .row::-webkit-scrollbar { display: none; }
.filters button { flex: none; min-height: 38px; padding: 0 var(--space-4); border-radius: 999px; border: var(--rule-2); background: transparent; font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-2); cursor: pointer; white-space: nowrap; }
.filters button[aria-pressed="true"] { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }
.shop-meta { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding-block: var(--space-4); }
.shop-meta select { height: 38px; background: var(--color-paper-2); color: var(--color-ink); border: var(--rule-2); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-label); padding: 0 var(--space-3); }
.grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(2, minmax(0, 1fr)); padding-bottom: var(--space-8); }
.pcard { position: relative; display: grid; grid-template-rows: auto 1fr; border: var(--rule-1); border-radius: var(--radius-2); overflow: hidden; background: var(--color-paper-2); transition: border-color var(--dur-1) var(--ease-out); }
.pcard:hover { border-color: var(--color-rule-2); }
.pcard:hover .btn-outline { background: var(--color-accent); color: var(--color-accent-ink); }
.pimg { aspect-ratio: 1; display: grid; place-items: center; padding: var(--space-3); background: var(--color-paper-3); border-bottom: var(--rule-1); text-align: center; }
.pimg span { font-weight: 800; font-size: clamp(1rem, 0.7rem + 1.4vw, 1.6rem); font-variation-settings: "wdth" 80; line-height: 1; color: var(--color-ink-3); }
.pimg em { display: block; margin-top: var(--space-2); font-style: normal; font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.1em; color: var(--color-ink-3); text-transform: uppercase; }
.pbody { padding: var(--space-3); display: grid; gap: var(--space-2); align-content: start; }
.pbody h3 { font-size: 0.98rem; line-height: 1.2; letter-spacing: 0; }
.pbody .btn { min-height: 40px; font-size: 0.72rem; padding: 0 var(--space-3); }
.pcard .sn-tag { position: absolute; top: var(--space-2); left: var(--space-2); background: var(--color-accent); color: var(--color-accent-ink); }
.stretch::after { content: ""; position: absolute; inset: 0; }
.pager { display: flex; gap: var(--space-2); justify-content: center; padding-bottom: var(--space-8); }
.pager a { min-width: 42px; height: 42px; display: grid; place-items: center; border: var(--rule-2); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-small); }
.pager a[aria-current] { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }

/* ---------- Ficha ---------- */
.crumbs { padding-top: var(--space-5); }
.crumbs a:hover { color: var(--color-ink); }
.sn-producto { display: grid; gap: var(--space-6); grid-template-columns: minmax(0, 1fr); padding-block: var(--space-5) var(--space-8); }
.sn-producto .pimg { border: var(--rule-1); border-radius: var(--radius-2); }
.sn-producto .pimg span { font-size: clamp(2rem, 1.4rem + 3vw, 3.4rem); }
.sn-producto h1 { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; }
.sn-producto .desc { color: var(--color-ink-2); margin-top: var(--space-3); max-width: 50ch; }
.opt { margin-top: var(--space-5); border: 0; padding: 0; }
.opt legend { margin-bottom: var(--space-3); padding: 0; }
.opt-row { display: grid; gap: var(--space-2); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opt-row.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.opt input { position: absolute; opacity: 0; pointer-events: none; }
.opt label { display: grid; gap: 2px; min-height: 64px; padding: var(--space-3); border: var(--rule-2); border-radius: var(--radius-1); cursor: pointer; transition: border-color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out); }
.opt label b { font-size: 0.98rem; }
.opt label small { font-family: var(--font-mono); font-size: 0.72rem; color: var(--color-ink-2); }
.opt label .save { color: var(--color-ok); }
.opt input:checked + label { border-color: var(--color-accent); background: linear-gradient(160deg, var(--color-glow), transparent); }
.opt input:focus-visible + label { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.opt input:disabled + label { opacity: 0.4; cursor: not-allowed; text-decoration: line-through; }
.total { margin-top: var(--space-5); padding: var(--space-4); border: var(--rule-1); border-radius: var(--radius-2); background: var(--color-paper-2); display: grid; gap: var(--space-3); }
.total .line { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); }
.total .big { font-family: var(--font-mono); font-weight: 700; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem); }
.hint { font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); }
.hint.ready { color: var(--color-ok); }
.buy { display: grid; gap: var(--space-2); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.facts { margin-top: var(--space-6); display: grid; gap: 0; border-top: var(--rule-1); }
.facts div { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: var(--space-3); padding-block: var(--space-3); border-bottom: var(--rule-1); font-size: var(--text-small); }
.facts dt { margin: 0; }
.facts dd { margin: 0; color: var(--color-ink); }
.incl { list-style: none; padding: 0; margin: var(--space-3) 0 0; display: grid; gap: var(--space-2); }
.incl li { display: flex; gap: var(--space-3); color: var(--color-ink-2); font-size: var(--text-small); }
.incl li::before { content: "—"; color: var(--color-accent-hi); }
.sticky-buy { position: fixed; inset: auto 0 0 0; z-index: 25; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--gutter); background: var(--color-paper-2); border-top: var(--rule-2); }
.sticky-buy .btn { min-height: 46px; }
.has-sticky .chat-fab { bottom: 84px; }
.has-sticky .site-foot { padding-bottom: 110px; }

@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation: none; }
  html { scroll-behavior: auto; }
}

/* ---------- Escritorio ---------- */
@media (min-width: 720px) {
  .icon-link .txt { display: inline; }
  .steps, .cards3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cats .cat:nth-child(odd) { border-right: var(--rule-1); }
  .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .stat { border-bottom: 0; }
  .stat:last-child { border-right: 0; }
  .foot-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
  .pbody { padding: var(--space-4); }
}
@media (min-width: 1000px) {
  .head-cta { display: inline-flex; min-height: 42px; }
  .hero-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-7); align-items: center; }
  .hero .stage { margin-top: 0; }
  .section-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; }
  .section-head .label { grid-column: 1 / -1; }
  .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .sn-producto { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-8); align-items: start; }
  .sn-producto .media { position: sticky; top: 140px; }
  .sticky-buy { display: none; }
  .has-sticky .chat-fab { bottom: var(--space-4); }
  .has-sticky .site-foot { padding-bottom: var(--space-6); }
}

/* Aviso "Deslizá" de la tablet: flechas que laten; desaparece tras la primera interacción */
.swipe-hint { display: flex; justify-content: center; align-items: center; gap: var(--space-2); margin-top: var(--space-2); color: var(--color-ink-2); opacity: 0; transition: opacity 0.5s ease; }
.is-on .swipe-hint { opacity: 1; transition-delay: 2.2s; }
.is-on .swipe-hint.gone { opacity: 0; transition-delay: 0s; }
.swipe-hint .arr { font-size: 1.1rem; color: var(--color-accent-hi); display: inline-block; }
.swipe-hint .l { animation: nudge-l 1.4s ease-in-out infinite; }
.swipe-hint .r { animation: nudge-r 1.4s ease-in-out infinite; }
@keyframes nudge-l { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-5px); } }
@keyframes nudge-r { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .swipe-hint .arr { animation: none; } }

/* Carrito flotante: solo aparece con productos; sube un poco cuando hay barra de compra fija */
.cart-fab { position: fixed; right: var(--space-4); bottom: calc(var(--space-4) + 56px + var(--space-3)); z-index: 30; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--color-paper-3); color: var(--color-ink); border: 1px solid var(--color-accent); box-shadow: 0 10px 30px -8px var(--color-shadow); opacity: 0; scale: 0.6; pointer-events: none; transition: opacity var(--dur-2) var(--ease-out), scale var(--dur-2) var(--ease-out); }
.cart-fab svg { width: 24px; height: 24px; }
.cart-fab .badge-count { top: -4px; right: -4px; }
.cart-fab.show { opacity: 1; scale: 1; pointer-events: auto; }
.cart-fab.bump { animation: cart-bump 0.45s var(--ease-out); }
@keyframes cart-bump { 0% { scale: 1; } 40% { scale: 1.18; } 100% { scale: 1; } }
.has-sticky .cart-fab { bottom: calc(84px + 56px + var(--space-3)); }
@media (min-width: 1000px) { .has-sticky .cart-fab { bottom: calc(var(--space-4) + 56px + var(--space-3)); } }
@media (prefers-reduced-motion: reduce) { .cart-fab, .cart-fab.bump { transition: none; animation: none; } }

/* Vibración del carrito flotante (recreada del snippet 7 del sitio actual): cada 4 s mientras haya productos */
.cart-fab.show { animation: cart-shake 4s ease-in-out infinite; }
.cart-fab.show.bump { animation: cart-bump 0.45s var(--ease-out), cart-shake 4s ease-in-out 0.45s infinite; }
.cart-fab:hover, .cart-fab:focus-visible { background: var(--color-accent); color: var(--color-accent-ink); animation-play-state: paused; }
@keyframes cart-shake {
  0%, 100% { transform: translateX(0); }
  10% { transform: translateX(-2px) rotate(-3deg); }
  20% { transform: translateX(2px) rotate(3deg); }
  30% { transform: translateX(-2px) rotate(-3deg); }
  40% { transform: translateX(2px) rotate(3deg); }
  50% { transform: translateX(-1px); }
  60% { transform: translateX(1px); }
  70% { transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce) { .cart-fab.show, .cart-fab.show.bump { animation: none; } }

/* ---------- WordPress ---------- */
/* La cabecera fija va en el contenedor de la plantilla (template part), respetando la barra de admin */
.wp-site-blocks > .sn-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 20; }
.sn-header .site-head { position: relative; top: auto; }
.wp-site-blocks > * { margin-block: 0; }
.sn-page { padding-block: var(--space-7) var(--space-8); padding-inline: var(--gutter); }
.sn-page .page-title { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin-bottom: var(--space-5); }
.sn-page a { color: var(--color-accent-hi); }
.logo strong { font-weight: 800; letter-spacing: -0.02em; }
@media screen and (max-width: 600px) { .wp-site-blocks > .sn-header { top: 0; } }

/* ---------- Ajustes móvil (pedido del dueño, 2026-10-09) ---------- */
/* Logo: que el flex no lo achique a 0 (img con max-width:100% dentro de un ítem que encoge) */
.logo { flex: none; display: block; }
.logo img { max-width: none; width: 52px; height: 52px; }

/* Portada: celular = texto → tablet → botones; escritorio = texto+botones a la izquierda, tablet a la derecha */
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "media" "actions"; }
.hero-copy { grid-area: copy; }
.hero-media { grid-area: media; }
.hero-actions { grid-area: actions; margin-top: var(--space-5); }
.hero-actions .hero-ctas { margin-top: 0; }

/* Título en 2 líneas exactas en celular: "Del pago a tus cuentas," / "en minutos" */
.hero h1 .l { display: block; white-space: nowrap; }
@media (max-width: 999px) {
  .hero h1 { max-width: none; font-size: clamp(1.7rem, 8.3vw, 3.6rem); font-variation-settings: "wdth" 76; }
}
@media (min-width: 1000px) {
  .hero-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); grid-template-rows: auto auto; grid-template-areas: "copy media" "actions media"; column-gap: var(--space-7); row-gap: 0; align-items: start; }
  .hero-copy { align-self: end; }
  .hero-media { align-self: center; }
  .hero h1 .l { display: inline; white-space: normal; }
}

/* Carrito flotante centrado sobre el botón del chat Carlos (snippet 30: 68px, right 24px, bottom 14px) */
.cart-fab { right: calc(24px + (68px - 52px) / 2); bottom: calc(14px + 68px + 12px); }

/* Ajustes móvil v2: cabecera que entra en 360px, título más grande, sin hueco, botones lado a lado */
.sn-search { min-width: 0; flex: 1 1 auto; }
.sn-search input { width: 100%; min-width: 0; }
.head-actions { flex: none; }
@media (max-width: 999px) {
  .hero h1 { font-size: clamp(1.9rem, 9.6vw, 3.6rem); font-variation-settings: "wdth" 78; }
  .hero .stage { margin-top: var(--space-2); }
  .hero-actions { margin-top: var(--space-4); }
  .hero-actions .hero-ctas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
  .hero-actions .btn { padding-inline: var(--space-3); }
}
@media (max-width: 420px) { .head-row { gap: var(--space-2); } }
@media (max-width: 999px) { .hero .stage { height: clamp(270px, 76vw, 440px); } }

/* ---------- Tablet: tarjetas "Ver más" en los dos extremos (llevan a la tienda) ---------- */
.c-card.c-more { display: grid; place-content: center; gap: var(--space-2); text-align: center; background: radial-gradient(120% 120% at 50% 0%, var(--color-glow-hi), var(--color-paper-0)); border-color: var(--color-accent); color: var(--color-ink); }
.c-more-t { font-weight: 800; font-size: clamp(1.25rem, 1rem + 1.2vw, 1.7rem); line-height: 0.95; text-transform: uppercase; font-variation-settings: "wdth" 80; }
.c-more-s { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-accent-hi); }
.on-more .ticket .seal { visibility: hidden; }

/* ---------- Categorías v2: fondo más oscuro, filas separadas, info en 3 niveles ---------- */
.cats { background: var(--color-paper-0); border: 1px solid var(--color-rule-2); gap: 0; }
.cat { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "title arrow" "meta meta" "tags tags"; gap: var(--space-2) var(--space-4); padding: var(--space-5); border-bottom: 1px solid var(--color-rule-2); }
.cats .cat:last-child { border-bottom: 0; }
.cat h3 { grid-area: title; font-size: var(--text-h3); line-height: 1.15; }
.cat .arrow { grid-area: arrow; align-self: center; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--color-rule-2); border-radius: 50%; font-size: 1rem; color: var(--color-ink-2); }
.cat:hover .arrow { border-color: var(--color-accent); color: var(--color-accent-hi); transform: translateX(3px); }
.cat-meta { grid-area: meta; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2) var(--space-3); }
.cat-meta .label { color: var(--color-ink-2); }
.cat-meta .label::after { content: "·"; margin-left: var(--space-3); color: var(--color-ink-3); }
.cat-meta .price { font-size: 1rem; color: var(--color-ink); }
.cat-meta .price small { color: var(--color-ink-2); }
.cat-tags { grid-area: tags; display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-1); }
.tagp { display: inline-flex; align-items: center; min-height: 28px; padding: 0 var(--space-3); border: 1px solid var(--color-rule-2); border-radius: 999px; background: var(--color-paper-2); font-size: 0.8rem; line-height: 1.2; color: var(--color-ink); text-transform: none; }
.tagp.more { border-style: dashed; color: var(--color-ink-2); background: transparent; }
@media (min-width: 720px) {
  .cats .cat:nth-child(odd) { border-right: 1px solid var(--color-rule-2); }
  .cats .cat:nth-last-child(-n+2):nth-child(odd), .cats .cat:last-child { border-bottom: 0; }
  .cats .cat:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}

/* Entregas recientes: etiqueta y fecha no se pisan en columnas angostas */
.card .top { flex-wrap: wrap; row-gap: var(--space-2); }

/* Categorías: el nombre como etiqueta rojo vino (distinta de las etiquetas grises de productos) */
.cat h3 { justify-self: start; display: inline-flex; align-items: center; padding: 6px var(--space-3); border: 1px solid var(--color-accent); border-radius: var(--radius-1); background: color-mix(in srgb, var(--color-accent) 18%, var(--color-paper-0)); color: var(--color-ink); font-size: clamp(1.02rem, 0.95rem + 0.4vw, 1.2rem); line-height: 1.15; }
.cat:hover h3 { background: color-mix(in srgb, var(--color-accent) 30%, var(--color-paper-0)); }

/* ---------- Tablet: aviso "Ver más" pegado al borde (reemplaza las tarjetas c-more de 0.1.3) ---------- */
.edge-more { position: absolute; top: 50%; z-index: 30; display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--space-3); border: 1px solid var(--color-accent); border-radius: 999px; background: var(--color-paper-0); color: var(--color-ink); font-family: var(--font-mono); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 10px 28px -8px var(--color-shadow), 0 0 18px var(--color-ember-2); opacity: 0; pointer-events: none; transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); }
.edge-l { left: 2%; transform: translate(-14px, -50%); }
.edge-r { right: 2%; transform: translate(14px, -50%); }
.stage.at-start .edge-l, .stage.at-end .edge-r { opacity: 1; pointer-events: auto; transform: translate(0, -50%); }
.edge-more:hover, .edge-more:focus-visible { background: var(--color-accent); color: var(--color-accent-ink); }
.edge-more.nudge { animation: edge-nudge 0.4s var(--ease-out); }
@keyframes edge-nudge { 40% { scale: 1.08; } }
@media (prefers-reduced-motion: reduce) { .edge-more { transition: opacity 0.15s; } .edge-more.nudge { animation: none; } }

/* ---------- Tienda / categorías / búsqueda (etapa 2) ---------- */
.sn-shop { padding-bottom: var(--space-8); }
.sn-shop .wc-block-components-notices, .sn-shop .woocommerce-notices-wrapper { width: min(100% - 2 * var(--gutter), var(--wrap)); margin: var(--space-4) auto 0; }
.pimg { padding: 0; overflow: hidden; }
.pimg img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--dur-2) var(--ease-out); }
.pcard:hover .pimg img { transform: scale(1.03); }
.pbody .price { font-size: 1.05rem; }
.pager { flex-wrap: wrap; padding-top: var(--space-6); }
.pager .page-numbers { min-width: 42px; height: 42px; display: grid; place-items: center; padding: 0 var(--space-2); border: var(--rule-2); border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-small); color: var(--color-ink); }
.pager .page-numbers.current { background: var(--color-ink); color: var(--color-paper); border-color: var(--color-ink); }
.pager .page-numbers.dots { border: 0; }
.pager a.page-numbers:hover { border-color: var(--color-accent); color: var(--color-accent-hi); }
.shop-order select { height: 40px; }
.empty { padding: var(--space-8) 0; display: grid; gap: var(--space-4); justify-items: start; color: var(--color-ink-2); }
.cat-nav a[aria-current="page"] { opacity: 1; color: var(--color-ink); background: var(--color-head); box-shadow: inset 0 -2px 0 var(--color-accent); }
@media (prefers-reduced-motion: reduce) { .pcard:hover .pimg img { transform: none; } }

/* ---------- Ficha de producto (etapa 2) ---------- */
.sn-product .crumbs { padding-top: var(--space-5); color: var(--color-ink-2); }
.sn-product .crumbs a:hover { color: var(--color-ink); }
.sn-producto .pimg { aspect-ratio: 1; border: var(--rule-1); border-radius: var(--radius-2); background: var(--color-paper-3); }
.sn-producto h1 { margin-top: var(--space-2); }
.sn-producto .desc p { margin: 0; }
/* Formulario real de WooCommerce: se ocultan los desplegables (los reemplazan los botones), se conserva todo lo demás */
.sn-form table.variations { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sn-form .single_variation_wrap .woocommerce-variation-price, .sn-form .single_variation_wrap .woocommerce-variation-description { display: none; }
.sn-form .woocommerce-variation-availability { font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); margin-bottom: var(--space-2); }
.sn-form .reset_variations { font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); text-decoration: underline; }
.sn-form form.cart { margin: 0; }
.sn-form .variations_button, .sn-form form.cart:not(.variations_form) { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-2); align-items: stretch; }
.sn-form .quantity input.qty { width: 64px; height: 48px; background: var(--color-paper); color: var(--color-ink); border: var(--rule-2); border-radius: var(--radius-1); text-align: center; font-family: var(--font-mono); }
.sn-form .single_add_to_cart_button { min-height: 48px; border-radius: var(--radius-1); font-family: var(--font-mono); font-size: var(--text-small); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; background: transparent !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; }
.sn-form .single_add_to_cart_button:hover { border-color: var(--color-accent) !important; color: var(--color-accent-hi) !important; }
/* "Comprar ahora" (snippet 11): acción principal, rojo lleno, ancho completo */
.sn-form button[name="streamnet_comprar_ahora"] { grid-column: 1 / -1; order: -1; margin: 0 !important; background: var(--color-accent) !important; border-color: var(--color-accent) !important; color: var(--color-accent-ink) !important; }
.sn-form button[name="streamnet_comprar_ahora"]:hover { background: var(--color-accent-hi) !important; color: var(--color-accent-ink) !important; }
.sn-form .single_add_to_cart_button.disabled { opacity: 0.45; cursor: not-allowed; }
.hint.flash { animation: hint-flash 0.9s var(--ease-out); }
@keyframes hint-flash { 30% { color: var(--color-accent-hi); } }
.sn-incluye-t { margin-top: var(--space-6); }
.sn-incluye { margin-top: var(--space-3); color: var(--color-ink-2); font-size: var(--text-small); }
.sn-incluye ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-2); }
.sn-incluye li { display: flex; gap: var(--space-3); }
.sn-incluye li::before { content: "—"; color: var(--color-accent-hi); }
.sn-related { border-top: var(--rule-1); }
.sn-related .grid { padding-bottom: 0; }
.sticky-buy { display: flex; }
.sticky-buy .price small { margin-right: var(--space-1); }
/* Celular: la barra fija ocupa el borde inferior → chat Carlos y carrito suben */
@media (max-width: 999px) {
  body.has-sticky #carlos-chat-btn { bottom: 84px !important; }
  body.has-sticky #carlos-chat-panel { bottom: 162px !important; }
  body.has-sticky .cart-fab { bottom: calc(84px + 68px + 12px); }
  body.has-sticky .site-foot { padding-bottom: 110px; }
}
@media (min-width: 1000px) { .sticky-buy { display: none; } }
@media (min-width: 1000px) { body.has-sticky .cart-fab { bottom: calc(14px + 68px + 12px); } }
@media (max-width: 999px) { body.has-sticky #streamnet-tour-btn { bottom: 90px !important; } }

/* =========================================================
   CARRITO (bloque de WooCommerce) — solo estilos (etapa 2c)
   ========================================================= */
.sn-cart-page, .sn-checkout-page { padding-block: var(--space-6) var(--space-8); }
.sn-cart-page .page-title, .sn-checkout-page .page-title { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin: 0 0 var(--space-5); }
.wc-block-cart { color: var(--color-ink); }
.wc-block-cart .wc-block-cart-items th { font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-2); font-weight: 500; border-bottom: 1px solid var(--color-rule-2) !important; }
.wc-block-cart .wc-block-cart-items__row td { border-top: 0 !important; border-bottom: 1px solid var(--color-rule) !important; padding-block: var(--space-4) !important; }
.wc-block-cart .wc-block-cart-item__image img { border-radius: var(--radius-1); border: var(--rule-1); }
.wc-block-components-product-name { color: var(--color-ink) !important; font-weight: 700; font-size: 1rem; text-decoration: none !important; }
.wc-block-components-product-name:hover { color: var(--color-accent-hi) !important; }
.wc-block-cart .wc-block-components-product-price, .wc-block-cart .wc-block-cart-item__total { font-family: var(--font-mono); color: var(--color-ink); }
.wc-block-components-product-metadata, .wc-block-components-product-details { color: var(--color-ink-2); font-size: 0.82rem; }
.wc-block-components-sale-badge { background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border: 0 !important; border-radius: 2px !important; font-family: var(--font-mono); }
.wc-block-components-quantity-selector { border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; background: var(--color-paper-0); }
.wc-block-components-quantity-selector::after { border: 0 !important; }
.wc-block-components-quantity-selector input { color: var(--color-ink) !important; background: transparent !important; font-family: var(--font-mono); }
.wc-block-components-quantity-selector button { color: var(--color-ink-2) !important; }
.wc-block-components-quantity-selector button:hover { color: var(--color-accent-hi) !important; }
.wc-block-cart-item__remove-link { color: var(--color-ink-2) !important; }
.wc-block-cart-item__remove-link:hover { color: var(--color-accent-hi) !important; }
.wc-block-cart .wc-block-components-sidebar { background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); padding: var(--space-5) !important; align-self: start; }
.wc-block-cart .wc-block-cart__totals-title { font-family: var(--font-mono) !important; font-size: var(--text-label) !important; letter-spacing: 0.12em; color: var(--color-ink-2) !important; text-align: left !important; }
.wc-block-components-totals-item { color: var(--color-ink); }
.wc-block-components-totals-item__value { font-family: var(--font-mono); }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-weight: 800; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: 1.4rem; font-weight: 700; }
.wc-block-components-totals-wrapper { border-top: 1px solid var(--color-rule) !important; }
.wc-block-components-panel__button { color: var(--color-ink) !important; }
.wc-block-components-text-input input, .wc-block-components-text-input input:focus { background: var(--color-paper-0) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; }
.wc-block-components-text-input label { color: var(--color-ink-2) !important; }
.wc-block-cart__submit-button, .wc-block-components-button:not(.is-link) { background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border: 0 !important; border-radius: var(--radius-1) !important; min-height: 52px; font-family: var(--font-mono) !important; font-weight: 700 !important; letter-spacing: 0.1em; text-transform: uppercase; }
.wc-block-cart__submit-button:hover, .wc-block-components-button:not(.is-link):hover { background: var(--color-accent-hi) !important; }

/* =========================================================
   CHECKOUT (formulario clásico) — solo estilos. La estructura
   la usan los snippets 13 (comprobante), 15 (Binance), 16, 17, 18
   ========================================================= */
.sn-checkout-page .woocommerce { color: var(--color-ink); }
.sn-checkout-page .woocommerce-info, .sn-checkout-page .woocommerce-message { background: var(--color-paper-2) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-left: 3px solid var(--color-accent) !important; border-radius: var(--radius-1); }
.sn-checkout-page .woocommerce-info::before { color: var(--color-accent-hi) !important; }
.sn-checkout-page .woocommerce-info a, .sn-checkout-page .woocommerce-privacy-policy-text a { color: var(--color-accent-hi); }
.sn-checkout-page .woocommerce-error { background: color-mix(in srgb, var(--color-accent) 14%, var(--color-paper-0)) !important; color: var(--color-ink) !important; border: 1px solid var(--color-accent) !important; }
.sn-checkout-page form.checkout_coupon { background: var(--color-paper-2); border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2); padding: var(--space-4); }
.sn-checkout-page h3, .sn-checkout-page #order_review_heading { font-size: var(--text-h3); font-weight: 800; margin: var(--space-5) 0 var(--space-3); }
.sn-checkout-page .form-row label { color: var(--color-ink-2); font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.08em; text-transform: uppercase; }
.sn-checkout-page .form-row .required { color: var(--color-accent-hi); text-decoration: none; }
.sn-checkout-page input.input-text, .sn-checkout-page select, .sn-checkout-page textarea, .sn-checkout-page .select2-container .select2-selection { background: var(--color-paper-0) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; min-height: 46px; padding: 0 var(--space-3); font-size: 1rem; }
.sn-checkout-page input.input-text:focus, .sn-checkout-page select:focus, .sn-checkout-page textarea:focus { border-color: var(--color-accent) !important; outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-accent) 25%, transparent); }
.sn-checkout-page input[type="checkbox"] { accent-color: var(--color-accent); }
.sn-checkout-page #order_review { background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); padding: var(--space-4); }
.sn-checkout-page table.shop_table { background: transparent !important; border: 0 !important; color: var(--color-ink); border-collapse: collapse; width: 100%; }
.sn-checkout-page table.shop_table tr, .sn-checkout-page table.shop_table th, .sn-checkout-page table.shop_table td { background: transparent !important; color: var(--color-ink) !important; border-color: var(--color-rule) !important; }
.sn-checkout-page table.shop_table thead th { font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-2) !important; font-weight: 500; }
.sn-checkout-page table.shop_table td.product-total, .sn-checkout-page table.shop_table tfoot td { font-family: var(--font-mono); text-align: right; }
.sn-checkout-page table.shop_table .product-quantity { color: var(--color-ink-2); }
.sn-checkout-page table.shop_table dl.variation { color: var(--color-ink-2); font-size: 0.82rem; margin: var(--space-1) 0 0; }
.sn-checkout-page table.shop_table tfoot .order-total th, .sn-checkout-page table.shop_table tfoot .order-total td { font-size: 1.25rem; font-weight: 800; border-top: 1px solid var(--color-rule-2) !important; }
.sn-checkout-page #payment { background: transparent !important; border-radius: 0; margin-top: var(--space-4); }
.sn-checkout-page #payment ul.payment_methods { border-bottom: 1px solid var(--color-rule) !important; padding: 0 0 var(--space-3) !important; }
.sn-checkout-page #payment ul.payment_methods li { color: var(--color-ink); padding: var(--space-2) 0; }
.sn-checkout-page #payment ul.payment_methods li input { accent-color: var(--color-accent); }
.sn-checkout-page #payment ul.payment_methods li label { font-weight: 700; cursor: pointer; }
.sn-checkout-page #payment div.payment_box { background: var(--color-paper-0) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2); border-radius: var(--radius-2) !important; }
.sn-checkout-page #payment div.payment_box::before { border-bottom-color: var(--color-rule-2) !important; }
.sn-checkout-page #payment div.payment_box p, .sn-checkout-page #payment div.payment_box li { color: var(--color-ink-2) !important; }
.sn-checkout-page #payment .place-order { padding: var(--space-4) 0 0 !important; }
.sn-checkout-page .woocommerce-privacy-policy-text, .sn-checkout-page .woocommerce-terms-and-conditions-wrapper { color: var(--color-ink-2); font-size: 0.85rem; }
.sn-checkout-page #place_order { width: 100%; min-height: 54px; background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border: 0 !important; border-radius: var(--radius-1) !important; font-family: var(--font-mono); font-size: var(--text-small); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.sn-checkout-page #place_order:hover { background: var(--color-accent-hi) !important; }
/* Comprobante (snippet 13): estilos en línea → se adaptan al fondo oscuro sin tocar su funcionamiento */
#sn_comprobante_caja { background: var(--color-paper-0) !important; border: 2px dashed var(--color-accent) !important; border-radius: var(--radius-2) !important; color: var(--color-ink) !important; }
#sn_comprobante_caja:hover { background: color-mix(in srgb, var(--color-accent) 10%, var(--color-paper-0)) !important; }
#sn_comprobante_titulo { color: var(--color-ink) !important; }
#sn_comprobante_subtitulo { color: var(--color-ink-2) !important; }
@media (min-width: 1000px) {
  .sn-checkout-page form.checkout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 470px); column-gap: var(--space-7); align-items: start; }
  .sn-checkout-page form.checkout > * { grid-column: 1; }
  .sn-checkout-page form.checkout > #order_review_heading, .sn-checkout-page form.checkout > #order_review { grid-column: 2; }
  .sn-checkout-page form.checkout > #customer_details { grid-row: 1 / span 3; }
  .sn-checkout-page form.checkout > #order_review_heading { grid-row: 1; margin-top: 0; }
  .sn-checkout-page form.checkout > #order_review { grid-row: 2; }
  .sn-checkout-page #customer_details .col-1, .sn-checkout-page #customer_details .col-2 { width: 100%; float: none; }
}
@media (max-width: 600px) {
  .sn-checkout-page .form-row-first, .sn-checkout-page .form-row-last { width: 100% !important; float: none !important; }
}

/* Avisos de WooCommerce con estilo de bloques (ej. "¿Tienes un cupón?" en el checkout clásico) */
.sn-checkout-page .wc-block-components-notice-banner, .sn-cart-page .wc-block-components-notice-banner { background: var(--color-paper-2) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-left: 3px solid var(--color-accent) !important; border-radius: var(--radius-1) !important; }
.wc-block-components-notice-banner > svg { fill: var(--color-accent-hi) !important; background: transparent !important; }
.wc-block-components-notice-banner a { color: var(--color-accent-hi) !important; }
.wc-block-components-notice-banner.is-error { border-color: var(--color-accent) !important; background: color-mix(in srgb, var(--color-accent) 14%, var(--color-paper-0)) !important; }
.wc-block-components-notice-banner.is-success { border-left-color: var(--color-ok) !important; }
.wc-block-components-notice-banner.is-success > svg { fill: var(--color-ok) !important; }

/* =========================================================
   MI CUENTA (etapa 2d) — solo estilos. Contenido de WooCommerce
   + snippet 12 (saludo, Mis Cuentas, Renovaciones) + snippet 20 (Descargas)
   ========================================================= */
.sn-cuenta-page { padding-block: var(--space-6) var(--space-8); }
.sn-cuenta-page .page-title { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin: 0 0 var(--space-5); }
.sn-cuenta-page .woocommerce { color: var(--color-ink); }
.sn-cuenta-page .woocommerce-MyAccount-navigation, .sn-cuenta-page .woocommerce-MyAccount-content { float: none !important; width: auto !important; }
.sn-cuenta-page a { color: var(--color-accent-hi); }

/* Menú de la cuenta */
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-2); overflow-x: auto; scrollbar-width: none; padding-bottom: var(--space-2); }
.woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
.woocommerce-MyAccount-navigation li { margin: 0; flex: none; }
.woocommerce-MyAccount-navigation li a { display: flex; align-items: center; min-height: 40px; padding: 0 var(--space-4); border: 1px solid var(--color-rule-2); border-radius: 999px; color: var(--color-ink-2) !important; text-decoration: none !important; font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
.woocommerce-MyAccount-navigation li a:hover { color: var(--color-ink) !important; border-color: var(--color-accent); }
.woocommerce-MyAccount-navigation li.is-active a { background: color-mix(in srgb, var(--color-accent) 18%, var(--color-paper-0)); border-color: var(--color-accent); color: var(--color-ink) !important; }
.woocommerce-MyAccount-navigation-link--customer-logout a { border-style: dashed; }
.woocommerce-MyAccount-content { margin-top: var(--space-5); min-width: 0; }
@media (min-width: 1000px) {
  .sn-cuenta-page .woocommerce:has(.woocommerce-MyAccount-navigation) { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--space-7); align-items: start; }
  .woocommerce-MyAccount-navigation { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 140px); background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); padding: var(--space-3); }
  .woocommerce-MyAccount-navigation ul { flex-direction: column; overflow: visible; padding: 0; gap: 2px; }
  .woocommerce-MyAccount-navigation li a { border: 0; border-radius: var(--radius-1); min-height: 42px; border-left: 2px solid transparent; }
  .woocommerce-MyAccount-navigation li.is-active a { border-left-color: var(--color-accent); }
  .woocommerce-MyAccount-navigation-link--customer-logout { margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--color-rule); }
  .woocommerce-MyAccount-content { margin-top: 0; }
}

/* Escritorio: se oculta el saludo genérico de WooCommerce (el snippet 12 trae el suyo) */
.woocommerce-MyAccount-content:has(> .sn-hero) > p { display: none; }
.sn-hero { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); padding: var(--space-5); background: radial-gradient(120% 140% at 0% 0%, var(--color-glow-hi), var(--color-paper-2) 60%); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); }
.sn-hero-saludo { display: flex; align-items: center; gap: var(--space-4); min-width: 0; }
.sn-saludo-avatar { flex: none; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--color-accent); color: var(--color-accent-ink); font-weight: 800; font-size: 1.5rem; }
.sn-saludo-nombre { font-size: var(--text-h3); font-weight: 800; }
.sn-saludo-resumen { color: var(--color-ink-2); font-size: var(--text-small); margin-top: var(--space-1); }
.sn-saludo-sub { color: var(--color-ink-3); font-size: 0.8rem; margin-top: var(--space-1); }
.sn-hero-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.sn-stat { min-width: 86px; padding: var(--space-3); text-align: center; background: var(--color-paper-0); border: 1px solid var(--color-rule-2); border-radius: var(--radius-1); }
.sn-stat b { display: block; font-size: 1.6rem; font-weight: 800; line-height: 1; }
.sn-stat span { display: block; margin-top: var(--space-1); font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink-2); }
.sn-stat-ok b { color: var(--color-ok); }
.sn-stat-warn b { color: var(--color-accent-hi); }
/* Tarjetas de acceso del snippet 12 (estilos en línea → se ajustan al sistema) */
.woocommerce-MyAccount-content a[style*="#14141a"] { background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2) !important; transition: border-color var(--dur-1) var(--ease-out), transform var(--dur-1) var(--ease-out); }
.woocommerce-MyAccount-content a[style*="#14141a"]:hover { border-color: var(--color-accent) !important; transform: translateY(-2px); }

/* Mis Cuentas / Renovaciones (snippet 12) */
.sn-mis-cuentas { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--space-4) !important; }
.sn-cuenta-card { background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2) !important; padding: var(--space-5) !important; }
.sn-cuenta-card h3 { font-size: 1.1rem; color: var(--color-ink) !important; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.sn-cuenta-card.sn-vencida { opacity: 0.7 !important; border-color: var(--color-accent) !important; }
.sn-cuenta-table td { padding: var(--space-2) 0 !important; color: var(--color-ink) !important; border-bottom: 1px solid var(--color-rule) !important; font-family: var(--font-mono); font-size: 0.85rem; word-break: break-all; }
.sn-cuenta-table td:first-child { color: var(--color-ink-2) !important; font-family: var(--font-display); width: 120px !important; word-break: normal; }
.sn-badge-vencida { font-family: var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; border-radius: 2px !important; }
.sn-cuenta-card input[type="checkbox"] { accent-color: var(--color-accent); width: 18px !important; height: 18px !important; }
.sn-cuenta-page button[name="sn_renovar_submit"] { background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border-radius: var(--radius-1) !important; min-height: 48px; font-family: var(--font-mono); font-weight: 700 !important; letter-spacing: 0.1em; text-transform: uppercase; }
.woocommerce-MyAccount-content > p:only-of-type, .woocommerce-MyAccount-content > p:first-child:last-child { padding: var(--space-6); text-align: center; color: var(--color-ink-2); background: var(--color-paper-2); border: 1px dashed var(--color-rule-2); border-radius: var(--radius-2); }

/* Pedidos */
.sn-cuenta-page table.shop_table, .sn-cuenta-page table.woocommerce-orders-table { width: 100%; background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2); border-collapse: separate; border-spacing: 0; overflow: hidden; color: var(--color-ink); }
.sn-cuenta-page table.shop_table th, .sn-cuenta-page table.shop_table td { background: transparent !important; color: var(--color-ink) !important; border: 0 !important; border-bottom: 1px solid var(--color-rule) !important; padding: var(--space-3) var(--space-4) !important; text-align: left; }
.sn-cuenta-page table.shop_table thead th { font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-2) !important; font-weight: 500; }
.sn-cuenta-page table.shop_table tr:last-child td { border-bottom: 0 !important; }
.woocommerce-orders-table__cell-order-number a { font-family: var(--font-mono); font-weight: 700; color: var(--color-ink) !important; }
.woocommerce-orders-table__cell-order-total { font-family: var(--font-mono); }
.woocommerce-orders-table__cell-order-status { font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-accent-hi) !important; }
.sn-cuenta-page .woocommerce-button, .sn-cuenta-page a.button, .sn-cuenta-page .button:not([name="sn_renovar_submit"]) { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 var(--space-4) !important; background: transparent !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; font-family: var(--font-mono); font-size: var(--text-label) !important; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none !important; }
.sn-cuenta-page .woocommerce-button:hover, .sn-cuenta-page a.button:hover { border-color: var(--color-accent) !important; color: var(--color-accent-hi) !important; }
@media (max-width: 720px) {
  .sn-cuenta-page table.shop_table_responsive thead { display: none; }
  .sn-cuenta-page table.shop_table_responsive tr { display: block; border-bottom: 1px solid var(--color-rule-2); }
  .sn-cuenta-page table.shop_table_responsive td { display: flex; justify-content: space-between; gap: var(--space-3); border-bottom: 0 !important; padding: var(--space-2) var(--space-4) !important; }
  .sn-cuenta-page table.shop_table_responsive td::before { content: attr(data-title); font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); text-transform: uppercase; }
}

/* Formularios: datos de la cuenta, ingreso y registro */
.sn-cuenta-page .form-row label, .sn-cuenta-page .woocommerce-form-row label { color: var(--color-ink-2); font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.08em; text-transform: uppercase; }
.sn-cuenta-page .required { color: var(--color-accent-hi); text-decoration: none; }
.sn-cuenta-page input.input-text, .sn-cuenta-page input[type="email"], .sn-cuenta-page input[type="password"], .sn-cuenta-page input[type="text"], .sn-cuenta-page input[type="tel"], .sn-cuenta-page select, .sn-cuenta-page textarea { width: 100%; background: var(--color-paper-0) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; min-height: 46px; padding: 0 var(--space-3); font-size: 1rem; }
.sn-cuenta-page input:focus, .sn-cuenta-page select:focus, .sn-cuenta-page textarea:focus { border-color: var(--color-accent) !important; outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-accent) 25%, transparent); }
.sn-cuenta-page fieldset { border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); padding: var(--space-4); margin: var(--space-5) 0; }
.sn-cuenta-page legend { padding: 0 var(--space-2); font-weight: 800; }
.sn-cuenta-page em, .sn-cuenta-page .woocommerce-form-row span em { color: var(--color-ink-3); font-size: 0.82rem; }
.sn-cuenta-page .show-password-input { color: var(--color-ink-2); }
.sn-cuenta-page button[type="submit"]:not([name="sn_renovar_submit"]), .sn-cuenta-page .woocommerce-Button, .sn-cuenta-page .woocommerce-form-login__submit, .sn-cuenta-page .woocommerce-form-register__submit { min-height: 48px; padding: 0 var(--space-5) !important; background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border: 0 !important; border-radius: var(--radius-1) !important; font-family: var(--font-mono); font-size: var(--text-small) !important; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.sn-cuenta-page button[type="submit"]:hover { background: var(--color-accent-hi) !important; }
/* Ingreso / registro (visitantes sin sesión): una tarjeta, dos vistas (woocommerce/myaccount/form-login.php) */
.sn-cuenta-page:has(.sn-acceso) .page-title { display: none; }
.sn-acceso { position: relative; max-width: 460px; margin: var(--space-6) auto var(--space-7); padding: var(--space-6) var(--space-5); background: radial-gradient(120% 70% at 100% 0%, var(--color-glow-hi) 0%, transparent 60%), radial-gradient(90% 60% at 0% 100%, var(--color-glow-soft) 0%, transparent 70%), var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.9); overflow: hidden; }
.sn-acceso::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, var(--color-accent), transparent); }
.sn-acceso-vista[hidden] { display: none; }
.sn-acceso .eyebrow { display: block; text-align: center; }
.sn-acceso h2 { text-align: center; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2rem); font-weight: 800; line-height: 1.1; margin: var(--space-2) 0 var(--space-3); }
.sn-acceso-sub { text-align: center; color: var(--color-ink-2); margin: 0 auto var(--space-5); max-width: 34ch; }
.sn-acceso form.login, .sn-acceso form.register { border: 0 !important; padding: 0 !important; margin: 0 !important; }
.sn-acceso .form-row { margin: 0 0 var(--space-4) !important; padding: 0 !important; }
.sn-acceso .form-row label { display: block; margin-bottom: var(--space-2); }
.sn-acceso input::placeholder { color: var(--color-ink-3); opacity: 1; }
.sn-acceso-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.sn-acceso-fila::before, .sn-acceso-fila::after { display: none !important; } /* el "clearfix" de WooCommerce contaba como elemento y centraba la fila */
.sn-cuenta-page .sn-acceso .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: var(--space-2); margin: 0; color: var(--color-ink-2); font-family: var(--font-display); font-size: var(--text-small); letter-spacing: 0; text-transform: none; cursor: pointer; }
.sn-acceso .woocommerce-form-login__rememberme input { width: 18px; height: 18px; accent-color: var(--color-accent); }
.sn-acceso-olvido { color: var(--color-ink-2); font-size: var(--text-small); }
.sn-acceso-olvido:hover { color: var(--color-ink); }
.sn-cuenta-page .sn-acceso button[type="submit"] { width: 100%; }
.sn-acceso-nota { color: var(--color-ink-2); font-size: var(--text-small); margin: 0 0 var(--space-4); }
.sn-cuenta-page .woocommerce-privacy-policy-text { color: var(--color-ink-3); font-size: 0.82rem; margin-bottom: var(--space-4); }
.sn-acceso-cambio { text-align: center; color: var(--color-ink-2); margin: var(--space-5) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--color-rule); }
.sn-acceso-cambio a { color: var(--color-ink); font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-accent); text-underline-offset: 3px; }
.sn-acceso-cambio a:hover { color: var(--color-accent-hi); }
@media (max-width: 480px) { .sn-acceso { margin-top: var(--space-4); padding: var(--space-5) var(--space-4); } }

/* Avisos dentro de Mi Cuenta */
.sn-cuenta-page .wc-block-components-notice-banner, .sn-cuenta-page .woocommerce-info, .sn-cuenta-page .woocommerce-message { background: var(--color-paper-2) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-left: 3px solid var(--color-accent) !important; border-radius: var(--radius-1) !important; }

/* Mi Cuenta: posiciones explícitas (WooCommerce pone antes un contenedor de avisos vacío que corría la grilla) */
.woocommerce-MyAccount-navigation li { padding: 0 !important; border: 0 !important; }
@media (min-width: 1000px) {
  .sn-cuenta-page .woocommerce:has(.woocommerce-MyAccount-navigation) > * { grid-column: 1 / -1; }
  .sn-cuenta-page .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: 2; }
  .sn-cuenta-page .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-MyAccount-content { grid-column: 2; grid-row: 2; }
  .sn-cuenta-page .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-notices-wrapper:empty { display: none; }
}

/* =========================================================
   CHAT (botón del snippet 30) + CARRITO: pareja de botones flotantes
   Solo estilos/clases desde el tema; el funcionamiento del chat no cambia.
   ========================================================= */
/* 1) Mismo tamaño (56px). Chat = rojo lleno (principal); carrito = oscuro con borde (secundario) */
#carlos-chat-btn {
  width: 56px !important; height: 56px !important; right: 24px !important; bottom: 14px !important;
  /* 2) Ícono de línea fina, mismo trazo que la cabecera */
  background: var(--color-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF5F2' stroke-width='1.8' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M4 5h16v11H10l-5 4v-4H4z'/%3E%3Cpath d='M8 9.5h8M8 12.5h5'/%3E%3C/svg%3E") center / 26px no-repeat !important;
  /* 3) Sin brillo, pulso ni agrandado: sombra suave */
  animation: none !important; transform: none !important; border: 0 !important;
  box-shadow: 0 10px 28px -10px var(--color-shadow) !important;
  transition: background-color var(--dur-1) var(--ease-out) !important;
}
#carlos-chat-btn:hover, #carlos-chat-btn:focus-visible { background-color: var(--color-accent-hi) !important; transform: none !important; }
#carlos-chat-btn:focus-visible { outline: 2px solid var(--color-ink); outline-offset: 3px; }
#carlos-chat-badge { background: var(--color-ink) !important; color: var(--color-accent) !important; font-family: var(--font-mono); }
.cart-fab { width: 56px; height: 56px; right: 24px; bottom: calc(14px + 56px + 12px); }
@media (min-width: 1000px) { body.has-sticky .cart-fab { bottom: calc(14px + 56px + 12px); } }
@media (max-width: 999px) {
  body.has-sticky #carlos-chat-btn { bottom: 84px !important; }
  body.has-sticky .cart-fab { bottom: calc(84px + 56px + 12px); }
}
/* 4) Escritorio: etiqueta al pasar el mouse (en celular solo el ícono) */
@media (hover: hover) and (min-width: 1000px) {
  #carlos-chat-btn::after { content: "¿Te ayudamos?"; position: absolute; right: calc(100% + 12px); top: 50%; translate: 6px -50%; padding: 8px 12px; border-radius: var(--radius-1); background: var(--color-paper-2); border: 1px solid var(--color-rule-2); color: var(--color-ink); font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.06em; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity var(--dur-2) var(--ease-out), translate var(--dur-2) var(--ease-out); }
  #carlos-chat-btn:hover::after, #carlos-chat-btn:focus-visible::after { opacity: 1; translate: 0 -50%; }
  #carlos-chat-btn.sn-online::after { content: "¿Te ayudamos? · En línea"; }
}
/* 5) Punto verde "en línea" en horario de atención (lo marca cart.js) */
#carlos-chat-btn.sn-online::before { content: ""; position: absolute; left: 2px; bottom: 2px; width: 13px; height: 13px; border-radius: 50%; background: var(--color-ok); border: 2px solid var(--color-paper); }
@media (prefers-reduced-motion: reduce) { #carlos-chat-btn::after { transition: none; } }

/* =========================================================
   AVISOS DE WOOCOMMERCE EN TODO EL SITIO (ej. "se ha añadido a tu carrito" en ficha/tienda)
   ========================================================= */
.wc-block-components-notice-banner, .woocommerce-message, .woocommerce-info, .woocommerce-error { background: var(--color-paper-2) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2) !important; border-left: 3px solid var(--color-accent) !important; border-radius: var(--radius-1) !important; box-shadow: none !important; }
.wc-block-components-notice-banner.is-success, .woocommerce-message { border-left-color: var(--color-ok) !important; }
.wc-block-components-notice-banner.is-error, .woocommerce-error { border-color: var(--color-accent) !important; background: color-mix(in srgb, var(--color-accent) 14%, var(--color-paper-0)) !important; }
.wc-block-components-notice-banner > svg { fill: var(--color-accent-hi) !important; background: transparent !important; }
.wc-block-components-notice-banner.is-success > svg { fill: var(--color-ok) !important; }
.wc-block-components-notice-banner a, .wc-block-components-notice-banner .wc-forward { color: var(--color-ink) !important; font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.1em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 3px; }
.sn-shop .wc-block-store-notices, .sn-product .wc-block-store-notices { width: min(100% - 2 * var(--gutter), var(--wrap)); margin: var(--space-4) auto 0 !important; }

/* "Cargando" de WooCommerce (blockUI): velo oscuro en vez de blanco */
.blockUI.blockOverlay { background: var(--color-paper) !important; opacity: 0.65 !important; }

/* =========================================================
   PEDIDO RECIBIDO (plantilla order-confirmation)
   ========================================================= */
.sn-pedido-page { padding-block: var(--space-6) var(--space-8); }
.sn-pedido-page .wc-block-order-confirmation-status h1 { font-size: var(--text-h2) !important; font-weight: 800; font-variation-settings: "wdth" 90; margin: 0; line-height: 1.02; }
.sn-pedido-page .wc-block-order-confirmation-status p { font-size: var(--text-lead) !important; color: var(--color-ink-2); margin: var(--space-2) 0 0; }
.sn-pedido-page .wc-block-order-confirmation-summary { margin-top: var(--space-5); }
.sn-pedido-page .wc-block-order-confirmation-summary-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: var(--space-2); }
.sn-pedido-page .wc-block-order-confirmation-summary-list-item { background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-1); padding: var(--space-3) var(--space-4); margin: 0 !important; display: grid; gap: var(--space-1); }
.sn-pedido-page .wc-block-order-confirmation-summary-list-item__key { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-ink-2); font-weight: 500 !important; }
.sn-pedido-page .wc-block-order-confirmation-summary-list-item__value { font-weight: 700; word-break: break-word; }
.sn-pedido-page .wc-block-order-confirmation-additional-information { margin-top: var(--space-5); }
.sn-pedido-page .sn-pedido-h { font-size: var(--text-h3); font-weight: 800; margin: var(--space-6) 0 var(--space-3); }
.sn-pedido-page table, .sn-pedido-page .wc-block-order-confirmation-totals table { width: 100%; background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2); border-collapse: separate; border-spacing: 0; overflow: hidden; }
.sn-pedido-page table th, .sn-pedido-page table td { background: transparent !important; color: var(--color-ink) !important; border: 0 !important; border-bottom: 1px solid var(--color-rule) !important; padding: var(--space-3) var(--space-4) !important; }
.sn-pedido-page table thead th { font-family: var(--font-mono); font-size: var(--text-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-2) !important; font-weight: 500; }
.sn-pedido-page table tfoot tr:last-child th, .sn-pedido-page table tfoot tr:last-child td { border-bottom: 0 !important; font-size: 1.15rem; font-weight: 800; }
.sn-pedido-page table td:last-child { font-family: var(--font-mono); text-align: right; }
.sn-pedido-page a { color: var(--color-accent-hi); }
/* Fragmentos con estilos en línea (snippet / WPCode 950) → al sistema, sin tocar su funcionamiento */
.sn-pedido-page [style*="#fff3cd"] { background: color-mix(in srgb, var(--color-accent) 12%, var(--color-paper-0)) !important; border: 1px solid var(--color-rule-2) !important; border-left: 3px solid var(--color-accent) !important; color: var(--color-ink) !important; border-radius: var(--radius-1) !important; padding: var(--space-4) !important; margin: 0 0 var(--space-4) !important; }
.sn-pedido-page [style*="#fff3cd"] strong { color: var(--color-accent-hi) !important; }
.sn-pedido-page [style*="#141414"] { font-family: var(--font-display) !important; background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2) !important; color: var(--color-ink) !important; max-width: none !important; margin: 0 0 var(--space-4) !important; }
.sn-pedido-page [style*="#25D366"] { font-family: var(--font-mono) !important; letter-spacing: 0.06em; border-radius: var(--radius-1) !important; }
.sn-pedido-page [style*="max-width:520px"], .sn-pedido-page [style*="max-width: 520px"] { max-width: none !important; }

/* Pedido recibido: tarjetas del resumen que entren en 2 columnas en celular */
.sn-pedido-page .wc-block-order-confirmation-summary-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }

/* Avisos: enlace "Ver carrito" legible y sin contorno de foco al aparecer (WooCommerce los enfoca para lectores de pantalla) */
body .wc-block-components-notice-banner .wc-block-components-notice-banner__content a,
body .wc-block-components-notice-banner .wc-block-components-notice-banner__content .wc-forward { color: var(--color-ink) !important; opacity: 1 !important; background: transparent !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; padding: 6px 10px !important; text-decoration: none !important; }
body .wc-block-components-notice-banner .wc-block-components-notice-banner__content a:hover { border-color: var(--color-accent) !important; color: var(--color-accent-hi) !important; }
.wc-block-components-notice-banner:focus, .wc-block-components-notice-banner:focus-visible { outline: none !important; box-shadow: none !important; }

/* =========================================================
   PÁGINAS INFORMATIVAS (Ayuda, Info) — tipografía del sistema + FAQ desplegables + índice
   ========================================================= */
.sn-info .sn-page .page-title { text-transform: none; }
.sn-page .wp-block-post-content { color: var(--color-ink-2); line-height: 1.7; }
.sn-page .wp-block-post-content h2 { color: var(--color-ink); font-size: var(--text-h3); font-weight: 800; margin: var(--space-7) 0 var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--color-rule-2); text-transform: none; letter-spacing: -0.01em; scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + 140px); }
.sn-page .wp-block-post-content h2 em, .sn-page .wp-block-post-content h2 strong { font-style: normal; font-weight: inherit; }
.sn-page .wp-block-post-content h2::before { content: ""; display: block; width: 1.6rem; height: 2px; background: var(--color-accent); margin-bottom: var(--space-3); }
.sn-page .wp-block-post-content p { margin: 0 0 var(--space-3); }
.sn-page .wp-block-post-content strong { color: var(--color-ink); }
.sn-page .wp-block-post-content ul, .sn-page .wp-block-post-content ol { margin: 0 0 var(--space-4); padding-left: var(--space-5); }
.sn-page .wp-block-post-content li { margin-bottom: var(--space-1); }
.sn-page .wp-block-post-content li::marker { color: var(--color-accent-hi); font-family: var(--font-mono); }
.sn-page .wp-block-post-content hr { border: 0; border-top: 1px solid var(--color-rule); margin: var(--space-5) 0; }
/* Índice "En esta página" */
.sn-indice { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin: 0 0 var(--space-5); padding: var(--space-4); background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); }
.sn-indice .label { width: 100%; margin-bottom: var(--space-1); }
.sn-indice a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--space-3); border: 1px solid var(--color-rule-2); border-radius: 999px; color: var(--color-ink) !important; font-size: var(--text-small); text-decoration: none; }
.sn-indice a:hover { border-color: var(--color-accent); color: var(--color-accent-hi) !important; }
/* Preguntas frecuentes desplegables */
.sn-faq { margin: 0 0 var(--space-2); background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); }
.sn-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: var(--space-4); color: var(--color-ink); font-weight: 700; scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + 140px); }
.sn-faq summary::-webkit-details-marker { display: none; }
.sn-faq summary::after { content: "+"; flex: none; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--color-rule-2); border-radius: 50%; font-family: var(--font-mono); color: var(--color-accent-hi); transition: transform var(--dur-2) var(--ease-out); }
.sn-faq[open] summary::after { transform: rotate(45deg); }
.sn-faq[open] { border-color: var(--color-accent); }
.sn-faq summary:hover { color: var(--color-accent-hi); }
.sn-faq-body { padding: 0 var(--space-4) var(--space-4); }
.sn-faq-body > :last-child { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .sn-faq summary::after { transition: none; } }
/* Efecto "máquina de escribir" de Otter (<o-anim-typing>) en títulos: el texto se muestra directo (sin animación ni texto oculto) */
.sn-page o-anim-typing > span[style*="hidden"] { visibility: visible !important; }
.sn-page o-anim-typing .o-anim-typing-caret { display: none !important; }

/* =========================================================
   CONTACTO (/contact/)
   ========================================================= */
.sn-contacto { padding-block: var(--space-7) var(--space-8); }
.sn-contacto h1 { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin-top: var(--space-3); }
.sn-contacto .lead { font-size: var(--text-lead); color: var(--color-ink-2); max-width: 56ch; margin-top: var(--space-3); }
.sn-estado { display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-4); padding: 6px var(--space-3); border: 1px solid var(--color-rule-2); border-radius: 999px; font-family: var(--font-mono); font-size: var(--text-label); color: var(--color-ink-2); }
.sn-estado .punto { width: 9px; height: 9px; border-radius: 50%; background: var(--color-ink-3); }
.sn-estado.abierto { color: var(--color-ink); border-color: color-mix(in srgb, var(--color-ok) 50%, var(--color-rule-2)); }
.sn-estado.abierto .punto { background: var(--color-ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-ok) 25%, transparent); }
.sn-canales { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); margin-top: var(--space-6); }
.sn-canal { display: grid; gap: var(--space-2); align-content: start; text-align: left; padding: var(--space-5); background: var(--color-paper-2); border: 1px solid var(--color-rule-2); border-radius: var(--radius-2); color: var(--color-ink); font: inherit; cursor: pointer; transition: border-color var(--dur-1) var(--ease-out), transform var(--dur-1) var(--ease-out); }
.sn-canal:hover { border-color: var(--color-accent); transform: translateY(-2px); }
.sn-canal strong { font-size: 1.15rem; font-weight: 800; word-break: break-word; }
.sn-canal .desc { color: var(--color-ink-2); font-size: var(--text-small); }
.sn-canal .btn { margin-top: var(--space-3); justify-self: start; pointer-events: none; }
.sn-canal-wa { background: radial-gradient(120% 140% at 0% 0%, var(--color-glow-hi), var(--color-paper-2) 60%); border-color: var(--color-accent); }
.sn-contacto-extra { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); margin-top: var(--space-6); }
.sn-contacto-extra p { color: var(--color-ink-2); font-size: var(--text-small); margin-top: var(--space-2); }
.sn-contacto-extra a { color: var(--color-accent-hi); }
@media (prefers-reduced-motion: reduce) { .sn-canal:hover { transform: none; } }

/* =========================================================
   404 — página no encontrada
   ========================================================= */
.sn-404 { padding-block: var(--space-7) var(--space-8); position: relative; isolation: isolate; }
.sn-404::before { content: "404"; position: absolute; z-index: -1; right: var(--gutter); top: var(--space-5); font-family: var(--font-mono); font-weight: 700; font-size: clamp(6rem, 3rem + 14vw, 15rem); line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--color-rule-2); pointer-events: none; }
.sn-404 h1 { font-size: var(--text-h2); font-weight: 800; font-variation-settings: "wdth" 90; margin-top: var(--space-3); max-width: 18ch; }
.sn-404 .lead { font-size: var(--text-lead); color: var(--color-ink-2); max-width: 54ch; margin-top: var(--space-3); }
.sn-404-buscar { max-width: 520px; margin: var(--space-5) 0 0; }
.sn-404-buscar input { height: 50px; font-size: 1rem; background: var(--color-paper-0); }
.sn-404-buscar button { width: 54px; }
.sn-404 .hero-ctas { margin-top: var(--space-4); }
.sn-404-cats { margin-top: var(--space-6); display: grid; gap: var(--space-3); }
.sn-404-cats .tagp { min-height: 36px; padding: 0 var(--space-4); font-size: var(--text-small); text-decoration: none; color: var(--color-ink); }
.sn-404-cats .tagp:hover { border-color: var(--color-accent); color: var(--color-accent-hi); }
.sn-404-head { margin: var(--space-7) 0 var(--space-4); }
.sn-404 .grid { padding-bottom: 0; }
.sn-404-ayuda { margin-top: var(--space-6); color: var(--color-ink-2); }
.sn-404-ayuda a { color: var(--color-accent-hi); }
@media (max-width: 720px) { .sn-404::before { opacity: 0.5; } }
.sn-404-cats .cat-tags { grid-area: auto; margin-top: 0; }

/* =========================================================
   VENTANA DEL CHAT (snippet 30) — solo estilos desde el tema
   ========================================================= */
#carlos-chat-panel {
  bottom: calc(14px + 56px + 12px) !important; right: 24px !important; width: 360px !important;
  background: radial-gradient(120% 60% at 100% 0%, var(--color-glow-soft), transparent 60%), var(--color-paper-2) !important;
  border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-2) !important;
  box-shadow: 0 24px 60px -18px var(--color-shadow) !important; font-family: var(--font-display) !important; color: var(--color-ink);
  overflow: hidden;
}
#carlos-chat-header { background: linear-gradient(180deg, var(--color-head), var(--color-head-2)) !important; border-bottom: 1px solid var(--color-head-rule); padding: 14px 16px !important; }
#carlos-chat-header .title { font-weight: 800 !important; font-size: 1.05rem !important; letter-spacing: -0.01em !important; color: var(--color-ink); }
#carlos-chat-header .subtitle { font-family: var(--font-mono); font-size: 0.68rem !important; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-ink-2); opacity: 1 !important; margin-top: 3px !important; }
/* "En línea" en horario de atención (el botón lleva .sn-online, y la ventana es su hermana) */
#carlos-chat-btn.sn-online ~ #carlos-chat-panel #carlos-chat-header .subtitle::after { content: "● En línea"; display: block; margin-top: 3px; color: var(--color-ok); }
#carlos-chat-close { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--color-head-rule) !important; border-radius: 50% !important; color: var(--color-ink) !important; font-size: 18px !important; opacity: 1 !important; }
#carlos-chat-close:hover { border-color: var(--color-accent) !important; color: var(--color-accent-hi) !important; }
#carlos-chat-messages { padding: 16px !important; gap: 10px !important; }
.carlos-msg { font-size: 0.875rem !important; line-height: 1.45 !important; border-radius: var(--radius-2) !important; }
.carlos-msg.visitor { background: var(--color-accent) !important; color: var(--color-accent-ink) !important; border-bottom-right-radius: 2px !important; }
.carlos-msg.agent { background: var(--color-paper-3) !important; color: var(--color-ink) !important; border: 1px solid var(--color-rule-2); border-bottom-left-radius: 2px !important; }
.carlos-msg.system { background: transparent !important; color: var(--color-ink-2) !important; font-family: var(--font-mono); font-size: 0.72rem !important; border: 1px dashed var(--color-rule-2); }
.carlos-msg a { color: var(--color-accent-hi) !important; }
.carlos-msg.visitor a { color: var(--color-accent-ink) !important; }
#carlos-chat-empty { color: var(--color-ink-2) !important; font-size: var(--text-small) !important; }
#carlos-chat-inputrow { background: var(--color-paper-0) !important; border-top: 1px solid var(--color-rule-2) !important; padding: 10px !important; gap: 8px !important; }
#carlos-chat-input { background: var(--color-paper-2) !important; border: 1px solid var(--color-rule-2) !important; border-radius: var(--radius-1) !important; color: var(--color-ink) !important; font-family: var(--font-display) !important; font-size: 0.9rem !important; }
#carlos-chat-input:focus { border-color: var(--color-accent) !important; }
#carlos-chat-input::placeholder { color: var(--color-ink-3); }
#carlos-chat-attach { border-radius: var(--radius-1) !important; background: var(--color-paper-3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B5AFA4' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.5l-7.8 7.8a5 5 0 0 1-7.1-7.1l8.2-8.2a3.3 3.3 0 0 1 4.7 4.7l-8.2 8.2a1.7 1.7 0 0 1-2.4-2.4l7.4-7.4'/%3E%3C/svg%3E") center / 18px no-repeat !important; border: 1px solid var(--color-rule-2) !important; }
#carlos-chat-attach:hover { border-color: var(--color-accent) !important; }
#carlos-chat-send { border-radius: var(--radius-1) !important; background: var(--color-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF5F2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 18px no-repeat !important; box-shadow: none !important; }
#carlos-chat-send:hover { background-color: var(--color-accent-hi) !important; }
/* Celular: casi todo el ancho; en la ficha, por encima de la barra de compra */
@media (max-width: 600px) {
  #carlos-chat-panel { left: 12px !important; right: 12px !important; width: auto !important; max-width: none !important; }
}
@media (max-width: 999px) {
  body.has-sticky #carlos-chat-panel { bottom: calc(84px + 56px + 12px) !important; }
}

/* Revisión final en celular (2026-10-10) */
/* Carrito: en pantallas chicas la columna de total por producto se salía del ancho; el precio ya está bajo el nombre y el total en la tarjeta */
@media (max-width: 600px) {
  .wc-block-cart .wc-block-cart-items__header-total, .wc-block-cart .wc-block-cart-item__total { display: none !important; }
  .wc-block-components-quantity-selector { min-height: 40px; }
  .wc-block-components-quantity-selector__button { min-width: 40px !important; }
}
/* Textos chicos al mínimo del design.md (etiquetas mono ≥ 0.72rem) */
.ticket .seal { font-size: 0.72rem; }
.sn-tag { font-size: 0.72rem; }
.sn-stat span { font-size: 0.72rem; }
.sn-pedido-page .wc-block-order-confirmation-summary-list-item__key { font-size: 0.72rem; }

/* "También te puede interesar": carrusel deslizable (2 / 3 / 4 a la vista) */
.sn-rel-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); }
.sn-rel-flechas { display: flex; gap: var(--space-2); }
.sn-rel-flechas button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--color-rule-2); border-radius: 50%; background: transparent; color: var(--color-ink); font-family: var(--font-mono); cursor: pointer; }
.sn-rel-flechas button:hover { border-color: var(--color-accent); color: var(--color-accent-hi); }
.sn-rel { --vis: 2; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--vis) - 1) * var(--space-3)) / var(--vis)); gap: var(--space-3); overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; padding-bottom: 2px; }
.sn-rel::-webkit-scrollbar { display: none; }
.sn-rel .pcard { scroll-snap-align: start; }
.sn-rel:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; border-radius: var(--radius-2); }
@media (min-width: 720px) { .sn-rel { --vis: 3; gap: var(--space-4); grid-auto-columns: calc((100% - 2 * var(--space-4)) / 3); } }
@media (min-width: 1000px) { .sn-rel { --vis: 4; grid-auto-columns: calc((100% - 3 * var(--space-4)) / 4); } }
/* Carrito vacío: el carrusel propio reemplaza la lista genérica de "novedades" de WooCommerce */
.wp-block-woocommerce-empty-cart-block > .wp-block-separator, .wp-block-woocommerce-empty-cart-block > .wp-block-separator ~ * { display: none !important; }
.sn-cart-page .sn-related, .sn-404 + .sn-related { border-top: 1px solid var(--color-rule); }