/* ==========================================================================
   Rutas y Sendas · Adaptación de los bloques de WordPress al diseño aprobado
   Los componentes del prototipo (.boton, .enlace-flecha, .polaroid…) se aplican
   también a los bloques nativos (Botones, Imagen, Grupo, Detalles), de modo que
   la Home se pueda editar en el editor de bloques sin perder el diseño.
   Requiere tokens.css y sistema.css.
   ========================================================================== */

/* ---------- Menús nativos (listas dentro de los contenedores del prototipo) ---------- */
.barra-superior__enlaces ul { list-style: none; display: flex; gap: 1.25rem; }
.menu li, .barra-superior__enlaces li, .pie li { margin: 0; }
a[aria-disabled="true"] { cursor: default; }

/* ---------- Botones nativos con las clases del sistema ---------- */
.wp-block-buttons.botones { margin: 0; padding: 0; gap: .75rem; }
.wp-block-button[class*="boton--"] { margin: 0; }
.wp-block-button[class*="boton--"] > .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: .7rem 1.6rem;
  font: 700 .82rem/1.3 var(--f-texto); letter-spacing: .12em; text-align: center; text-transform: uppercase;
  text-decoration: none; border: 2px solid transparent; border-radius: var(--radio);
  cursor: pointer; transition: background-color .2s, color .2s, box-shadow .2s;
}
.wp-block-button.boton--principal > .wp-block-button__link { background: var(--bosque); color: #fff; box-shadow: inset 0 0 0 3px var(--bosque), inset 0 0 0 4px rgba(255,255,255,.55); }
.wp-block-button.boton--principal > .wp-block-button__link:hover { background: var(--bosque-oscuro); box-shadow: inset 0 0 0 3px var(--bosque-oscuro), inset 0 0 0 4px rgba(255,255,255,.55); }
.wp-block-button.boton--marco > .wp-block-button__link { color: var(--bosque); border-color: var(--bosque); background: transparent; box-shadow: none; }
.wp-block-button.boton--marco > .wp-block-button__link:hover { background: var(--bosque); color: #fff; }
.wp-block-button.boton--claro > .wp-block-button__link { background: var(--crema); color: var(--bosque-oscuro); box-shadow: none; }
.wp-block-button.boton--claro > .wp-block-button__link:hover { background: #fff; }
.wp-block-button.boton--marco-claro > .wp-block-button__link { color: #fff; border-color: rgba(255,255,255,.8); background: transparent; box-shadow: none; }
.wp-block-button.boton--marco-claro > .wp-block-button__link:hover { background: rgba(255,255,255,.12); }
.wp-block-button.boton--pequeno > .wp-block-button__link { min-height: 44px; padding: .55rem 1.1rem; font-size: .75rem; }

.wp-block-button.enlace-flecha { margin: 0; }
.wp-block-button.enlace-flecha > .wp-block-button__link {
  display: inline-flex; align-items: center; gap: .4rem; padding: 0 0 1px; background: none; border: 0; border-bottom: 1px solid currentColor; border-radius: 0;
  font: 700 .95rem/1.7 var(--f-texto); letter-spacing: 0; text-transform: none; color: var(--terracota-texto); text-decoration: none; box-shadow: none;
}
.wp-block-button.enlace-flecha > .wp-block-button__link::after { content: "→"; transition: transform .2s; }
.wp-block-button.enlace-flecha > .wp-block-button__link:hover::after { transform: translateX(4px); }

@media (max-width: 560px) {
  .wp-block-button[class*="boton--"] > .wp-block-button__link { letter-spacing: .08em; padding-inline: 1rem; }
  .hero .wp-block-button, .hero .wp-block-button > .wp-block-button__link { width: 100%; }
}

/* ---------- Imágenes nativas ---------- */
.wp-block-image.hero__imagen { margin: 0; }
.wp-block-image.polaroid { margin: 0; }
.polaroid .wp-element-caption { margin: 0; text-align: center; font-family: var(--f-manuscrita); font-weight: 600; letter-spacing: .01em; }
.wp-block-image.plan__grande { margin: 0; width: 100%; box-shadow: var(--sombra); }
.wp-block-image.plan__grande img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; box-shadow: none; }
.travesia__fondo .wp-block-image { margin: 0; height: 100%; }
.wp-block-image.guia__imagen { margin: 0; }

/* ---------- Grupos y encabezados ---------- */
.wp-block-group.rejilla > .wp-block-heading { margin: 0; }
.wp-block-heading { overflow-wrap: break-word; }

/* ---------- Detalles (preguntas frecuentes) ---------- */
.faq .wp-block-details { margin: 0; }
.faq .wp-block-details summary { cursor: pointer; }

/* ---------- Lista con marcas ---------- */
ul.lista-check { padding: 0; }

/* ---------- Aviso de desarrollo (solo entorno local) ---------- */
.rys-cinta {
  position: fixed; left: 1rem; bottom: 1rem; z-index: 95; max-width: calc(100vw - 2rem);
  background: var(--tinta); color: #fff; font: 600 .75rem/1.4 var(--f-texto); letter-spacing: .04em;
  padding: .5rem .8rem; border-left: 3px solid var(--terracota); box-shadow: var(--sombra);
}

/* ---------- Corrección: la clase de estilo va en el contenedor del bloque Botón, no debe pintarlo ---------- */
.wp-block-buttons .wp-block-button[class*="boton--"] {
  background: none; box-shadow: none; border: 0; padding: 0; min-height: 0; color: inherit;
  font: inherit; letter-spacing: normal; text-transform: none;
}
.wp-block-buttons .wp-block-button.enlace-flecha {
  display: block; border: 0; padding: 0; gap: 0; font: inherit; color: inherit;
}
.wp-block-buttons .wp-block-button.enlace-flecha::after { content: none; }

/* ---------- Cabecera fija bajo la barra de administración (solo con sesión iniciada) ---------- */
body.admin-bar .cabecera { top: 32px; }
@media (max-width: 782px) { body.admin-bar .cabecera { top: 46px; } }

/* ---------- Grupos: el bloque Grupo añade un contenedor interior (y GeneratePress le pone ancho máximo).
   Se vuelve transparente para que rejillas, collage y columnas del diseño aprobado funcionen igual que en el prototipo. ---------- */
.wp-block-group > .wp-block-group__inner-container {
  display: contents;
  max-width: none;
  margin: 0;
  padding: 0;
}

/* Buscador: mensaje cuando no hay coincidencias (no es una opción seleccionable). */
.sugerencias .sin-resultados { cursor: default; color: var(--piedra); background: transparent; }
.sugerencias .sin-resultados:hover { background: transparent; }

/* Collage (móvil y tablet): el polaroid inferior baja 50 px para que se lean las leyendas de los otros dos,
   y la altura del collage sigue al tamaño de los polaroides para que no invadan el texto de debajo.
   No afecta a escritorio. */
@media (max-width: 899px) {
  .collage { --anchura: min(100vw - 2 * var(--margen), 520px); min-height: calc(240px + var(--anchura) * .58 + 8px); }
  .polaroid--3 { top: 240px; }
}
@media (max-width: 560px) {
  .collage { min-height: calc(210px + var(--anchura) * .58 + 8px); }
  .polaroid--3 { top: 210px; }
}

/* Lupa del buscador superior: área táctil de 44 × 44 px sin cambiar el tamaño visible. */
.barra-superior { position: relative; z-index: 51; }
.buscador-mini button { position: relative; }
.buscador-mini button::after { content: ""; position: absolute; inset: -7px -5px; }