/* ============================================================================
   Estilo propio de la aplicación (2026-09-16).

   Hasta ahora no había ninguno: todo salía con los tamaños por defecto de
   Bootstrap, pensados para gente que usa el ordenador todo el día. Quienes usan
   esto son médicos y administrativos a los que la informática les cuesta, así
   que aquí se corrige lo que más pesa: letra pequeña, botones diminutos, gris
   claro sobre blanco, y filas apretadas.

   Se carga DESPUÉS de Bootstrap y manda sobre él. No hace falta tocar página
   por página: cada cosa que aquí se agranda se agranda en toda la aplicación.
   ============================================================================ */

:root {
    /* 17 px en vez de 16. Se nota sin que nada se descuadre. */
    --bs-body-font-size: 1.0625rem;
    --bs-body-line-height: 1.55;

    /* El gris "text-muted" de Bootstrap (#6c757d) falla el contraste con letra
       pequeña. Este se lee. */
    --bs-secondary-color: #545b62;
    --bs-secondary-color-rgb: 84, 91, 98;
}

/* ── Botones: nada más pequeño de lo que se acierta con el dedo ─────────── */
.btn {
    min-height: 44px;
    padding: 0.55rem 1.1rem;
    font-size: 1rem;
}

.btn-sm {
    min-height: 38px;
    padding: 0.4rem 0.85rem;
    font-size: 0.95rem;
}

.btn-lg {
    min-height: 54px;
    padding: 0.75rem 1.5rem;
    font-size: 1.15rem;
}

/* Los botones "borrar" en rojo hueco dentro de las tablas se confundían con
   botones normales. Rojo de verdad al pasar por encima, y siempre con borde. */
.btn-outline-danger { border-width: 2px; }

/* ── Campos de formulario ───────────────────────────────────────────────── */
.form-control,
.form-select {
    min-height: 44px;
    font-size: 1rem;
}

.form-control-sm,
.form-select-sm {
    min-height: 38px;
    font-size: 0.95rem;
}

textarea.form-control { min-height: 5rem; }

/* Las etiquetas en negrita y en negro: es lo que dice qué hay que escribir. */
.form-label,
label.form-check-label {
    font-weight: 600;
    color: #1b1f23;
}

.form-text {
    font-size: 0.92rem;
    color: #545b62;
}

.form-check-input {
    width: 1.35em;
    height: 1.35em;
    margin-top: 0.1em;
}

/* ── Texto pequeño: pequeño, pero legible ───────────────────────────────── */
small,
.small {
    font-size: 0.92em;
}

.text-muted { color: #545b62 !important; }

/* ── Tablas: aire entre filas y cabecera clara ──────────────────────────── */
.table > :not(caption) > * > * {
    padding: 0.7rem 0.6rem;
}

.table thead th {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #3d444b;
    white-space: nowrap;
}

.table-hover > tbody > tr:hover > * {
    background-color: #eef4ff;
}

/* ── Etiquetas de estado ────────────────────────────────────────────────── */
.badge {
    font-size: 0.85em;
    padding: 0.4em 0.65em;
    font-weight: 600;
}

/* ── Menú de arriba ─────────────────────────────────────────────────────── */
.navbar .nav-link {
    font-size: 1.05rem;
    padding: 0.6rem 0.85rem;
}

.dropdown-menu { font-size: 1rem; }

.dropdown-item {
    padding: 0.65rem 1.2rem;
}

.dropdown-header {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Las pestañas dentro de las páginas de médicos, del mismo tamaño que un botón. */
.nav-pills .nav-link {
    min-height: 44px;
    padding: 0.55rem 1.1rem;
    font-size: 1rem;
}

/* ── Títulos: un poco más grandes, y sin gritar ─────────────────────────── */
h1.h3 { font-size: 1.7rem; }
h1.h2 { font-size: 1.9rem; }

/* ── Avisos: que se lean y que se sepa de qué color son ─────────────────── */
.alert {
    font-size: 1rem;
    border-width: 2px;
}

/* ── Dónde está el cursor: siempre visible ──────────────────────────────── */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    outline: 3px solid rgba(13, 110, 253, 0.45);
    outline-offset: 2px;
    box-shadow: none;
}

/* ── Buscador de los desplegables (Select2), a juego con los campos ─────── */
.select2-container--bootstrap-5 .select2-selection {
    min-height: 44px;
    font-size: 1rem;
}

.select2-container--bootstrap-5 .select2--small .select2-selection,
.select2--small .select2-results__option {
    min-height: 38px;
    font-size: 0.95rem;
}

.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field {
    min-height: 42px;
    font-size: 1rem;
}

.select2-container--bootstrap-5 .select2-results__option {
    padding: 0.55rem 0.8rem;
}

/* ── Enlaces dentro de texto: subrayados, que se sepa que se puede pulsar ── */
p a:not(.btn),
li a:not(.btn):not(.nav-link):not(.dropdown-item):not(.list-group-item),
td a:not(.btn) {
    text-decoration: underline;
}

/* ── Impresión: sin menús ni botones ────────────────────────────────────── */
@media print {
    header, footer, .btn, .navbar, form { display: none !important; }
}