*{box-sizing:border-box}
:root{--negro:#151515;--dorado:#b58b3b;--dorado-claro:#d2b270;--fondo:#f3f4f6;--blanco:#fff;--texto:#252525;--suave:#6b7280;--borde:#e5e7eb;--verde:#2d7d46;--rojo:#a62d2d}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--texto);background:var(--fondo)}
h1,h2,h3,p{margin-top:0}
.pagina-login{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#101010,#2a2a2a)}
.login-contenedor{width:100%;max-width:470px}
.login-tarjeta{padding:38px;border-radius:20px;background:#fff;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.marca-login,.marca-menu,.usuario-superior{display:flex;align-items:center;gap:14px}
.logo-texto{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:var(--negro);color:var(--dorado-claro);font-weight:800;border:2px solid var(--dorado)}
.logo-pequeno{width:44px;height:44px;font-size:14px}
.marca-login{margin-bottom:34px}.marca-nombre{font-weight:800;font-size:21px}.marca-subtitulo{color:var(--dorado);font-size:14px;text-transform:uppercase}
.campo{display:flex;flex-direction:column;gap:8px}.campo label{font-weight:700;font-size:14px}
.campo input,.campo select{width:100%;padding:12px 13px;border:1px solid var(--borde);border-radius:9px;background:#fff;font:inherit}
.campo small,td small{display:block;margin-top:4px;color:var(--suave)}
.login-tarjeta form{display:grid;gap:18px}.texto-secundario{color:var(--suave);line-height:1.55}.pie-login{text-align:center;font-size:13px;color:var(--suave);margin-top:24px}
.boton{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:10px 16px;border:0;border-radius:8px;font-weight:700;text-decoration:none;cursor:pointer;font-size:14px}
.boton-principal{background:var(--dorado);color:#111}.boton-secundario{background:#eee;color:var(--texto)}.boton-pequeno{min-height:34px;padding:7px 11px;background:var(--negro);color:#fff}.boton-ancho{width:100%}
.alerta{margin-bottom:20px;padding:14px 16px;border-radius:9px}.alerta-error{background:#fdecec;color:var(--rojo);border:1px solid #e9b4b4}.alerta-exito{background:#eaf7ee;color:var(--verde);border:1px solid #b8ddc3}
.layout{min-height:100vh;display:grid;grid-template-columns:270px minmax(0,1fr)}
.menu-lateral{background:var(--negro);color:#fff;padding:26px 20px}.marca-menu{padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.1)}.marca-menu strong,.marca-menu span{display:block}.marca-menu span{color:var(--dorado-claro);font-size:12px;text-transform:uppercase}
.navegacion{display:grid;gap:7px;margin-top:26px}.navegacion a{display:block;padding:11px 12px;border-radius:8px;color:#f4f4f4;text-decoration:none}.grupo-menu{display:grid;gap:5px;margin-top:18px}.grupo-menu>span{padding:0 12px 5px;color:var(--dorado-claro);font-size:12px;font-weight:700;text-transform:uppercase}.deshabilitado{opacity:.42;pointer-events:none}
.barra-superior{min-height:86px;padding:18px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border-bottom:1px solid var(--borde)}.barra-superior h1{margin:0;font-size:24px}.usuario-superior{text-align:right}.usuario-superior strong,.usuario-superior span{display:block}.usuario-superior span{color:var(--suave);font-size:13px}
.area-principal{padding:30px}.bienvenida{padding:32px;border-radius:16px;color:#fff;background:#242424}.bienvenida h2{margin:10px 0;font-size:30px}.bienvenida p{margin-bottom:0;color:#dfdfdf;line-height:1.6}.etiqueta{color:var(--dorado-claro);font-size:13px;font-weight:700;text-transform:uppercase}
.tarjetas-grid{margin-top:25px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tarjeta-modulo,.formulario-tarjeta,.tabla-contenedor{background:#fff;border:1px solid var(--borde);border-radius:14px}.tarjeta-modulo{padding:24px}.tarjeta-modulo h3{margin:17px 0 9px}.tarjeta-modulo p{color:var(--suave);line-height:1.55}
.estado{display:inline-flex;padding:5px 9px;border-radius:999px;background:#ededed;color:#646464;font-size:12px;font-weight:700}.estado-activo{background:#e8f6ec;color:var(--verde)}.estado-inactivo{background:#f9e9e9;color:var(--rojo)}.enlace-tarjeta{color:#8b6722;font-weight:700;text-decoration:none}
.acciones-pagina{margin-bottom:22px;display:flex;align-items:center;justify-content:space-between;gap:20px}.tabla-contenedor{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:15px 17px;text-align:left;border-bottom:1px solid var(--borde)}th{background:#fafafa;font-size:13px;text-transform:uppercase}
.formulario-tarjeta{padding:26px}.formulario-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.formulario-acciones{margin-top:24px;display:flex;gap:12px}
@media(max-width:900px){.layout{grid-template-columns:1fr}.navegacion{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.barra-superior,.acciones-pagina,.usuario-superior{align-items:stretch;flex-direction:column;text-align:left}.area-principal{padding:20px}.tarjetas-grid,.formulario-grid,.navegacion{grid-template-columns:1fr}.formulario-acciones{flex-direction:column}.boton{width:100%}}
.seccion-historial {
    margin-top: 28px;
}

.formulario-tarjeta form {
    display: grid;
    gap: 18px;
}
.marca-menu-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding-bottom: 24px;
}

.logo-empresa-menu {
    display: block;
    width: 100%;
    max-width: 220px;
    height: auto;
    border-radius: 4px;
    background: #ffffff;
}

.marca-menu-logo span {
    color: var(--dorado-claro);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.marca-login-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

.logo-empresa-login {
    display: block;
    width: 100%;
    max-width: 340px;
    height: auto;
}

.marca-login-logo .marca-subtitulo {
    font-weight: 700;
    letter-spacing: 1.3px;
}
.acciones-tabla {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.acciones-tabla form {
    margin: 0;
}

.boton-peligro {
    border: 1px solid #b42318;
    background: #b42318;
    color: #ffffff;
}

.boton-peligro:hover {
    background: #912018;
}
.detalle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.detalle-tarjeta{padding:24px;background:#fff;border:1px solid var(--borde);border-radius:14px}
.detalle-lista{margin:0}.detalle-lista div{padding:12px 0;border-bottom:1px solid var(--borde)}
.detalle-lista div:last-child{border-bottom:0}.detalle-lista dt{margin-bottom:4px;color:var(--suave);font-size:13px;font-weight:700;text-transform:uppercase}
.detalle-lista dd{margin:0;font-weight:700}.texto-vencido{color:var(--rojo);font-weight:700}.texto-advertencia{color:#8a6515;font-weight:700}
@media(max-width:680px){.detalle-grid{grid-template-columns:1fr}}
.vencimiento-badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700}.estado-vigente{background:#e8f6ec;color:#2d7d46}.estado-proximo{background:#fff3d6;color:#8a6515}.estado-vencido{background:#f9e9e9;color:#a62d2d}.estado-sin-fecha{background:#eceff3;color:#6b7280}.campo-ancho{grid-column:1/-1}.campo textarea{width:100%;padding:12px 13px;border:1px solid var(--borde);border-radius:9px;font:inherit;resize:vertical}.bloque-separado{margin-top:20px}.lista-tareas{display:grid;gap:8px;padding-left:20px}.tarea-completa{color:#2d7d46;text-decoration:line-through}.tarea-pendiente{color:#a62d2d;font-weight:700}
.formulario-seccion {
    margin-bottom: 28px;
}

.formulario-seccion h3 {
    margin-bottom: 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--borde);
}

.estado-viaje {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.estado-viaje-programado {
    background: #fff3d6;
    color: #8a6515;
}

.estado-viaje-en-curso {
    background: #e8f6ec;
    color: #2d7d46;
}

.estado-viaje-finalizado {
    background: #e8eef9;
    color: #2f5597;
}

.estado-viaje-cancelado {
    background: #f9e9e9;
    color: #a62d2d;
}
.campo-ancho {
    grid-column: 1 / -1;
}

.empresa-datos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--borde);
    border-radius: 10px;
    background: #fafafa;
}

.empresa-datos div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.empresa-datos span {
    font-size: 12px;
    color: #666;
}

.empresa-datos strong {
    line-height: 1.4;
}

@media (max-width: 760px) {
    .empresa-datos {
        grid-template-columns: 1fr;
    }
}
.resumen-pasajeros {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.resumen-pasajeros article {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--borde, #d9dde3);
    border-radius: 12px;
    background: #fff;
}

.resumen-pasajeros span {
    color: #666;
    font-size: 13px;
}

.resumen-pasajeros strong {
    font-size: 26px;
}

.formulario-en-linea {
    display: inline;
    margin: 0;
}

.formulario-en-linea button {
    white-space: nowrap;
}

.campo-checkbox {
    display: flex;
    align-items: flex-end;
    padding-bottom: 12px;
}

.campo-checkbox label {
    display: flex;
    align-items: center;
    gap: 9px;
    cursor: pointer;
}

.campo-checkbox input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.encabezado-bloque {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}

.encabezado-bloque h3,
.encabezado-bloque p {
    margin-top: 0;
}

@media (max-width: 760px) {
    .resumen-pasajeros {
        grid-template-columns: 1fr;
    }

    .encabezado-bloque {
        flex-direction: column;
    }
}
.resumen-vencimientos {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.tarjeta-semaforo {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--borde, #d9dde3);
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    background: #fff;
}

.tarjeta-semaforo strong { font-size: 30px; }
.tarjeta-semaforo span { font-size: 13px; font-weight: 700; }

.semaforo-rojo { background: #fdeaea; color: #9c1c1c; }
.semaforo-amarillo { background: #fff6d8; color: #806000; }
.semaforo-verde { background: #e8f6ec; color: #236c3b; }
.semaforo-gris { background: #edf0f3; color: #5d6670; }

.punto-semaforo {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid rgba(0,0,0,.08);
    vertical-align: middle;
}

.badge-semaforo {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.filtros-vencimientos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 18px;
}

.filtros-vencimientos a {
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid var(--borde, #d9dde3);
    text-decoration: none;
    color: inherit;
    background: #fff;
}

.filtros-vencimientos .filtro-activo {
    font-weight: 800;
    border-color: #222;
}

.leyenda-semaforo {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}

.leyenda-semaforo span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.fila-inactiva { opacity: .62; }
.etiqueta-inactivo {
    display: inline-flex;
    margin-top: 4px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #ececec;
    color: #555;
    font-size: 11px;
}

@media (max-width: 900px) {
    .resumen-vencimientos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .resumen-vencimientos { grid-template-columns: 1fr; }
}
.resumen-por-tipo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.tarjeta-tipo-vencimiento {
    padding: 20px;
    border: 1px solid var(--borde, #d9dde3);
    border-radius: 14px;
    background: #fff;
}

.encabezado-tipo-vencimiento {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 16px;
}

.encabezado-tipo-vencimiento strong {
    display: block;
    margin-top: 4px;
    font-size: 22px;
}

.mini-conteos-vencimientos {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.mini-conteos-vencimientos span {
    padding: 6px 9px;
    border-radius: 999px;
    background: #f2f3f5;
    font-size: 12px;
}

.mini-conteos-vencimientos .mini-rojo { background: #fdeaea; color: #9c1c1c; }
.mini-conteos-vencimientos .mini-amarillo { background: #fff6d8; color: #806000; }

.urgente-tipo {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--borde, #d9dde3);
}

.urgente-tipo small { display: block; margin-top: 4px; color: var(--suave, #6b7280); }
.sin-margen { margin: 0; }

.filtros-dobles {
    display: grid;
    gap: 10px;
}

.filtros-dobles > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.dashboard-vencimientos-inicio {
    margin-top: 25px;
    padding: 24px;
    border: 1px solid var(--borde, #d9dde3);
    border-radius: 14px;
    background: #fff;
}

.dashboard-vencimientos-inicio h3 { margin: 5px 0 7px; font-size: 24px; }

.resumen-inicio-vencimientos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.tarjeta-inicio-vto {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 17px;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
}

.tarjeta-inicio-vto span { font-size: 13px; font-weight: 700; }
.tarjeta-inicio-vto strong { font-size: 25px; }

.lista-urgencias-inicio {
    display: grid;
    gap: 8px;
}

.lista-urgencias-inicio > strong { margin-bottom: 2px; }

.lista-urgencias-inicio a {
    display: grid;
    grid-template-columns: 18px minmax(180px, 1.6fr) minmax(100px, .8fr) 105px minmax(120px, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--borde, #d9dde3);
    color: inherit;
    text-decoration: none;
}

.lista-urgencias-inicio a:last-child { border-bottom: 0; }
.lista-urgencias-inicio a:hover .urgencia-entidad { text-decoration: underline; }
.lista-urgencias-inicio small { color: var(--suave, #6b7280); }
.urgencia-entidad { font-weight: 700; }

.estado-sin-urgencias {
    padding: 14px 16px;
    border-radius: 10px;
    background: #e8f6ec;
    color: #236c3b;
    font-weight: 700;
}

@media (max-width: 900px) {
    .resumen-por-tipo { grid-template-columns: 1fr; }
    .lista-urgencias-inicio a { grid-template-columns: 18px 1fr; }
    .lista-urgencias-inicio a span:not(.punto-semaforo),
    .lista-urgencias-inicio a small { grid-column: 2; }
}

@media (max-width: 680px) {
    .resumen-inicio-vencimientos { grid-template-columns: 1fr; }
    .encabezado-tipo-vencimiento { flex-direction: column; }
}
.bienvenida-documentacion{margin-bottom:24px}
.tarjeta-modulo-pendiente{opacity:.72}
.dropbox-vinculo-actual{display:grid;gap:7px;padding:14px 16px;border:1px solid var(--borde);border-radius:10px;background:#fafafa}
.dropbox-vinculo-actual code,.dropbox-explorador-ruta code,td code{overflow-wrap:anywhere;word-break:break-word}
.dropbox-explorador-ruta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;margin-bottom:14px;border:1px solid var(--borde);border-radius:10px;background:#fafafa}
.dropbox-explorador-ruta span{font-weight:800;font-size:13px;text-transform:uppercase;color:var(--suave)}
.dropbox-explorador-acciones{align-items:center;flex-wrap:wrap;margin-bottom:14px}
.dropbox-icono-carpeta{font-size:18px}
.bloque-separado-menor{margin-top:14px}
@media(max-width:680px){.dropbox-explorador-acciones{align-items:stretch}.dropbox-explorador-acciones .formulario-en-linea{display:block;width:100%}.dropbox-explorador-acciones .formulario-en-linea .boton{width:100%}}
.formulario-grid-documentacion{grid-template-columns:repeat(3,minmax(0,1fr))}
.tabla-documentos-preparar .check-documento{width:20px;height:20px;cursor:pointer}
.tabla-documentos-preparar td:first-child,.tabla-documentos-preparar th:first-child{text-align:center;width:78px}
.acciones-documentacion-final{justify-content:flex-end;margin-top:18px}
.resumen-paquete-documental{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}
.resumen-paquete-documental>div{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--borde);border-radius:12px;background:#fff}
.resumen-paquete-documental strong{font-size:28px}
.resumen-paquete-documental span{font-size:13px;font-weight:700;color:var(--suave)}
@media(max-width:900px){.formulario-grid-documentacion{grid-template-columns:1fr}.resumen-paquete-documental{grid-template-columns:1fr}}
.resumen-paquete-v04{grid-template-columns:repeat(4,minmax(0,1fr))}
.formulario-grid-correo{grid-template-columns:repeat(2,minmax(0,1fr))}
.campo-span-2{grid-column:1 / -1}
.campo textarea{width:100%;padding:12px 13px;border:1px solid var(--borde);border-radius:9px;background:#fff;font:inherit;resize:vertical}
.confirmacion-vencidos{margin-top:18px;padding:15px 16px;border:1px solid #e9b4b4;border-radius:10px;background:#fdecec;color:var(--rojo)}
.confirmacion-vencidos label{display:flex;align-items:flex-start;gap:10px;font-weight:700;cursor:pointer}
.confirmacion-vencidos input{margin-top:2px;width:18px;height:18px}
button:disabled{opacity:.5;cursor:not-allowed}
.detalle-envio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.detalle-envio-grid>div{display:flex;flex-direction:column;gap:5px;padding:14px;border:1px solid var(--borde);border-radius:10px;background:#fafafa}
.detalle-envio-grid span,.mensaje-envio-historial>span{color:var(--suave);font-size:12px;font-weight:800;text-transform:uppercase}
.detalle-envio-grid strong{overflow-wrap:anywhere}
.mensaje-envio-historial{margin-top:18px}
.mensaje-envio-historial pre{margin:8px 0 0;padding:16px;border:1px solid var(--borde);border-radius:10px;background:#fafafa;white-space:pre-wrap;font:inherit;line-height:1.55}
@media(max-width:900px){.resumen-paquete-v04,.formulario-grid-correo,.detalle-envio-grid{grid-template-columns:1fr}.campo-span-2{grid-column:auto}}
.contrato-carga{max-width:760px}
.contrato-carga input[type=file]{padding:18px;border:1px dashed var(--dorado);background:#fafafa}
.contrato-fecha{max-width:360px}
.contrato-carga h3,.formulario-tarjeta h3{margin-bottom:12px}
@media(max-width:680px){.contrato-fecha{max-width:none}}