/* ============================================================================
   Utilidades que Bootstrap 5 quitó y el diseño sigue usando
   ============================================================================

   Al subir de Bootstrap 4 a 5 casi todo el vocabulario tiene equivalente y se
   tradujo en el marcado: `mr-2` pasó a `me-2`, `font-weight-bold` a `fw-bold`,
   `text-right` a `text-end`. Estas dos no: la 5 las quitó y no puso nada en su
   lugar, así que se conservan aquí con la definición que tenían en la 4.

   No son un parche entre versiones —eso ya no existe, el CSS y el JavaScript
   son los dos 5.3.5—: son dos utilidades que la plantilla comprada usa y que
   Bootstrap dejó de ofrecer.
   ========================================================================= */

/* Bootstrap 5 quitó `text-justify` porque justificar texto perjudica la
   lectura en pantallas estrechas. Se conserva porque los textos legales y los
   avisos largos de la plataforma se escribieron con ella; cambiarlos es una
   decisión de diseño, no de migración. */
.text-justify {
    text-align: justify !important;
}

/* `form-row` era una fila de rejilla con la mitad de separación, pensada para
   formularios. La 5 la sustituyó por `row` más una clase de separación, pero
   `row` trae 1,5rem y `form-row` traía 10px: cambiarla movería la maqueta de
   ciento veinte formularios. Se conserva con sus medidas originales. */
.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}

.form-row > .col,
.form-row > [class*="col-"] {
    padding-right: 5px;
    padding-left: 5px;
}

/* ── Los enlaces vuelven a ir sin subrayado ──────────────────────────────────
   Bootstrap 4 no subrayaba los enlaces; la 5 sí, y la plantilla nunca tuvo que
   decir nada al respecto porque heredaba el comportamiento de la 4. Al subir de
   versión aparecieron subrayados en el menú, el pie, las tarjetas de doctor y
   las preguntas frecuentes: sitios donde el enlace ya se distingue por color y
   por su forma, y donde la raya sólo ensucia.

   La 5 los subraya por accesibilidad, y con razón cuando el enlace va metido en
   un párrafo: ahí el color solo no basta para quien no distingue colores. Por eso
   el subrayado se quita de base —que es como se diseñó la plataforma— y se
   devuelve dentro del texto corrido: los párrafos, las listas y las celdas de
   contenido, que es donde un enlace puede pasar desapercibido. */
a {
    text-decoration: none;
}

/* Al pasar por encima tampoco se subraya en general: los menús, las tarjetas y
   las tablas ya indican por su forma que se puede pulsar, y la raya sólo ensucia.
   Se reserva para el enlace dentro de una frase, que es donde hace falta. */
p > a:not([class]):hover,
p > a:not([class]):focus-visible,
dd > a:not([class]):hover,
label > a:not([class]):hover {
    text-decoration: underline;
}

/* El foco por teclado sí se marca siempre, en cualquier enlace: quien navega sin
   ratón necesita ver dónde está. Se hace con un contorno, no con subrayado. */
a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* Dentro de una frase el enlace se subraya siempre: ahí el color solo no basta
   para quien no distingue colores.

   Se limita a párrafos, etiquetas de formulario y definiciones. Las listas
   quedan fuera a propósito: en esta plantilla `<li><a>` es el menú de la
   cabecera, el pie y las migas de pan —navegación, no prosa—, y subrayarlas era
   justo lo que se veía mal. Se excluyen también los enlaces con clase propia,
   que son botones o tarjetas enteras enlazadas, no palabras dentro de un texto. */
p > a:not([class]),
dd > a:not([class]),
label > a:not([class]) {
    text-decoration: underline;
}
