/* ==========================================================================
   Room in Valencia Local · dirección B intermedia
   Hoja del tema hijo de Storefront. SOLO presentación.

   Reglas de diseño de esta hoja:
   - No cambia plantillas, no añade ni oculta contenido funcional.
   - Todo va bajo el ámbito `body.riv-local` (clase añadida por
     functions.php), lo que da especificidad suficiente para ganar a
     Storefront/WooCommerce sin recurrir a !important generalizados.
   - Las reglas que reordenan o redimensionan llevan además
     `:not(.elementor-page)`: las páginas construidas con Elementor
     conservan sus columnas y su diseño intactos.
   - Orden de carga previsto:
       storefront-style → (tipografía local) → Elementor/WooCommerce → esta hoja.
   - Paleta (incorporada de la referencia Mediavida): #fff (superficie),
     #ebebeb (página), #d9d9d9 / #ececec (bordes), #1c1c1c (titulares),
     #333 (texto), #6a6a6a (meta), #2f2f2f / #232323 (carbon, superficies
     oscuras), #ff6a00 (naranja visual, siempre con texto oscuro), #cc4400
     (sólido con texto blanco), #a83800 (hover de sólido), #b3400a (naranja
     de texto/enlaces). Ninguna otra tipografía ni color nuevo salvo el
     rojo/verde semántico que ya aporte WooCommerce.
   ========================================================================== */

/* ==========================================================================
   1. Tokens
   ========================================================================== */
:root {
  --riv-yellow: #ff6a00; /* naranja visual: superficies/detalles con texto oscuro */
  --riv-yellow-dark: #a83800; /* hover de superficies sólidas */
  --riv-orange-strong: #cc4400; /* sólido de acción, con texto blanco (4.8:1) */
  --riv-orange-text: #b3400a; /* naranja de texto/enlaces sobre claro */
  --riv-carbon: #2f2f2f; /* superficie oscura */
  --riv-carbon-deep: #232323; /* superficie oscura profunda / hover */
  --riv-ink: #1c1c1c; /* titulares y texto de máximo contraste */
  --riv-body: #333333;
  --riv-blue: #b3400a; /* acento funcional: enlaces/foco/contadores */
  --riv-white: #fff;
  --riv-soft: #ebebeb; /* gris de página */
  --riv-line: #d9d9d9;
  --riv-line-soft: #ececec;
  --riv-muted: #6a6a6a;
  --riv-on-dark: #ececec; /* texto principal sobre superficies oscuras (11:1) */
  --riv-on-dark-muted: #b3b3b3; /* texto secundario sobre oscuro (6.4:1) */
  --riv-wrap: 1240px;
  --riv-gutter: clamp(18px, 3vw, 32px);
  --riv-space: clamp(48px, 6vw, 96px);
  --riv-radius: 0;
  --riv-font: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  --riv-focus: var(--riv-blue);
  --riv-shadow: 0 14px 32px rgba(12, 12, 12, 0.1);
  color-scheme: light;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
body.riv-local {
  font-family: var(--riv-font);
  color: var(--riv-body);
  background: var(--riv-soft);
  font-size: 1.0625rem;
  line-height: 1.6;
}
body.riv-local ::selection {
  background: var(--riv-yellow);
  color: var(--riv-ink);
}
/* Imágenes: nunca desbordan en móvil. En páginas Elementor se deja el
   control al propio Elementor salvo en cabecera y pie, que son del tema. */
body.riv-local:not(.elementor-page) img {
  max-width: 100%;
  height: auto;
}
body.riv-local #masthead img,
body.riv-local #colophon img {
  max-width: 100%;
  height: auto;
}
body.riv-local #masthead .site-branding img {
  max-width: min(183px, 52vw);
}

/* Contenedores del tema. La cabecera y el pie usan el ancho de la dirección B
   en todas las páginas; el contenedor de contenido solo se ensancha fuera de
   Elementor, para no alterar el ancho de las secciones de Elementor. */
body.riv-local #masthead .col-full,
body.riv-local #colophon .col-full {
  width: 100%;
  max-width: var(--riv-wrap);
  margin-inline: auto;
  padding-inline: var(--riv-gutter);
}
body.riv-local:not(.elementor-page) #content.site-content {
  padding-block: var(--riv-space);
}
body.riv-local:not(.elementor-page) #content.site-content > .col-full {
  max-width: var(--riv-wrap);
}

/* Las plantillas visuales propias ocupan el ancho útil del viewport. Así sus
   contenedores centrados no heredan el margen estrecho de Storefront ni
   dependen de 100vw (que incluye el ancho de la scrollbar en escritorio). */
body.riv-local #content.site-content:has(.riv-home) > .col-full,
body.riv-local #content.site-content:has(.riv-about) > .col-full,
body.riv-local #content.site-content:has(.riv-info) > .col-full,
body.riv-local #content.site-content:has(.riv-search-page) > .col-full,
body.riv-local #content.site-content:has(.riv-search-retired) > .col-full {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
}

/* ==========================================================================
   3. Escala tipográfica
   Se aplica fuera de Elementor y, de forma opcional, dentro de Elementor si
   se activa el filtro `riv_child_style_elementor_pages` (añade la clase
   `riv-type-scope` al body). Por defecto, las páginas Elementor no se tocan.
   ========================================================================== */
:is(body.riv-local:not(.elementor-page), body.riv-local.riv-type-scope)
  :is(h1, h2, h3) {
  color: var(--riv-ink);
  line-height: 1.12;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
:is(body.riv-local:not(.elementor-page), body.riv-local.riv-type-scope) h1,
:is(body.riv-local:not(.elementor-page), body.riv-local.riv-type-scope)
  h1.entry-title {
  font-size: clamp(2.25rem, 4.4vw, 3.4rem);
}
body.riv-local.page:not(.elementor-page):not(.woocommerce-account):not(.woocommerce-cart):not(.woocommerce-checkout)
  h1 {
  font-weight: 700;
}
:is(body.riv-local:not(.elementor-page), body.riv-local.riv-type-scope) h2 {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
}
:is(body.riv-local:not(.elementor-page), body.riv-local.riv-type-scope) h3 {
  font-size: clamp(1.25rem, 1.8vw, 1.55rem);
}
body.riv-local :is(.entry-title, .page-title) {
  color: var(--riv-ink);
}
body.riv-local .entry-content > :first-child {
  margin-top: 0;
}
body.riv-local .entry-content > :last-child {
  margin-bottom: 0;
}
/* Enlaces dentro de contenido: subrayado amarillo, patrón de la dirección B. */
body.riv-local:not(.elementor-page)
  :is(
    .entry-content,
    .term-description,
    .woocommerce-MyAccount-content,
    .woocommerce-product-details__short-description,
    #secondary
  )
  a:not(.button):not(.wp-block-button__link) {
  color: var(--riv-ink);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--riv-yellow);
  text-underline-offset: 3px;
}
body.riv-local:not(.elementor-page)
  :is(
    .entry-content,
    .term-description,
    .woocommerce-MyAccount-content,
    .woocommerce-product-details__short-description,
    #secondary
  )
  a:not(.button):hover {
  color: var(--riv-blue);
  text-decoration-color: currentColor;
}

/* ==========================================================================
   4. Cabecera: logo, navegación, buscador y carrito
   El logo usa el `custom-logo` existente: solo se acota su tamaño máximo.
   ========================================================================== */
body.riv-local #masthead.site-header {
  background: var(--riv-carbon);
  border-bottom: 1px solid var(--riv-carbon-deep);
  margin-bottom: 0;
  padding-top: 0;
  box-shadow: none !important; /* El CSS antiguo de YellowPencil fuerza sombra global. */
}

/* La portada original tiene desplazamientos absolutos específicos de
   YellowPencil (page-id-643); neutralízalos al usar la nueva cabecera. */
body.riv-local.page-id-643 #masthead {
  padding-top: 0;
  margin-bottom: 0;
}
body.riv-local.page-id-643 #masthead .storefront-primary-navigation {
  top: auto;
  bottom: auto;
}
body.riv-local.page-id-643 #masthead .storefront-primary-navigation > .col-full {
  top: auto;
  bottom: auto;
  margin-bottom: 0;
  border: 0;
}
body.riv-local.page-id-643 #masthead #site-navigation ul.menu > li > a {
  top: auto;
  left: auto;
}
body.riv-local.page-id-643 #masthead #site-header-cart li a.cart-contents {
  top: 0;
  left: 0;
}
body.riv-local #masthead .col-full {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(10px, 2vw, 32px);
  min-height: 96px;
  padding-block: 10px;
}
body.riv-local .site-branding {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.25rem;
  flex: 0 0 auto;
  margin: 0;
  float: none;
  width: auto;
}
body.riv-local .site-branding .custom-logo-link {
  display: inline-block;
  line-height: 0;
}
body.riv-local .site-branding img {
  width: auto;
  max-width: min(183px, 52vw);
  max-height: 72px;
  object-fit: contain;
}
body.riv-local .site-title {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}
body.riv-local .site-title a {
  color: var(--riv-ink);
  text-decoration: none;
}
body.riv-local .site-title a:hover {
  color: var(--riv-blue);
}
body.riv-local .site-description {
  color: var(--riv-muted);
  font-size: 0.85rem;
  margin: 0;
}

/* Storefront coloca la navegación en un segundo contenedor hermano del logo.
   En pantallas amplias, reúne ambos en una sola franja sin cambiar el HTML ni
   quitar los controles nativos de los submenús y el carrito. */
@media (min-width: 1280px) {
  body.riv-local #masthead.site-header {
    display: flex;
    align-items: center;
    gap: clamp(12px, 1.8vw, 28px);
    padding-inline: max(24px, calc((100% - 1240px) / 2));
  }
  body.riv-local #masthead > .col-full {
    flex: 0 0 auto;
    width: auto;
    min-height: 76px;
    margin: 0;
    padding: 0;
  }
  body.riv-local #masthead .site-branding {
    width: auto;
  }
  body.riv-local #masthead .site-branding img {
    max-height: 58px;
  }
  body.riv-local #masthead .storefront-primary-navigation {
    flex: 1 1 auto;
    width: auto;
    margin: 0;
    background: transparent;
  }
  body.riv-local #masthead .storefront-primary-navigation > .col-full {
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 76px;
    margin: 0;
    padding: 0;
  }
  body.riv-local #site-navigation.main-navigation {
    margin-left: 0;
  }
  body.riv-local #masthead #site-navigation ul.menu {
    flex-wrap: nowrap;
    gap: clamp(4px, 0.7vw, 12px);
  }
  body.riv-local #site-navigation ul.menu > li > a {
    white-space: nowrap;
    font-size: 0.88rem;
  }
  body.riv-local .site-header-cart {
    flex: 0 0 auto;
    margin: 0;
  }
}

/* Navegación principal */
body.riv-local #site-navigation.main-navigation {
  display: flex;
  align-items: center;
  gap: clamp(12px, 2vw, 32px);
  width: auto;
  clear: none;
  margin-left: auto;
}
body.riv-local #site-navigation ul.menu,
body.riv-local #site-navigation ul.nav-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
/* Botón de menú móvil (Storefront lo muestra por debajo de 768px y controla
   su apertura por JS: aquí solo se viste, nunca se cambia su display). */
body.riv-local .main-navigation .menu-toggle {
  background: var(--riv-yellow);
  color: var(--riv-ink);
  border: 2px solid var(--riv-yellow);
  border-radius: var(--riv-radius);
  padding: 0.6rem 1rem;
  font-family: inherit;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1.2;
  cursor: pointer;
}
body.riv-local .main-navigation .menu-toggle:hover,
body.riv-local .main-navigation .menu-toggle:focus {
  background: var(--riv-orange-strong);
  border-color: var(--riv-orange-strong);
  color: var(--riv-white);
}
body.riv-local .main-navigation .menu-toggle::before,
body.riv-local .main-navigation .menu-toggle::after,
body.riv-local .main-navigation .menu-toggle span::before {
  content: none;
  display: none;
}

@media (min-width: 1280px) {
  body.riv-local #site-navigation ul.menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: clamp(4px, 1.4vw, 20px);
  }
  body.riv-local #site-navigation ul.menu > li {
    margin: 0;
  }
  body.riv-local #site-navigation ul.menu > li > a {
    display: block;
    padding: 0.55rem 0.25rem;
    color: var(--riv-on-dark);
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.3;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: border-color 0.2s ease, color 0.2s ease;
  }
  body.riv-local #site-navigation ul.menu > li > a:hover,
  body.riv-local
    #site-navigation
    ul.menu
    > li:is(.current-menu-item, .current_page_item, .current-menu-ancestor, .current-menu-parent)
    > a {
    color: var(--riv-white);
    border-bottom-color: var(--riv-yellow);
  }
  /* Storefront oculta el botón en escritorio; se declara para garantizar que
     la navegación horizontal nunca quede detrás de un botón invisible. */
  body.riv-local .main-navigation .menu-toggle {
    display: none;
  }
  /* Desplegables: solo se viste el panel; la visibilidad la sigue
     gestionando Storefront (hover + foco de teclado). */
  body.riv-local .main-navigation ul.sub-menu {
    background: var(--riv-white);
    border: 1px solid var(--riv-line);
    border-radius: var(--riv-radius);
    box-shadow: var(--riv-shadow);
    padding: 0.4rem 0;
    min-width: 230px;
    list-style: none;
  }
  body.riv-local .main-navigation ul.sub-menu li {
    margin: 0;
  }
  body.riv-local .main-navigation ul.sub-menu a {
    padding: 0.55rem 1.1rem;
    color: var(--riv-ink);
    font-size: 0.92rem;
    font-weight: 400;
    text-decoration: none;
  }
  body.riv-local .main-navigation ul.sub-menu a:hover,
  body.riv-local .main-navigation ul.sub-menu li:focus-within > a {
    background: var(--riv-soft);
    color: var(--riv-blue);
  }
}

@media (max-width: 1279.98px) {
  body.riv-local #masthead.site-header {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 76px;
    padding: 8px var(--riv-gutter);
  }
  body.riv-local #masthead > .col-full {
    flex: 1 1 0%;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
  }
  body.riv-local #masthead .storefront-primary-navigation {
    flex: 0 0 72px;
    width: 72px;
    min-width: 0;
    margin: 0;
  }
  body.riv-local #masthead .storefront-primary-navigation > .col-full {
    width: 72px;
    min-height: 0;
    margin: 0;
    padding: 0;
  }
  body.riv-local #site-navigation.main-navigation {
    width: 72px;
    margin-left: 0;
    order: 0;
  }
  body.riv-local #site-navigation .primary-navigation {
    display: none;
  }
  body.riv-local #site-navigation .menu-toggle {
    display: inline-flex;
  }
  body.riv-local .site-header-cart {
    display: none;
  }
  body.riv-local #site-navigation.toggled .handheld-navigation {
    display: block;
    position: absolute;
    top: calc(100% + 22px);
    right: 0;
    width: min(340px, calc(100vw - 2 * var(--riv-gutter)));
    padding: 8px;
    background: var(--riv-white);
    border: 1px solid var(--riv-line);
    box-shadow: 0 7px 12px rgb(12 12 12 / 12%);
    z-index: 20;
  }
  body.riv-local #site-navigation .handheld-navigation ul.menu {
    display: block;
  }
  body.riv-local #site-navigation .handheld-navigation ul.menu > li {
    display: block;
    float: none;
    width: 100%;
  }
  body.riv-local .main-navigation ul.menu li {
    margin: 0;
  }
  body.riv-local .main-navigation ul.menu li a {
    display: block;
    padding: 0.7rem 0.75rem;
    color: var(--riv-ink);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid var(--riv-line);
  }
  body.riv-local .main-navigation ul.sub-menu li a {
    padding-left: 1.6rem;
    font-weight: 400;
    background: var(--riv-soft);
  }
}

/* En tablet la barra inferior de Storefront no existe: conservar el carrito
   visible junto al botón, sin ocupar espacio dentro de la navegación. */
@media (min-width: 768px) and (max-width: 1279.98px) {
  body.riv-local #masthead #site-header-cart {
    display: block;
    position: absolute;
    top: 16px;
    right: 114px;
    width: 155px;
  }
}

/* Buscador y carrito de cabecera */
body.riv-local .site-search {
  flex: 0 0 auto;
  margin: 0;
}
/* El buscador heredado ocupa un tercio de la franja y recorta el carrito.
   La búsqueda de catálogo sigue en la barra lateral y la barra móvil. */
body.riv-local #masthead .site-search {
  display: none;
}
body.riv-local .site-search .search-field,
body.riv-local .site-header .search-field {
  width: auto;
  min-width: 0;
  border: 1px solid var(--riv-muted);
  border-radius: var(--riv-radius);
  padding: 0.6rem 0.8rem;
  background: var(--riv-white);
}
body.riv-local .site-header-cart {
  flex: 0 0 auto;
  margin: 0;
}
body.riv-local .site-header-cart .cart-contents {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid rgb(255 255 255 / 30%);
  border-radius: var(--riv-radius);
  color: var(--riv-on-dark);
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none;
  top: 0;
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}
body.riv-local .site-header-cart .cart-contents:hover,
body.riv-local .site-header-cart .cart-contents:focus {
  border-color: var(--riv-yellow);
  background: var(--riv-carbon-deep);
  color: var(--riv-white);
}
body.riv-local .site-header-cart .cart-contents .count {
  color: var(--riv-yellow);
}
/* Foco visible sobre la cabecera oscura: el anillo por defecto (#b3400a) no
   alcanza 3:1 frente a carbon; el naranja visual sí (4.66:1). */
body.riv-local #masthead :focus-visible {
  outline-color: var(--riv-yellow);
}

/* ==========================================================================
   5. Migas de pan
   Storefront/envuelve `nav.woocommerce-breadcrumb` en `.storefront-breadcrumb`.
   ========================================================================== */
body.riv-local .storefront-breadcrumb {
  background: var(--riv-soft);
  border-bottom: 1px solid var(--riv-line);
  padding-block: 0.85rem;
}
body.riv-local .woocommerce-breadcrumb {
  margin: 0;
  color: var(--riv-muted);
  font-size: 0.8rem;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}
body.riv-local .woocommerce-breadcrumb a {
  color: var(--riv-ink);
  text-decoration: none;
}
body.riv-local .woocommerce-breadcrumb a:hover,
body.riv-local .woocommerce-breadcrumb a:focus {
  color: var(--riv-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ==========================================================================
   6. Pie de página y barra móvil
   ========================================================================== */
body.riv-local #colophon.site-footer {
  background: var(--riv-carbon);
  color: var(--riv-on-dark);
  margin-top: var(--riv-space);
}
body.riv-local #colophon a {
  color: var(--riv-white);
  text-decoration: none;
}
body.riv-local #colophon a:hover,
body.riv-local #colophon a:focus {
  color: var(--riv-yellow);
  text-decoration: underline;
  text-underline-offset: 3px;
}
body.riv-local:not(.elementor-page) #colophon .footer-widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: clamp(24px, 4vw, 48px);
  padding-block: clamp(36px, 5vw, 64px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
body.riv-local #colophon .footer-widgets .widget {
  float: none;
  width: auto;
  margin: 0;
}
body.riv-local #colophon .widget-title {
  display: inline-block;
  margin-bottom: 1rem;
  padding-bottom: 0.35rem;
  color: var(--riv-white);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-bottom: 2px solid var(--riv-yellow);
}
body.riv-local #colophon ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
body.riv-local #colophon li {
  padding-block: 0.28rem;
}
body.riv-local #colophon .site-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 22px;
  padding-block: 22px;
  color: var(--riv-on-dark-muted);
  font-size: 0.82rem;
}
body.riv-local #colophon .site-info a {
  color: var(--riv-on-dark);
}
/* Barra fija de Storefront: normaliza el ancho de sus enlaces móviles. El
   tema padre da 33.333% a cada li; dentro de una grid de tres columnas eso
   dejaba cada acceso en un tercio de su propia celda. */
body.riv-local .storefront-handheld-footer-bar {
  background: var(--riv-carbon);
  color: var(--riv-white);
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
body.riv-local .storefront-handheld-footer-bar a {
  color: var(--riv-white);
}
body.riv-local .storefront-handheld-footer-bar ul li {
  width: auto;
  min-width: 0;
}
body.riv-local .storefront-handheld-footer-bar ul li > a.riv-handheld-link {
  box-sizing: border-box;
  width: 100%;
  background-color: var(--riv-carbon);
}
body.riv-local .storefront-handheld-footer-bar a:hover,
body.riv-local .storefront-handheld-footer-bar a:focus {
  color: var(--riv-yellow);
}

/* Pie Elementor (plantilla 285): la banda amarilla se lleva al rol de
   superficie oscura del sistema (carbon) con texto claro y acento naranja.
   Solo color: no se alteran medidas, columnas ni el contenido. */
body.riv-local
  #colophon
  .elementor-285
  .elementor-element.elementor-element-d8615ff:not(
    .elementor-motion-effects-element-type-background
  ),
body.riv-local
  #colophon
  .elementor-285
  .elementor-element.elementor-element-d8615ff
  > .elementor-motion-effects-container
  > .elementor-motion-effects-layer {
  background-color: var(--riv-carbon);
  background-image: none;
}
body.riv-local #colophon .elementor-285 .elementor-heading-title {
  color: var(--riv-white);
}
body.riv-local #colophon .elementor-285 .elementor-icon-list-text {
  color: var(--riv-on-dark);
}
body.riv-local #colophon .elementor-285 .elementor-icon-list-icon i {
  color: var(--riv-yellow);
}
body.riv-local #colophon .elementor-285 .elementor-icon-list-icon svg {
  fill: var(--riv-yellow);
}
body.riv-local
  #colophon
  .elementor-285
  .elementor-icon-list-item:hover
  .elementor-icon-list-text,
body.riv-local
  #colophon
  .elementor-285
  .elementor-icon-list-item:hover
  .elementor-icon-list-icon
  i {
  color: var(--riv-yellow);
}
/* Foco visible sobre el pie oscuro: el anillo por defecto (#b3400a) no
   alcanza 3:1 frente a carbon; el naranja visual sí (4.66:1). Cubre el pie de
   Storefront (#colophon.site-footer) y el pie de Elementor (plantilla 285). */
body.riv-local #colophon :focus-visible {
  outline-color: var(--riv-yellow);
}

/* ==========================================================================
   7. Botones
   Excluye `.elementor-button` para no competir con el diseño de Elementor.
   `.button` en minúsculas es el patrón de Storefront/WooCommerce.
   ========================================================================== */
body.riv-local
  :is(
    .button,
    .added_to_cart,
    .wp-block-button__link,
    .wc-block-components-button,
    button:not(.elementor-button):not(.menu-toggle),
    input[type="submit"]:not(.elementor-button),
    input[type="button"]:not(.elementor-button),
    input[type="reset"]:not(.elementor-button)
  ) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: var(--riv-orange-strong);
  border: 2px solid var(--riv-orange-strong);
  border-radius: var(--riv-radius);
  color: var(--riv-white);
  padding: 0.72rem 1.15rem;
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease,
    color 0.18s ease, transform 0.18s ease;
}
body.riv-local
  :is(
    .button,
    .added_to_cart,
    .wp-block-button__link,
    .wc-block-components-button,
    button:not(.elementor-button):not(.menu-toggle),
    input[type="submit"]:not(.elementor-button),
    input[type="button"]:not(.elementor-button),
    input[type="reset"]:not(.elementor-button)
  ):hover {
  background: var(--riv-yellow-dark);
  border-color: var(--riv-yellow-dark);
  color: var(--riv-white);
  transform: translateY(-2px);
}
/* Acción principal: botón oscuro (equivalente al .button-dark de la maqueta) */
body.riv-local
  :is(
    .button.alt,
    .checkout-button,
    #place_order,
    .single_add_to_cart_button,
    .woocommerce-message .button,
    .woocommerce-info .button,
    .wc-block-components-button.is-primary
  ) {
  background: var(--riv-carbon);
  border-color: var(--riv-carbon);
  color: var(--riv-white);
}
body.riv-local
  :is(
    .button.alt,
    .checkout-button,
    #place_order,
    .single_add_to_cart_button,
    .woocommerce-message .button,
    .woocommerce-info .button,
    .wc-block-components-button.is-primary
  ):hover {
  background: var(--riv-yellow);
  border-color: var(--riv-yellow);
  color: var(--riv-ink);
}

/* ==========================================================================
   8. Formularios
   ========================================================================== */
body.riv-local
  :is(
    input[type="text"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    input[type="month"],
    input[type="week"],
    input[type="time"],
    input[type="datetime-local"],
    select,
    textarea
  ) {
  width: 100%;
  max-width: 100%;
  background: var(--riv-white);
  border: 1px solid var(--riv-muted); /* control: borde con ≥3:1 (1.4.11) */
  border-radius: var(--riv-radius);
  color: var(--riv-ink);
  padding: 0.68rem 0.85rem;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.4;
}
body.riv-local
  :is(
    input[type="text"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="number"],
    select,
    textarea
  ):focus {
  border-color: var(--riv-blue);
  outline: 2px solid var(--riv-blue);
  outline-offset: 1px;
}
body.riv-local :is(input, textarea)::placeholder {
  color: var(--riv-muted);
  opacity: 1;
}
body.riv-local textarea {
  min-height: 8.5rem;
  resize: vertical;
}
body.riv-local :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--riv-ink);
}
body.riv-local .form-row {
  margin-bottom: 1rem;
}
body.riv-local .form-row label {
  color: var(--riv-ink);
  font-weight: 600;
  font-size: 0.9rem;
}
body.riv-local .form-row .required {
  color: var(--riv-blue);
  text-decoration: none;
}

/* ==========================================================================
   9. WooCommerce · archivo de producto (lista)
   ========================================================================== */
body.riv-local .woocommerce-products-header {
  padding-block: clamp(18px, 3vw, 34px);
  margin-bottom: clamp(22px, 3vw, 34px);
  border-bottom: 1px solid var(--riv-line);
}
body.riv-local
  .woocommerce-products-header__title.page-title {
  margin: 0;
  color: var(--riv-ink);
  font-size: clamp(2rem, 3.6vw, 2.9rem);
}
body.riv-local .term-description {
  max-width: 70ch;
  color: var(--riv-body);
}
body.riv-local:not(.elementor-page) .term-description > :last-child {
  margin-bottom: 0;
}
body.riv-local .woocommerce .woocommerce-result-count {
  margin: 0;
  color: var(--riv-muted);
  font-size: 0.88rem;
}
body.riv-local .woocommerce .woocommerce-ordering {
  margin: 0;
}
body.riv-local .woocommerce .woocommerce-ordering select {
  width: auto;
  min-width: 190px;
}
body.riv-local .storefront-sorting {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px 24px;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--riv-line);
  margin-bottom: clamp(20px, 3vw, 34px);
}

/* Rejilla de productos */
body.riv-local:not(.elementor-page) ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: clamp(18px, 2.6vw, 32px);
  margin: 0 0 clamp(28px, 4vw, 48px);
  padding: 0;
  list-style: none;
}
body.riv-local:not(.elementor-page) ul.products::before,
body.riv-local:not(.elementor-page) ul.products::after {
  content: none;
}
body.riv-local:not(.elementor-page) ul.products li.product {
  display: flex;
  flex-direction: column;
  float: none;
  clear: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0 0 1rem;
  background: var(--riv-white);
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
  transition: border-color 0.2s ease, box-shadow 0.2s ease,
    transform 0.2s ease;
}
body.riv-local:not(.elementor-page) ul.products li.product:hover,
body.riv-local:not(.elementor-page) ul.products li.product:focus-within {
  border-color: var(--riv-ink);
  box-shadow: var(--riv-shadow);
  transform: translateY(-3px);
}
body.riv-local:not(.elementor-page)
  ul.products
  li.product
  .woocommerce-loop-product__link {
  display: block;
  flex: 1 1 auto;
  color: inherit;
  text-decoration: none;
}
body.riv-local:not(.elementor-page) ul.products li.product img {
  display: block;
  width: 100%;
  margin: 0;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
body.riv-local ul.products li.product .woocommerce-loop-product__title {
  margin: 0;
  padding: 1rem 1rem 0.35rem;
  color: var(--riv-ink);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.25;
}
body.riv-local ul.products li.product .price {
  display: block;
  padding: 0 1rem 0.75rem;
  color: var(--riv-ink);
  font-size: 1.02rem;
  font-weight: 700;
}
body.riv-local ul.products li.product .price del {
  color: var(--riv-muted);
  font-weight: 400;
}
body.riv-local ul.products li.product .price ins {
  background: var(--riv-yellow);
  color: var(--riv-ink);
  padding: 0 0.18em;
  text-decoration: none;
}
body.riv-local:not(.elementor-page)
  ul.products
  li.product
  :is(.button, .added_to_cart) {
  align-self: flex-start;
  margin: 0 1rem 0.2rem;
}
body.riv-local ul.products li.product .star-rating {
  margin: 0 1rem 0.4rem;
}
body.riv-local .star-rating::before {
  color: var(--riv-line);
}
body.riv-local .star-rating span::before {
  color: var(--riv-ink);
}
/* Etiqueta de oferta */
body.riv-local :is(.woocommerce ul.products li.product .onsale, .woocommerce span.onsale) {
  min-height: 0;
  min-width: 0;
  padding: 0.3rem 0.7rem;
  background: var(--riv-yellow);
  border-radius: var(--riv-radius);
  color: var(--riv-ink);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}

/* ==========================================================================
   10. WooCommerce · paginación
   ========================================================================== */
body.riv-local .woocommerce-pagination {
  margin-block: clamp(22px, 3vw, 40px);
}
body.riv-local .woocommerce-pagination ul.page-numbers {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}
body.riv-local .woocommerce-pagination ul.page-numbers li {
  margin: 0;
  border: 0;
}
body.riv-local
  .woocommerce-pagination
  ul.page-numbers
  :is(a, span.page-numbers) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.6rem;
  height: 2.6rem;
  padding: 0 0.5rem;
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
  color: var(--riv-ink);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
body.riv-local .woocommerce-pagination ul.page-numbers a:hover {
  background: var(--riv-yellow);
  border-color: var(--riv-yellow);
}
body.riv-local .woocommerce-pagination ul.page-numbers span.current {
  background: var(--riv-carbon);
  border-color: var(--riv-carbon);
  color: var(--riv-white);
}

/* ==========================================================================
   11. WooCommerce · ficha de producto
   ========================================================================== */
body.riv-local.single-product:not(.elementor-page) div.product {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: start;
}
body.riv-local.single-product:not(.elementor-page) div.product::before,
body.riv-local.single-product:not(.elementor-page) div.product::after {
  content: none;
}
@media (max-width: 767px) {
  body.riv-local.single-product:not(.elementor-page) div.product {
    grid-template-columns: minmax(0, 1fr);
  }
}
body.riv-local.single-product:not(.elementor-page) div.product > :not(.woocommerce-product-gallery):not(.summary) {
  grid-column: 1 / -1;
}
body.riv-local .woocommerce-product-gallery {
  float: none;
  width: auto;
  margin: 0;
  opacity: 1 !important;
}
/* Storefront fija galería y resumen a un % de ancho con float; dentro de la
   rejilla de la ficha deben ocupar su columna entera (mayor especificidad). */
body.riv-local.single-product div.product .woocommerce-product-gallery,
body.riv-local.single-product div.product .summary.entry-summary {
  float: none;
  width: 100%;
  margin: 0;
}
body.riv-local .woocommerce-product-gallery__wrapper {
  margin: 0;
}
body.riv-local .woocommerce-product-gallery img {
  display: block;
  width: 100%;
  height: auto;
}
body.riv-local .flex-control-thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}
body.riv-local .flex-control-thumbs li {
  float: none;
  flex: 0 0 80px;
  width: 80px !important;
  height: 80px;
  margin: 0 !important;
  overflow: hidden;
  list-style: none;
}
body.riv-local .flex-control-thumbs img {
  display: block;
  width: 80px !important;
  height: 80px !important;
  max-width: none;
  object-fit: cover;
  overflow: hidden;
  color: transparent;
  font-size: 0;
  border: 1px solid transparent;
  cursor: pointer;
}
body.riv-local .flex-control-thumbs img:hover,
body.riv-local .flex-control-thumbs img.flex-active {
  border-color: var(--riv-ink);
}
body.riv-local .summary.entry-summary {
  float: none;
  width: auto;
  margin: 0;
}
body.riv-local.single-product.storefront-full-width-content #primary {
  float: none;
  width: 100%;
  margin-inline: 0;
}
body.riv-local.single-product #secondary.widget-area,
body.riv-local.single-product .storefront-product-pagination,
body.riv-local.single-product .storefront-sticky-add-to-cart {
  display: none !important;
}
body.riv-local .riv-product-whatsapp-wrap {
  margin: 1.25rem 0 0;
}
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp {
  display: inline-block;
  padding: 0.7rem 1rem;
  border: 1px solid var(--riv-orange-strong);
  background: var(--riv-orange-strong);
  color: var(--riv-white);
  font-weight: 700;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:link,
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:visited,
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:hover,
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:focus {
  color: var(--riv-white) !important;
  text-decoration: none !important;
}
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:hover,
body.riv-local .riv-product-whatsapp-wrap a.riv-product-whatsapp:focus {
  border-color: var(--riv-carbon);
  background: var(--riv-carbon);
}
body.riv-local .product_title {
  margin-bottom: 0.5rem;
  color: var(--riv-ink);
  font-size: clamp(1.9rem, 3.2vw, 2.7rem);
}
body.riv-local .summary .price {
  display: block;
  margin-bottom: 1rem;
  color: var(--riv-ink);
  font-size: 1.5rem;
  font-weight: 700;
}
body.riv-local .woocommerce-product-details__short-description {
  margin-bottom: 1.2rem;
  color: var(--riv-body);
}
body.riv-local form.cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1.2rem;
}
body.riv-local .quantity input.qty {
  width: 5rem;
  max-width: 5rem;
}
body.riv-local .product_meta {
  padding-top: 1rem;
  border-top: 1px solid var(--riv-line);
  color: var(--riv-muted);
  font-size: 0.85rem;
}
body.riv-local .product_meta a {
  color: var(--riv-ink);
}
/* Pestañas: solo apariencia; la visibilidad la controla WooCommerce/Storefront */
body.riv-local:not(.elementor-page) .woocommerce-tabs {
  padding-top: var(--riv-space);
}
body.riv-local .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1.6rem;
  margin: 0 0 1.4rem;
  padding: 0;
  border-bottom: 1px solid var(--riv-line);
  list-style: none;
}
body.riv-local .woocommerce-tabs ul.tabs li {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
body.riv-local .woocommerce-tabs ul.tabs li::before,
body.riv-local .woocommerce-tabs ul.tabs li::after {
  content: none;
  display: none;
}
body.riv-local .woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 0.7rem 0;
  color: var(--riv-ink);
  font-size: 0.92rem;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 3px solid transparent;
}
body.riv-local .woocommerce-tabs ul.tabs li a:hover {
  border-bottom-color: var(--riv-ink);
}
body.riv-local .woocommerce-tabs ul.tabs li.active a {
  border-bottom-color: var(--riv-yellow);
}
/* Relacionados / cross-sells */
body.riv-local:not(.elementor-page) :is(.related, .upsells, .cross-sells) {
  padding-top: var(--riv-space);
}
body.riv-local :is(.related, .upsells, .cross-sells) > h2 {
  margin-bottom: 1.2rem;
  color: var(--riv-ink);
  font-size: clamp(1.5rem, 2.4vw, 2rem);
}
/* Reseñas */
body.riv-local .woocommerce-Reviews .comment_container {
  padding: 1rem;
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
}

/* ==========================================================================
   12. WooCommerce · avisos
   ========================================================================== */
body.riv-local
  :is(
    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error,
    .woocommerce-noreviews,
    .woocommerce-form-coupon-toggle .woocommerce-info,
    .storefront-notice
  ) {
  background: var(--riv-soft);
  border-left: 4px solid var(--riv-ink);
  border-radius: var(--riv-radius);
  color: var(--riv-ink);
}
body.riv-local .woocommerce-error {
  border-left-color: var(--riv-blue);
}

/* ==========================================================================
   13. WooCommerce · carrito
   ========================================================================== */
body.riv-local table.shop_table {
  width: 100%;
  border: 1px solid var(--riv-line);
  border-collapse: collapse;
  border-radius: var(--riv-radius);
}
body.riv-local table.shop_table th {
  padding: 0.8rem 0.9rem;
  background: var(--riv-soft);
  border-bottom: 1px solid var(--riv-line);
  color: var(--riv-ink);
  font-weight: 700;
  text-align: left;
}
body.riv-local table.shop_table td {
  padding: 0.9rem;
  border-bottom: 1px solid var(--riv-line);
  vertical-align: middle;
}
body.riv-local .woocommerce-cart table.cart img {
  width: 84px;
  height: auto;
  border: 1px solid var(--riv-line);
}
body.riv-local .woocommerce-cart .cart-collaterals .coupon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
body.riv-local .woocommerce-cart .cart-collaterals .coupon input[type="text"] {
  width: auto;
  min-width: 11rem;
}
body.riv-local:not(.elementor-page) .woocommerce-cart-form {
  overflow-x: auto;
}
body.riv-local:not(.elementor-page) .cart-collaterals {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 360px);
  gap: clamp(20px, 3vw, 40px);
  align-items: start;
}
body.riv-local .cart-collaterals .cart_totals {
  float: none;
  width: auto;
  padding: clamp(18px, 2.4vw, 26px);
  background: var(--riv-soft);
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
}
body.riv-local .cart-collaterals .cart_totals h2 {
  margin-bottom: 0.6rem;
  color: var(--riv-ink);
  font-size: 1.35rem;
}
body.riv-local .wc-proceed-to-checkout .checkout-button {
  width: 100%;
}

/* ==========================================================================
   14. WooCommerce · pago (checkout)
   ========================================================================== */
body.riv-local:not(.elementor-page) #customer_details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(18px, 3vw, 36px);
  margin-bottom: clamp(20px, 3vw, 36px);
}
body.riv-local:not(.elementor-page)
  #customer_details
  :is(.col-1, .col-2) {
  float: none;
  width: auto;
}
body.riv-local:not(.elementor-page) .woocommerce-checkout #order_review,
body.riv-local:not(.elementor-page) .woocommerce-checkout #order_review_heading {
  float: none;
  width: auto;
}
body.riv-local .woocommerce-checkout :is(h3, #order_review_heading) {
  margin-bottom: 0.8rem;
  color: var(--riv-ink);
  font-size: 1.3rem;
}
body.riv-local .woocommerce-checkout #payment {
  background: var(--riv-soft);
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
}
body.riv-local .woocommerce-checkout #payment div.payment_box {
  background: var(--riv-white);
  color: var(--riv-body);
}
body.riv-local .woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--riv-white);
}
body.riv-local .woocommerce-form-coupon {
  display: grid;
  gap: 0.6rem;
}
body.riv-local .woocommerce-checkout #place_order {
  width: 100%;
  padding: 0.95rem 1.2rem;
  font-size: 1rem;
}

/* ==========================================================================
   15. WooCommerce · cuenta, pedidos y direcciones
   ========================================================================== */
body.riv-local:not(.elementor-page) .woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: minmax(0, 240px) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 44px);
  align-items: start;
}
body.riv-local .woocommerce-MyAccount-navigation ul {
  margin: 0;
  padding: 0;
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
  list-style: none;
}
body.riv-local .woocommerce-MyAccount-navigation ul li {
  margin: 0;
  border-bottom: 1px solid var(--riv-line);
}
body.riv-local .woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: 0;
}
body.riv-local .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 0.75rem 1rem;
  color: var(--riv-ink);
  font-size: 0.92rem;
  font-weight: 600;
  text-decoration: none;
}
body.riv-local .woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--riv-soft);
}
body.riv-local .woocommerce-MyAccount-navigation-link.is-active a {
  background: var(--riv-soft);
  border-left: 4px solid var(--riv-yellow);
  padding-left: calc(1rem - 4px);
}
body.riv-local:not(.elementor-page) .woocommerce-Addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
body.riv-local .woocommerce-Addresses :is(.col-1, .col-2, address) {
  float: none;
  width: auto;
  margin: 0;
}
body.riv-local .woocommerce-Address {
  padding: 1rem;
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
}
/* Detalle de pedido / gracias */
body.riv-local
  .woocommerce-order
  :is(ul.woocommerce-order-overview, .woocommerce-thankyou-order-details) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0;
  margin: 0 0 1.6rem;
  padding: 0;
  border: 1px solid var(--riv-line);
  border-radius: var(--riv-radius);
  list-style: none;
}
body.riv-local .woocommerce-order ul.woocommerce-order-overview li {
  margin: 0;
  padding: 1rem;
  border-top: 0;
  border-right: 1px solid var(--riv-line);
  font-size: 0.9rem;
}
body.riv-local .woocommerce-order ul.woocommerce-order-overview li:last-child {
  border-right: 0;
}

/* ==========================================================================
   16. Widgets (barra lateral del tema)
   ========================================================================== */
body.riv-local:not(.elementor-page) #secondary .widget {
  margin-bottom: 2rem;
}
body.riv-local #secondary .widget-title {
  display: inline-block;
  margin-bottom: 0.9rem;
  padding-bottom: 0.3rem;
  color: var(--riv-ink);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  border-bottom: 2px solid var(--riv-yellow);
}
body.riv-local #secondary .woof_container :is(h2, h3, h4),
body.riv-local #secondary .widget-title {
  color: var(--riv-ink);
}
body.riv-local #secondary .woof_container :is(h2, h3, h4) {
  margin: 0 0 0.8rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
}
body.riv-local #secondary ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
body.riv-local #secondary li {
  padding-block: 0.25rem;
}

/* Filtro de precio WOOF (ion.rangeSlider, skin modern): se sustituye el verde
   del plugin por la paleta local. Solo color: no se tocan medidas,
   interacción, jerarquía ni markup. */
body.riv-local .woof_price3_search_container .irs--modern .irs-bar {
  /* #cc4400 sobre el carril claro supera 3:1 (AA no-texto, WCAG 1.4.11). */
  background: var(--riv-orange-strong);
  background-image: none;
  border-top-color: var(--riv-orange-strong);
  border-bottom-color: var(--riv-orange-strong);
}
body.riv-local
  .woof_price3_search_container
  .irs--modern
  :is(.irs-from, .irs-to, .irs-single) {
  background: var(--riv-orange-strong);
  background-image: none;
  color: var(--riv-white);
}
body.riv-local
  .woof_price3_search_container
  .irs--modern
  :is(.irs-from, .irs-to, .irs-single)::before,
body.riv-local
  .woof_price3_search_container
  .irs--modern
  :is(.irs-from, .irs-to, .irs-single)::after {
  border-top-color: var(--riv-orange-strong);
  border-bottom-color: var(--riv-orange-strong);
}
/* Etiquetas mín./máx.: texto oscuro legible sobre la pastilla gris clara
   (el plugin las pintaba en blanco). Solo color. */
body.riv-local
  .woof_price3_search_container
  .irs--modern
  :is(.irs-min, .irs-max) {
  color: var(--riv-ink);
}
body.riv-local .woof_price3_search_container .irs-grid-text {
  color: var(--riv-ink);
}

/* ==========================================================================
   17. Páginas concretas (solo acentos; nunca maquetación)
   Clases de body verificadas en el sitio: page-id-643 (inicio),
   page-id-43 (cómo funciona), page-id-1283 (FAQ), page-id-505 (sobre
   nosotros), page-id-507 (contacto), .woocommerce-cart, .woocommerce-account,
   .tax-product_cat.term-h-disponible.
   ========================================================================== */
body.riv-local.tax-product_cat.term-h-disponible .woocommerce-products-header {
  border-bottom-width: 3px;
  border-bottom-color: var(--riv-yellow);
}
body.riv-local.tax-product_cat .woocommerce-products-header__title.page-title {
  text-transform: none;
}

/* ==========================================================================
   18. Accesibilidad
   ========================================================================== */
body.riv-local
  :is(a, button, input, select, textarea, [tabindex], summary):focus-visible {
  outline: 3px solid var(--riv-focus);
  outline-offset: 3px;
}
/* Enlace de salto de Storefront: solo se recolorea cuando es visible. */
body.riv-local .skip-link.screen-reader-text {
  background: var(--riv-yellow);
  color: var(--riv-ink);
  border-radius: var(--riv-radius);
  padding: 12px 18px;
  font-weight: 700;
  font-size: 0.9rem;
}
body.riv-local .screen-reader-text:focus {
  outline: 3px solid var(--riv-focus);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  body.riv-local {
    scroll-behavior: auto;
  }
  body.riv-local *,
  body.riv-local *::before,
  body.riv-local *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  body.riv-local :is(.button, .added_to_cart, .site-header-cart .cart-contents),
  body.riv-local ul.products li.product {
    transform: none !important;
  }
}

/* ==========================================================================
   19. Responsive (320 / 390 / 768 / escritorio)
   ========================================================================== */
@media (max-width: 1199.98px) {
  body.riv-local.single-product:not(.elementor-page) div.product {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}
@media (max-width: 1023.98px) {
  body.riv-local:not(.elementor-page) .cart-collaterals {
    grid-template-columns: minmax(0, 1fr);
  }
  body.riv-local:not(.elementor-page) .woocommerce-account .woocommerce {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 950px) {
  body.riv-local #masthead .col-full {
    gap: 10px 18px;
    min-height: 0;
  }
  body.riv-local .site-header-cart {
    margin-left: auto;
  }
  body.riv-local #site-navigation.main-navigation {
    margin-left: 0;
  }
}
@media (max-width: 767.98px) {
  /* Ficha de producto en una columna */
  body.riv-local.single-product:not(.elementor-page) div.product {
    grid-template-columns: minmax(0, 1fr);
  }
  body.riv-local:not(.elementor-page) ul.products {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  }
  body.riv-local .woocommerce-ordering select {
    min-width: 0;
    width: 100%;
  }
  body.riv-local #colophon .site-info {
    flex-direction: column;
    align-items: flex-start;
  }
  body.riv-local .woocommerce-order ul.woocommerce-order-overview li {
    border-right: 0;
    border-top: 1px solid var(--riv-line);
  }
}
@media (max-width: 480px) {
  body.riv-local {
    --riv-gutter: 16px;
  }
  body.riv-local:not(.elementor-page) #content.site-content {
    padding-block: clamp(36px, 9vw, 56px);
  }
  body.riv-local:not(.elementor-page) ul.products {
    grid-template-columns: minmax(0, 1fr);
  }
  body.riv-local .site-branding img {
    max-height: 58px;
  }
  /* En pantallas estrechas las acciones ocupan todo el ancho disponible */
  body.riv-local:not(.elementor-page)
    :is(.woocommerce-cart-form .actions .button, .cart .coupon .button, .form-row .button) {
    width: 100%;
  }
  body.riv-local .summary form.cart .single_add_to_cart_button {
    width: 100%;
  }
  body.riv-local .summary form.cart .quantity {
    width: 100%;
  }
  body.riv-local .quantity input.qty {
    width: 100%;
    max-width: 100%;
  }
  body.riv-local .woocommerce-tabs ul.tabs {
    gap: 0 1.1rem;
  }
}
@media (max-width: 359.98px) {
  /* 320px: nada debe desbordar horizontalmente */
  body.riv-local {
    --riv-gutter: 14px;
  }
  body.riv-local .woocommerce-breadcrumb {
    font-size: 0.74rem;
  }
  body.riv-local .site-header-cart .cart-contents {
    padding: 0.5rem 0.7rem;
    font-size: 0.84rem;
  }
  body.riv-local table.shop_table :is(th, td) {
    padding: 0.6rem 0.5rem;
  }
}