:root{--azul:#0055aa;--azul-o:#003d7a;--fondo:#f4f6f9;--borde:#d8dee6;--texto:#1f2933;--sub:#5f6b7a;--rojo:#b42318;--verde:#1a7f37}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--fondo);color:var(--texto);font-size:15px;display:flex;flex-direction:column;min-height:100vh}
header.top{background:#fff;border-bottom:3px solid var(--azul);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:10px 16px}
.marca{display:flex;align-items:center;gap:12px;font-weight:600;color:var(--azul)}
.marca img{height:40px}



.rfc{background:var(--fondo);border:1px solid var(--borde);border-radius:4px;padding:3px 8px;font-family:ui-monospace,monospace;font-size:13px}
main{flex:1;width:100%;max-width:960px;margin:0 auto;padding:24px 16px}
section{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:24px}
h1{margin:0 0 6px;font-size:22px;color:var(--azul-o)}
h2{font-size:17px;margin:28px 0 10px}
.sub{color:var(--sub);font-size:13px;margin:6px 0 16px}
.aviso{background:#fef3f2;border:1px solid #fecdca;color:var(--rojo);padding:10px 12px;border-radius:6px}
.exito{background:#ecfdf3;border:1px solid #abefc6;color:var(--verde);padding:10px 12px;border-radius:6px}
.vacio{color:var(--sub)}
.login{max-width:380px;margin:40px auto}
.login form{display:flex;flex-direction:column;gap:14px;margin-top:16px}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500}
input[type=text],input[type=password],input[type=search]{font:inherit;padding:9px 10px;border:1px solid var(--borde);border-radius:6px}
input:focus{outline:2px solid var(--azul);outline-offset:-1px}
.mayus{text-transform:uppercase}
button,.boton{font:inherit;background:var(--azul);color:#fff;border:0;border-radius:6px;padding:10px 16px;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.boton:hover{background:var(--azul-o)}
#filtro{width:100%;max-width:320px;margin-bottom:12px}
.tabla-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:9px 10px;border-bottom:1px solid var(--borde);text-align:left;white-space:nowrap}
th{background:var(--fondo);font-weight:600;user-select:none}
th[data-tipo]{cursor:pointer}
th[data-tipo]::after{content:" \2195";color:var(--sub);font-size:11px}
tbody tr:hover{background:#f8fafc}
.nd{color:var(--sub);font-size:12px}
.constancia form{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:20px 0 4px}
.constancia form .sub{flex-basis:100%;margin:0}
.video{position:relative;padding-top:56.25%;max-width:640px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:6px}
footer{background:var(--azul);color:#fff;text-align:center;font-size:12px;padding:10px}
form.nav{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-size:14px;margin:0}
button.link{background:none;border:0;padding:0;color:var(--azul);font:inherit;font-weight:500;cursor:pointer}
button.link:hover{background:none;text-decoration:underline}
.aviso button.link{color:var(--rojo);text-decoration:underline}
button.btn-pdf,button.btn-xml{display:inline-block;padding:3px 10px;border-radius:4px;font-size:12px;font-weight:600;border:0;cursor:pointer}
button.btn-pdf{background:#fde8e8;color:var(--rojo)}
button.btn-xml{background:#e6effa;color:var(--azul)}
button.btn-pdf:hover{background:#fbd5d5}
button.btn-xml:hover{background:#d4e3f6}
.flash{margin:0 0 16px}