/* =========================================================================
   Galaxy GP — Design Tokens (F2)
   Direccion "Nebulosa violeta" (aprobada 2026-08-11): espacio violeta profundo
   en hero/header/footer, tienda clara con dejo lila, CTA ciruela (paleta de
   las creatividades de la marca). Packaging negro y logo espiral: intocados.
   Tipografia: Bricolage Grotesque 800 (display) + Hanken Grotesk 400/700
   (self-hosted en /wp-content/fonts/, licencia OFL).
   ========================================================================= */

/* ---- Bricolage Grotesque 800 (latin + latin-ext) ---- */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(/wp-content/fonts/bricolage-grotesque/bricolage-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(/wp-content/fonts/bricolage-grotesque/bricolage-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ---- Hanken Grotesk 400/700 (latin + latin-ext) ---- */
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/wp-content/fonts/hanken-grotesk/hanken-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/wp-content/fonts/hanken-grotesk/hanken-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(/wp-content/fonts/hanken-grotesk/hanken-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(/wp-content/fonts/hanken-grotesk/hanken-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root {
  /* Tipografia */
  --gs-font-display: 'Bricolage Grotesque', system-ui, sans-serif;
  --gs-font: 'Hanken Grotesk', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --gs-fw-regular: 400; --gs-fw-bold: 700; --gs-fw-display: 800;
  --gs-fs-h1: clamp(2.2rem, 5.5vw, 3.6rem);
  --gs-fs-h2: clamp(1.8rem, 4vw, 2.6rem);
  --gs-fs-h3: clamp(1.2rem, 2.4vw, 1.5rem);
  --gs-fs-body: 1.0625rem;
  --gs-fs-small: 0.75rem;
  --gs-lh-body: 1.65; --gs-lh-tight: 1.08;
  --gs-ls-tight: -0.015em; --gs-ls-wide: 0.1em;

  /* ---- Paleta "Nebulosa violeta" ---- */
  --gs-space:      #150C28;   /* violeta-negro: hero, header, footer (nunca #000) */
  --gs-space-2:    #241243;   /* capa intermedia de la nebulosa */
  --gs-paper:      #F6F3F9;   /* fondo de tienda: blanco con dejo lila */
  --gs-white:      #ffffff;   /* tarjetas / superficies */
  --gs-ink:        #1D1430;   /* texto principal */
  --gs-muted:      #6E6480;   /* texto secundario (gris violaceo) */

  /* Ciruela de marca (CTA / accion; contraste AA con texto blanco) */
  --gs-plum:       #7B2C83;   --gs-plum-dark: #5E2064;
  /* Lila (detalles, fondos suaves, hovers) */
  --gs-lila:       #C9A6E0;   --gs-lila-soft: #EFE7F6;

  /* Semanticos (stock, avisos) — separados del acento */
  --gs-green:      #188A50;   --gs-green-soft: #E1F2E8;
  --gs-warn:       #B87514;   --gs-warn-soft:  #FBF0DC;
  --gs-error:      #B3261E;   --gs-error-soft: #F9E2E4;

  /* Nebulosa (fondo decorativo de hero/bandas oscuras) */
  --gs-nebula: radial-gradient(120% 160% at 18% 0%, #3A1D66 0%, var(--gs-space-2) 42%, var(--gs-space) 74%);

  /* Radios (cards medias, botones chicos, pills) */
  --gs-radius-sm: 9px; --gs-radius: 14px; --gs-radius-lg: 20px; --gs-radius-pill: 9999px;

  /* Sombras frias suaves */
  --gs-shadow-sm: 0 1px 3px rgba(29,20,48,.07);
  --gs-shadow-md: 0 8px 24px rgba(29,20,48,.08);
  --gs-shadow-lg: 0 18px 44px rgba(29,20,48,.12);

  /* Espaciado (escala 4pt) */
  --gs-space-1:.25rem; --gs-space-2q:.5rem; --gs-space-3:.75rem; --gs-space-4:1rem; --gs-space-5:1.25rem; --gs-space-6:1.5rem; --gs-space-8:2rem; --gs-space-12:3rem; --gs-space-16:4rem;

  /* Hairline frio para bordes sutiles sobre blanco/lila */
  --gs-border: rgba(29,20,48,.10);
  --gs-transition: .2s ease;

  /* Mapear tokens de GeneratePress a la paleta */
  --contrast: var(--gs-ink); --base: var(--gs-paper); --base-2: var(--gs-paper); --accent: var(--gs-plum);
}

/* ---- Base sobre GeneratePress ---- */
body {
  font-family: var(--gs-font);
  font-weight: var(--gs-fw-regular);
  font-size: var(--gs-fs-body);
  line-height: var(--gs-lh-body);
  color: var(--gs-ink);
  background: var(--gs-paper);
  -webkit-font-smoothing: antialiased;
}
.site-content, .wc-block-grid { background: var(--gs-paper); }

h1,h2,h3,h4,h5,h6,.entry-title,.site-title {
  font-family: var(--gs-font-display);
  font-weight: var(--gs-fw-display);
  line-height: var(--gs-lh-tight);
  letter-spacing: var(--gs-ls-tight);
  color: var(--gs-ink);
}
h1,.entry-title { font-size: var(--gs-fs-h1); }
h2 { font-size: var(--gs-fs-h2); }
h3 { font-size: var(--gs-fs-h3); }
p { color: var(--gs-muted); }

a { color: var(--gs-ink); text-decoration: none; transition: color .18s ease; }
a:hover { color: var(--gs-plum); }

/* Botones — ciruela solido, radius chico (estetica de los ads de marca) */
.button, button, input[type=submit], .wp-block-button__link,
.added_to_cart, .single_add_to_cart_button, .checkout-button {
  font-family: var(--gs-font);
  font-weight: var(--gs-fw-bold);
  font-size: var(--gs-fs-small);
  letter-spacing: var(--gs-ls-wide);
  text-transform: uppercase;
  background: var(--gs-plum);
  color: var(--gs-white);
  border: none;
  border-radius: var(--gs-radius-sm);
  padding: 1em 1.9em;
  transition: background .2s ease, transform .15s ease;
}
.button:hover, button:hover, input[type=submit]:hover,
.single_add_to_cart_button:hover, .checkout-button:hover {
  background: var(--gs-plum-dark); color: var(--gs-white); transform: translateY(-1px);
}

/* Badge "pill" con dot lila (eyebrow de secciones) */
.gs-badge {
  display: inline-flex; align-items: center; gap: .5em;
  background: var(--gs-white); color: var(--gs-ink);
  font-size: var(--gs-fs-small); font-weight: var(--gs-fw-bold);
  letter-spacing: var(--gs-ls-wide); text-transform: uppercase;
  padding: .5em 1.1em; border-radius: var(--gs-radius-pill); box-shadow: var(--gs-shadow-sm);
}
.gs-badge::before { content:""; width:.5em; height:.5em; border-radius:50%; background: var(--gs-plum); }

/* Cards con sombra suave */
.gs-card { background: var(--gs-white); border-radius: var(--gs-radius); box-shadow: var(--gs-shadow-md); }

/* Banda oscura de nebulosa (hero / secciones destacadas) */
.gs-nebula { background: var(--gs-nebula); color: var(--gs-white); }
.gs-nebula h1, .gs-nebula h2, .gs-nebula h3 { color: var(--gs-white); }
.gs-nebula p { color: var(--gs-lila); }

/* Precios WooCommerce */
.woocommerce-Price-amount { color: var(--gs-ink); font-weight: var(--gs-fw-bold); }

/* Botones de WooCommerce: ganar a los defaults grises de WC */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce .button.alt, .woocommerce #respond input#submit, .woocommerce-page .button {
  background: var(--gs-plum);
  color: var(--gs-white);
  border-radius: var(--gs-radius-sm);
  font-weight: var(--gs-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--gs-ls-wide);
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce .button.alt:hover { background: var(--gs-plum-dark); color: var(--gs-white); }
.woocommerce div.product form.cart .single_add_to_cart_button {
  background: var(--gs-plum); color: var(--gs-white);
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover { background: var(--gs-plum-dark); color: var(--gs-white); }
/* radios/checkboxes con el ciruela de marca (en vez del violeta #7f54b3 default de WC) */
input[type="radio"], input[type="checkbox"] { accent-color: var(--gs-plum); }
/* boton Realizar pedido del checkout */
.woocommerce #place_order, .woocommerce-checkout #place_order { background: var(--gs-plum); color: var(--gs-white); }
.woocommerce #place_order:hover, .woocommerce-checkout #place_order:hover { background: var(--gs-ink); color: var(--gs-white); }
/* links del contenido de Mi Cuenta (scopeado: NO .woocommerce-account a a secas,
   esa clase vive en el body y pintaria header/footer — leccion sirneko-gp) */
.woocommerce a.woocommerce-button,
.woocommerce-account .woocommerce-MyAccount-navigation a:not(.button),
.woocommerce-account .woocommerce-MyAccount-content a:not(.button) { color: var(--gs-plum); }

/* ===== WooCommerce notices — estetica Galaxy ===== */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  position: relative;
  display: flex; align-items: center; flex-wrap: wrap; gap: .4rem .9rem;
  margin: 0 0 var(--gs-space-4); padding: 1rem 1.25rem;
  border: none !important; border-radius: var(--gs-radius);
  font-family: var(--gs-font); font-size: .95rem; font-weight: var(--gs-fw-bold);
  color: var(--gs-ink); line-height: 1.4; list-style: none;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  position: static; order: -1; top: auto; left: auto; margin: 0;
  font-size: 1.1rem; line-height: 1;
}
/* success (verde semantico) */
.woocommerce-message { background: var(--gs-green-soft); box-shadow: inset 0 0 0 1.5px var(--gs-green); }
.woocommerce-message::before { color: var(--gs-green); }
/* info (lila) */
.woocommerce-info { background: var(--gs-lila-soft); box-shadow: inset 0 0 0 1.5px var(--gs-lila); }
.woocommerce-info::before { color: var(--gs-plum); }
/* error */
.woocommerce-error { background: var(--gs-error-soft); box-shadow: inset 0 0 0 1.5px var(--gs-error); color: #7c1a15; }
.woocommerce-error::before { color: var(--gs-error); }
.woocommerce-message .button,
.woocommerce-info .button { order: 2; margin: 0 0 0 auto; float: none; }

/* Ancho del contenido: amplio, sensacion full-width */
.grid-container { max-width: 1500px; }
@media (min-width: 768px) { .site-content .content-area, .site-main { padding-left: 0; padding-right: 0; } }

/* Container del contenido transparente (sin wrapper blanco boxed de GP):
   todo sobre el lila-papel; las cards internas ponen su propio blanco. */
.inside-article, .entry-content { background: transparent !important; box-shadow: none !important; border: none !important; }
.separate-containers .site-main { background: transparent; }
.inside-article { overflow: visible; }
.entry-content .alignwide { max-width: min(1600px, 94vw); margin-left: auto; margin-right: auto; }

/* FULL-BLEED: secciones edge-to-edge (bloques alignfull, .gs-fullbleed o el B2B) */
.entry-content .alignfull,
.entry-content > .gs-fullbleed,
.entry-content .snb2b-landing,
.entry-content .snb2b-order-form,
.entry-content > .wp-block-cover.alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.entry-content .snb2b-order-form { padding-left: clamp(1rem, 4vw, 3rem); padding-right: clamp(1rem, 4vw, 3rem); box-sizing: border-box; }

/* ---------- Pedido Rapido (order form B2B) en mobile: tabla → cards
   (port sirneko-gp; mayor especificidad para ganarle a los !important del plugin) ---------- */
@media (max-width: 768px) {
  .snb2b-order-form .snb2b-of-filters .snb2b-of-stock-toggle,
  .snb2b-order-form .snb2b-of-filters button.snb2b-of-export-btn {
    align-self: stretch !important; width: 100% !important; justify-content: center !important;
  }
  .snb2b-order-form { overflow-x: visible !important; }
  .snb2b-order-form .snb2b-of-table thead { display: none; }
  .snb2b-order-form .snb2b-of-table tbody,
  .snb2b-order-form .snb2b-of-table tr,
  .snb2b-order-form .snb2b-of-table td { display: block; }
  .snb2b-order-form .snb2b-of-table tr {
    display: grid; grid-template-columns: 46px 1fr;
    grid-template-areas: "thumb name" "thumb price" "thumb stock" "thumb qty";
    gap: 2px 10px; align-items: center;
    border: 1px solid var(--gs-border); border-radius: var(--gs-radius); padding: 8px 10px; margin-bottom: 8px;
  }
  .snb2b-order-form .snb2b-of-table td { min-width: 0; border: none !important; padding: 0 !important; background: transparent !important; }
  .snb2b-order-form .snb2b-of-table .snb2b-thumb-cell { grid-area: thumb; padding: 0 !important; align-self: center; }
  .snb2b-order-form .snb2b-of-table td:nth-child(2) { grid-area: name; overflow-wrap: anywhere; }
  .snb2b-order-form .snb2b-of-table td:nth-child(3) { grid-area: price; font-weight: 600; }
  .snb2b-order-form .snb2b-of-table td:nth-child(4) { grid-area: stock; display: block; justify-self: start; }
  .snb2b-order-form .snb2b-of-table td:nth-child(5) { grid-area: qty; justify-self: start; margin-top: 2px; }
  .snb2b-order-form .snb2b-of-table .snb2b-qty-wrap { display: inline-flex; align-items: center; gap: 0; }
}