/* base.css — Variables de marca, lienzo de las páginas de HivePress y
   neutralización del color "granate" por defecto del reset de hello-elementor. */

:root{--uv-blue:#2563EB;--uv-navy:#1E3A8A;--uv-ink:#0F172A;--uv-amber:#F59E0B;--uv-green:#16A34A;}

/* ---- Estética base de las páginas de HivePress (respetan la cabecera fija) ---- */
body[class*="single-hp_"], body[class*="post-type-archive-hp_"], body[class*="hp-template--"], body[class*="tax-hp_"]{
  background:#F8FAFC;
}
/* Mismo lienzo que la home en TODAS las páginas de HivePress: 1180px de contenido con 20px de
   margen lateral (16px en móvil).
   Se usa `body .hp-page` (no clases del body) porque las páginas de cuenta —/account/…— NO llevan
   la clase `hp-template--`, así que el selector anterior las dejaba fuera: se quedaban con el
   `.hp-page{max-width:80rem}` de HivePress y sin margen lateral. El `body` delante garantiza además
   ganar a esa regla sin depender del orden de carga. */
body .hp-page{
  padding-top:96px; padding-bottom:64px; padding-left:20px; padding-right:20px;
  max-width:1220px; margin-left:auto; margin-right:auto;   /* 1180 de contenido + 2×20 de margen */
  box-sizing:border-box;
}
@media(max-width:1024px){ body .hp-page{ padding-top:84px; } }

/* ---- Footer: fondo oscuro garantizado + texto legible ----
   El texto del footer está pensado para fondo oscuro (títulos blancos, enlaces gris claro). Si el fondo
   oscuro de Elementor no se regenera, el texto queda del color del fondo (invisible). Lo fijamos aquí. */
[data-elementor-type="footer"]{background-color:#0F172A;}
[data-elementor-type="footer"] .elementor-heading-title{color:#FFFFFF;}
[data-elementor-type="footer"] .elementor-item{color:#CBD5E1;transition:color .15s;}
[data-elementor-type="footer"] .elementor-item:hover,[data-elementor-type="footer"] .elementor-item-active{color:#FFFFFF;}
/* Enlaces de la lista "Servicios" del footer (van al buscador filtrado por gremio) */
[data-elementor-type="footer"] .uv-foot-serv-link{color:#CBD5E1;text-decoration:none;transition:color .15s;}
[data-elementor-type="footer"] .uv-foot-serv-link:hover,[data-elementor-type="footer"] .uv-foot-serv-link:focus{color:#FFFFFF;}
/* La lista lleva una rejilla de 2 columnas con anchos fijos en el HTML del widget; en tablet esas
   columnas sumaban más que su contenedor y los nombres se salían y quedaban cortados por el
   overflow del body. Se hacen flexibles (nunca más anchas que el hueco disponible). */
[data-elementor-type="footer"] ul:has(> li > .uv-foot-serv-link){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px 14px!important;}
[data-elementor-type="footer"] li:has(> .uv-foot-serv-link){min-width:0;}
[data-elementor-type="footer"] .uv-foot-serv-link{display:block;overflow-wrap:anywhere;}
@media (max-width:1024px){
  [data-elementor-type="footer"] ul:has(> li > .uv-foot-serv-link){grid-template-columns:1fr!important;}
}
/* Los menús del footer NUNCA deben colapsar a hamburguesa (siempre lista) en tablet/móvil */
[data-elementor-type="footer"] .elementor-nav-menu--main{display:block!important;}
[data-elementor-type="footer"] .elementor-menu-toggle{display:none!important;}
[data-elementor-type="footer"] .elementor-nav-menu--dropdown{display:none!important;}

/* ---- Neutralizar el color "granate" (#c36) por defecto del reset de hello-elementor → colores de la web ---- */
/* Afecta solo a enlaces/botones "en crudo" (× de popups fancybox, submits nativos, etc.); los que ya tienen clase propia mantienen su estilo */
a{color:#2563EB;}
/* Solo botones "en crudo" (sin clase propia): los que tienen su propio estilo se gestionan solos.
   Antes esta regla se aplicaba a TODOS los botones y, al ganar por especificidad (0,1,1) a las
   clases de un solo selector, pintaba el fondo azul en hover/focus aunque el componente hubiera
   fijado su texto en azul → azul sobre azul. Le pasaba al botón "Mi cuenta" del menú móvil. */
[type=button]:not([class]),[type=submit]:not([class]),button:not([class]){border-color:var(--uv-blue);color:var(--uv-blue);}
[type=button]:not([class]):hover,[type=button]:not([class]):focus,
[type=submit]:not([class]):hover,[type=submit]:not([class]):focus,
button:not([class]):hover,button:not([class]):focus{background-color:var(--uv-blue);color:#fff;}
/* `button.button` se colaba por la rendija de `:not([class])`: TIENE clase, así que la regla de
   arriba no le llega, pero `button` es la clase genérica de WordPress y nadie la viste aquí — así
   que se quedaba con el granate del reset, borde rosa y relleno rosa al pasar el ratón. Lo usa
   HivePress en «Volver a mi cuenta» (`listing-complete-message.php`), que es de las últimas
   pantallas del alta. Estaba así en los dieciocho dominios.
   Va con `var(--uv-blue)` y no con el hexadecimal para que cada front lo recoloree con su paleta;
   pespas.com lo rehace entero en su maquetación. */
button.button,input.button{
  border:1px solid var(--uv-blue);border-radius:3px;background-color:transparent;color:var(--uv-blue);
  display:inline-block;padding:.5rem 1rem;text-align:center;cursor:pointer;
}
button.button:hover,button.button:focus,
input.button:hover,input.button:focus{background-color:var(--uv-blue);color:#fff;}
/* ---- El filete gris sobre la primera fila de CUALQUIER tabla ----
   `hello-elementor/assets/css/reset.css` dibuja un `border-block-start: 1px solid hsla(0,0%,50%,.502)`
   sobre las celdas de la primera fila del `thead`. Es un gris translúcido que no pertenece a ninguna
   de las paletas y que se suma al borde que la propia tabla ya lleva: el resultado es una línea
   doble encima de la cabecera, más marcada que las que separan las filas.
   Se quita aquí, junto al resto de defaults del tema padre que se neutralizan, y no en cada
   componente: es un valor del reset, no una decisión de diseño de nadie. */
table caption + thead tr:first-child td,
table caption + thead tr:first-child th,
table colgroup + thead tr:first-child td,
table colgroup + thead tr:first-child th,
table thead:first-child tr:first-child td,
table thead:first-child tr:first-child th { border-block-start: 0; }

/* Botones del lightbox de galería (Fancybox): × y flechas sin granate, sobre su fondo oscuro */
.fancybox-button,.fancybox-close-small,.fancybox-button:hover,.fancybox-close-small:hover{border-color:transparent!important;color:#fff!important;}
.fancybox-close-small:hover,.fancybox-button:hover{background-color:rgba(0,0,0,.45)!important;}
