/*
 * O GAITEIRO — PULIDO (v3.2)
 * Retoques de acabado sin tocar style.css:
 *  - Enlaces del footer: fuera el look "<u>" de los 70 (subrayado y padding
 *    inline), texto acorde al pie, separador elegante.
 *  - Enlaces de contenido: siempre en verde del tema, subrayado fino al hover.
 *  - Título de la web: la fuente "Monotype Corsiva" solo existe en algunos
 *    ordenadores (viene con Windows/Office) y ni siquiera se parece a la
 *    reserva, así que en unos equipos se veía con una letra y en otros con
 *    otra. Ahora la letra propia del tema (Gaiteiro Script / Great Vibes) va
 *    PRIMERO: se ve igual en todos los equipos. Se agranda también la caja de
 *    línea para que no se corte nadie.
 * Todas las reglas son aditivas; el fichero se puede quitar del YAML para
 * revertir al estado anterior.
 */

/*-------------------------------------------*
 * Footer / copyright
 *-------------------------------------------*/
#copyright {
  font-size: 12px;
  line-height: 1.7;
}

#copyright p {
  margin: 0 0 8px;
}

/* Los <u> del template dejan de parecer enlaces de los 70 */
#copyright u {
  text-decoration: none;
}

#copyright a {
  /* anula el style inline "padding-right: 10px" del template */
  padding-right: 0 !important;
  margin: 0 2px;
  font-size: 12.5px;
  color: #0a6b1a;
  text-decoration: none;
  transition: color 0.15s ease;
}

#copyright a:hover {
  color: #005a1a;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Separador entre enlaces (cada <u> contiene un enlace) */
#copyright u + u::before {
  content: " \00b7 ";
  margin: 0 6px;
  color: #9c9a75;
}

/* Móvil: los 3 enlaces no caben en una línea y se partían a media línea
   ("juntos y con saltos"). Se fuerza uno por línea, limpio y centrado,
   sin separador. */
@media (max-width: 520px) {
  #copyright p {
    margin: 0 0 10px;
  }

  #copyright u {
    display: block;
    margin: 0 0 7px;
  }

  #copyright u:last-child {
    margin-bottom: 0;
  }

  #copyright u + u::before {
    content: none;
  }

  #copyright a {
    font-size: 13.5px;
  }
}

/*-------------------------------------------*
 * 3. Título de la web: misma letra en TODOS los equipos
 *
 * El tema pedía la fuente "Monotype Corsiva" SIN ninguna de reserva. Esa
 * fuente solo existe si el visitante la tiene instalada (viene con
 * Windows/Office), así que en Firefox, Mac, móvil o Linux el título se
 * dibujaba con la letra por defecto del navegador: más ancha y sin caja
 * suficiente, y se cortaba.
 *
 * "Gaiteiro Script" (Great Vibes, licencia OFL, 43 KB) se añade como letra
 * propia del tema.
 *
 * OJO: desde la v3.2 va PRIMERA en la lista, no Monotype Corsiva. Antes
 * Corsiva iba delante "para no cambiarle la letra a quien ya la tenía", pero
 * eso hacía que el título se viera DISTINTO en los equipos con Office (una
 * itálica de cancillería) que en el resto (Great Vibes, caligráfica). Como
 * Gaiteiro Script es una web font, SIEMPRE está disponible: poniéndola
 * primera gana en todos los navegadores y el título sale idéntico en
 * Windows, Linux, Mac y móvil. Corsiva se queda en la lista como reserva
 * por si la web font no llegara a cargar.
 *-------------------------------------------*/
@font-face {
  font-family: 'Gaiteiro Script';
  font-style: normal;
  /* OJO: un solo peso (400). Antes ponia "100 900", que le dice al navegador
     que el archivo ya trae todos los grosores; entonces NUNCA sintetiza la
     negrita y cualquier "font-weight: bold" se veia fino igualmente. */
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/great-vibes-latin.woff2') format('woff2');
}

/*-------------------------------------------*
 * 2. Letra del texto: la misma en TODOS los equipos
 *
 * style.css pide 'Lucida Grande', Verdana, Arial, sans-serif. Lucida Grande
 * solo existe en Mac, así que cada sistema resolvía una cosa: Windows caía
 * en Verdana (más ancha y de otro estilo), Linux en Noto Sans y el móvil en
 * Helvetica. El mismo texto se veía distinto en cada casa y, de paso, el
 * menú cambiaba de ancho (en Windows medía ~860px y se comía el título).
 *
 * Ahora la letra va en el propio tema: Noto Sans (licencia OFL, la misma que
 * la del título), un solo fichero variable de 35 KB que trae todos los
 * grosores. Se pide solo el juego latino, que es todo lo que usa la web
 * (incluye tildes, eñes, signos de apertura y euro).
 *-------------------------------------------*/
@font-face {
  font-family: 'Gaiteiro Text';
  font-style: normal;
  /* Es una fuente variable: el mismo fichero sirve del 100 al 900, así que
     la negrita es de verdad y no la que "inventa" el navegador. */
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/noto-sans-latin-var.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;
}

body,
#block-business-content,
#forum .submitted,
button,
input,
select,
textarea {
  font-family: 'Gaiteiro Text', 'Lucida Grande', Verdana, Arial, sans-serif;
}

/* El título de la cabecera: además de la reserva, la caja de línea era de
   28,8px (1,2em sobre un h2 de 24px) y el texto necesita 40px, así que las
   letras de arriba y de abajo quedaban fuera de la caja. */
#sitename h1,
#sitename h2 {
  line-height: 1.35;
}

#sitename h1 a,
#sitename h2 a {
  font-family: 'Gaiteiro Script', 'Monotype Corsiva', 'Apple Chancery',
    'URW Chancery L', 'Brush Script MT', 'Segoe Script', 'Bradley Hand',
    cursive, Georgia, serif;
}

/* El resto de sitios donde el tema pedía esa misma fuente, para que se vean
   igual entre sí en cualquier equipo. */
h1,
h2,
h3 {
  font-family: 'Gaiteiro Script', 'Monotype Corsiva', 'Apple Chancery',
    'URW Chancery L', 'Brush Script MT', 'Segoe Script', 'Bradley Hand',
    'Lucida Grande', Verdana, Arial, sans-serif;
}

#home-quote h2,
#block-titulo h1,
#home-highlights h2,
.page-title {
  font-family: 'Gaiteiro Script', 'Monotype Corsiva', 'Apple Chancery',
    'URW Chancery L', 'Brush Script MT', 'Segoe Script', 'Bradley Hand',
    cursive, Georgia, serif;
}

/*-------------------------------------------*
 * Titulos h2 en negrita
 *
 * El cliente los ve poco legibles por el trazo tan fino de la letra de
 * script. style.css los dejaba en "font-weight: normal" y solo algunos
 * (cajas de portada, pie) pedian bold. Aqui van todos los h2 en negrita; con
 * el arreglo del @font-face de arriba, ahora si se ve el grosor en cualquier
 * navegador. Para volver atras, borrar este bloque.
 *-------------------------------------------*/
h2 {
  font-weight: 700;
}

/*-------------------------------------------*
 * Enlaces de contenido (siempre verdes)
 *-------------------------------------------*/
#block-business-content .region-content a,
#block-business-content .node a,
#block-business-content .text-formatted a,
#block-business-content .field__item a,
main .node a,
main .text-formatted a,
main .field__item a,
#main .node a,
#main .text-formatted a,
#main .field__item a,
.region-content a {
  color: #0a6b1a;
}

#block-business-content .region-content a:hover,
#block-business-content .node a:hover,
#block-business-content .text-formatted a:hover,
#block-business-content .field__item a:hover,
main .node a:hover,
main .text-formatted a:hover,
main .field__item a:hover,
#main .node a:hover,
#main .text-formatted a:hover,
#main .field__item a:hover,
.region-content a:hover {
  color: #005a1a;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(10, 107, 26, 0.35);
}

/* Enlaces dentro de tarjetas/imágenes: sin subrayado que ensucie */
main img a,
#main img a,
.field__item img a {
  text-decoration: none;
}

/* Botón "Acceder al artículo" de la hemeroteca */
a.boton-articulo {
  display: inline-block;
  margin: 12px 0 6px;
  padding: 10px 18px;
  background-color: #005a1a !important;
  border: 1px solid #2C9D3A;
  border-radius: 5px;
  color: #fff !important;
  font-size: 15px;
  line-height: 1.4;
  text-decoration: none;
}

a.boton-articulo:hover,
a.boton-articulo:active {
  background-color: #2C9D3A !important;
  color: #fff !important;
  text-decoration: none;
}

/*-------------------------------------------*
 * 4. Cabecera: el menú ya no pisa el título
 *
 * El menú iba en posición absoluta (arriba a la derecha) y el título, que es
 * flotante, se metía debajo: el menú no ocupa sitio, así que el título se
 * estiraba hasta tocarlo. Medido en la web: el título acababa en el píxel
 * 375 y el menú empezaba en el 370; con Verdana (Windows) el menú medía
 * ~860px y el título se metía 70px dentro. Por eso "Inicio" se pegaba al
 * título y en Windows casi lo tapaba.
 *
 * Ahora, a partir de 1200px, la cabecera es una fila flexible: el menú va
 * en el flujo normal (ya no absoluto) y se empuja a la derecha con
 * "margin-left: auto". Si algún día el menú o el título crecen, no se
 * solapan: el menú baja a una segunda línea. Se recorta también el relleno
 * de los enlaces (15px -> 12px) para dejar aire entre título y menú.
 *
 * Por debajo de 1200px no se toca nada: el tema ya pone el menú en el flujo
 * y a ancho completo (regla de style.css).
 *-------------------------------------------*/
@media (min-width: 1200px) {
  #header > div {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: 24px;
  }

  #block-business-branding {
    order: 1;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
  }

  #block-business-main-menu {
    order: 2;
    position: static;
    height: auto;
    margin-left: auto;
    flex: 0 0 auto;
  }

  /* La búsqueda sigue en su propia línea, como hasta ahora. */
  #block-business-search {
    order: 3;
    flex: 0 0 100%;
  }

  /* El menú venía a 17px (el tema le pone "font-size: 1em" y hereda el
     cuerpo) con 15px de relleno a cada lado. Con 16px y 12px el bloque
     pasa de 795px a ~720px: caben título y menú con 60px de aire. */
  .navbar-nav > li > a {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 16px;
  }
}
