/* public_satiq/css/ayuda.css
   Estilos de la ayuda del sistema. Es PUBLICA: se lee sin iniciar sesion, para poder pasar
   el link a cualquiera. */
.ayuda-wrap { max-width:900px; margin:0 auto; padding:24px 20px 60px; }
.ayuda-tit { font-size:1.6rem; color:#C22E2B; margin:18px 0 6px; }
.ayuda-bajada { color:#5a6068; margin:0 0 26px; font-size:1.02rem; line-height:1.55; }
.ayuda-indice { background:#faf2f2; border:1px solid #f0dada; border-radius:10px; padding:16px 20px; margin-bottom:34px; }
.ayuda-indice ol { margin:0; padding-left:20px; columns:2; column-gap:30px; }
.ayuda-indice li { margin:5px 0; break-inside:avoid; }
.ayuda-indice a { color:#C22E2B; text-decoration:none; font-weight:600; font-size:0.94rem; }
.ayuda-indice a:hover { text-decoration:underline; }
.ayuda-sec { margin:0 0 34px; scroll-margin-top:16px; }
.ayuda-sec h2 { font-size:1.18rem; color:#C22E2B; border-bottom:2px solid #f0dada; padding-bottom:7px; margin:0 0 14px; }
.ayuda-sec h3 { font-size:1rem; color:#333; margin:20px 0 8px; }
.ayuda-sec p, .ayuda-sec li { line-height:1.65; color:#333; }
.ayuda-sec ol, .ayuda-sec ul { padding-left:22px; }
.ayuda-sec li { margin:6px 0; }
.ayuda-nota { background:#fff8e6; border-left:4px solid #e0a800; padding:12px 16px; margin:16px 0; border-radius:0 8px 8px 0; }
.ayuda-nota strong { color:#8a6500; }
.ayuda-ojo { background:#fdf0ef; border-left:4px solid #C22E2B; padding:12px 16px; margin:16px 0; border-radius:0 8px 8px 0; }
.ayuda-ojo strong { color:#C22E2B; }
.ayuda-tabla { width:100%; border-collapse:collapse; margin:14px 0; font-size:0.93rem; }
.ayuda-tabla th { background:#faf2f2; color:#C22E2B; text-align:left; padding:9px 12px; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.4px; border-bottom:1px solid #f0dada; }
.ayuda-tabla td { padding:9px 12px; border-bottom:1px solid #eef0f2; vertical-align:top; }
.ayuda-tabla td:first-child { font-weight:600; color:#444; white-space:nowrap; }
.ayuda-tabla tr:last-child td { border-bottom:none; }
.ayuda-contacto { margin-top:22px; }
.ayuda-volver { display:inline-block; margin-top:26px; color:#C22E2B; text-decoration:none; font-weight:600; }
.ayuda-volver:hover { text-decoration:underline; }
.ayuda-pie { margin-top:40px; padding-top:18px; border-top:1px solid #e3e5e8; color:#8a9099; font-size:0.85rem; text-align:center; }

/* En el telefono el indice pasa a una columna y la tabla de campos se apila: una tabla de
   dos columnas con descripciones largas es ilegible en 390px. */
@media (max-width:700px) {
    .ayuda-wrap { padding:16px 14px 48px; }
    .ayuda-indice ol { columns:1; }
    .ayuda-tit { font-size:1.35rem; }
    .ayuda-tabla, .ayuda-tabla tbody, .ayuda-tabla tr, .ayuda-tabla td { display:block; width:auto; }
    .ayuda-tabla thead { display:none; }
    .ayuda-tabla tr { border-bottom:1px solid #eef0f2; padding:9px 0; }
    .ayuda-tabla tr:last-child { border-bottom:none; }
    .ayuda-tabla td { border:none; padding:2px 0; white-space:normal; }
    .ayuda-tabla td:first-child { color:#C22E2B; font-size:0.86rem; text-transform:uppercase; letter-spacing:0.3px; }
}