body{
    margin:0;
    padding:20px;
    color:white;
    font-family:Arial,sans-serif;

    background-image:
        linear-gradient(
            rgba(0,0,0,0.65),
            rgba(0,0,0,0.65)
        ),
        none;

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:fixed;
}

h1{
    color:white;
    text-shadow:2px 2px 6px rgba(0,0,0,0.8);
}

.item{
    margin-bottom:10px;
}

button{
    background:#c00000;
    color:white;
    border:none;
    padding:10px;
    border-radius:5px;
    cursor:pointer;
}

input, select{
    padding:5px;
    margin-top:5px;
}

.header{
    display:flex;
    align-items:center;
    gap:15px;

    background:rgba(0,0,0,0.85);
    backdrop-filter:blur(6px);

    padding:15px;
    border-radius:12px;
    margin-bottom:25px;

    box-shadow:0 4px 15px rgba(0,0,0,0.4);
}

.logo{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:contain;
}

.header h1{
    margin:0;
    color:white;
    text-shadow:2px 2px 8px rgba(0,0,0,0,5)
}

.header p{
    margin:4px 0 0 0;
    color:#ddd;
}

#historial > div{
    background: rgba(120,0,0,0.35) !important;
    border: 1px solid rgba(255,255,255,0.4) !important;
    border-radius: 15px !important;
    padding: 18px !important;
    margin-bottom: 15px !important;
    backdrop-filter: blur(4px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.resumen{
    background: rgba(120,0,0,0.35);
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 12px;
    padding: 15px;
    margin: 15px 0;
    backdrop-filter: blur(4px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.menu-btn{
    background:transparent;
    border:none;
    color:white;
    font-size:28px;
    padding:5px;
}

.menu-lateral{
    display:none;
    background:rgba(0,0,0,0.85);
    border-radius:12px;
    padding:10px;
    margin-bottom:20px;
}

.menu-lateral button{
    display:block;
    width:100%;
    margin:8px 0;
}

.submenu {
    width: 100%;
    margin: 8px 0;
}

.submenu summary {
    cursor: pointer;
    list-style: none;
    padding: 13px;
    background: rgba(125, 0, 0, 0.85);
    border-radius: 8px;
    font-weight: bold;
    color: white;
    text-align: center;
}

.submenu summary::-webkit-details-marker {
    display: none;
}

.submenu summary::after {
    content: " ▼";
    font-size: 12px;
}

.submenu[open] summary::after {
    content: " ▲";
}

.submenu button {
    width: calc(100% - 20px);
    margin: 6px 10px;
    background: rgba(0, 0, 0, 0.75);
}

.opcion-proximamente {
    margin: 6px 10px;
    padding: 11px;
    background: rgba(40, 40, 40, 0.75);
    border-radius: 7px;
    color: #cccccc;
    text-align: center;
    font-size: 14px;
}

.inicio-bienvenida {
    background: rgba(0, 0, 0, 0.72);
    padding: 18px;
    border-radius: 14px;
    margin-bottom: 16px;
    border-left: 5px solid #b30000;
}

.inicio-bienvenida h1 {
    margin: 0 0 8px 0;
}

.inicio-bienvenida p {
    margin: 5px 0;
}

.panel-inicio {
    display: grid;
    gap: 14px;
}

.tarjeta-inicio {
    background: rgba(85, 0, 0, 0.76);
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 12px;
    overflow: hidden;
}

.tarjeta-inicio summary {
    cursor: pointer;
    padding: 16px;
    font-size: 17px;
    font-weight: bold;
    list-style: none;
}

.tarjeta-inicio summary::-webkit-details-marker {
    display: none;
}

.tarjeta-inicio summary::after {
    content: " ▼";
    float: right;
    font-size: 12px;
}

.tarjeta-inicio[open] summary::after {
    content: " ▲";
}

.tarjeta-inicio > div {
    padding: 0 16px 16px 16px;
}

.mensaje-menu {
    margin-top: 18px;
    text-align: center;
    font-weight: bold;
    opacity: 0.9;
}

:root {
    --fondo-oscuro: rgba(12, 12, 15, 0.88);
    --panel: rgba(24, 24, 29, 0.88);
    --panel-secundario: rgba(38, 38, 44, 0.82);
    --rojo-institucional: #a40000;
    --rojo-claro: #cf1b1b;
    --texto: #ffffff;
    --texto-secundario: #d6d6d6;
    --borde: rgba(255, 255, 255, 0.18);
    --sombra: 0 10px 30px rgba(0, 0, 0, 0.35);
}

* {
    box-sizing: border-box;
}

body {
    color: var(--texto);
    line-height: 1.5;
}

#app {
    min-height: 100vh;
}

.header {
    background: rgba(5, 5, 7, 0.94);
    border-bottom: 1px solid var(--borde);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}

.header h1 {
    font-size: clamp(17px, 4vw, 24px);
    letter-spacing: 0.3px;
}

.header p {
    color: var(--texto-secundario);
    font-size: 13px;
}

#inicio,
#mecanica,
#electrica,
#era,
#documentos,
#novedades,
#historialSeccion,
#materialMenorB5 {
    width: min(94%, 760px);
    margin: 20px auto;
    padding: 20px;
    background: var(--fondo-oscuro);
    border: 1px solid var(--borde);
    border-radius: 18px;
    box-shadow: var(--sombra);
    backdrop-filter: blur(7px);
}

h1, h2, h3 {
    line-height: 1.2;
}

h1 {
    font-size: clamp(24px, 6vw, 34px);
}

h2 {
    margin-top: 25px;
    font-size: 21px;
}

.item,
.resumen {
    background: var(--panel-secundario);
    border: 1px solid var(--borde);
    border-radius: 13px;
    padding: 15px;
    margin: 12px 0;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.22);
}

input,
select,
textarea {
    width: 100%;
    min-height: 45px;
    padding: 11px 12px;
    margin-top: 6px;
    color: white;
    background: rgba(8, 8, 10, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 9px;
    font-size: 16px;
}

input[type="checkbox"] {
    width: 22px;
    min-height: 22px;
    margin-right: 8px;
    vertical-align: middle;
}

textarea {
    min-height: 85px;
    resize: vertical;
}

button {
    min-height: 46px;
    padding: 11px 16px;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(
        180deg,
        var(--rojo-claro),
        var(--rojo-institucional)
    );
    color: white;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.3);
}

button:active {
    transform: scale(0.98);
}

.inicio-bienvenida {
    background: linear-gradient(
        135deg,
        rgba(10, 10, 13, 0.96),
        rgba(68, 0, 0, 0.86)
    );
    border-left: 5px solid var(--rojo-claro);
    box-shadow: var(--sombra);
}

.tarjeta-inicio {
    background: var(--panel);
    border: 1px solid var(--borde);
    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.25);
}

.tarjeta-inicio summary {
    transition: background 0.2s ease;
}

.tarjeta-inicio summary:active {
    background: rgba(164, 0, 0, 0.28);
}

@media (max-width: 600px) {
    #inicio,
    #mecanica,
    #electrica,
    #era,
    #documentos,
    #novedades,
    #historialSeccion,
    #materialMenorB5 {
        width: calc(100% - 20px);
        margin: 12px auto;
        padding: 16px;
        border-radius: 15px;
    }

    .header {
        padding: 10px;
    }

    button {
        width: 100%;
    }
}

.menu-lateral {
    position: fixed;
    top: 0;
    left: 0;
    width: min(88vw, 350px);
    height: 100vh;
    padding: 18px;
    overflow-y: auto;
    background: rgba(10, 10, 14, 0.98);
    border-right: 1px solid rgba(255,255,255,0.16);
    box-shadow: 12px 0 35px rgba(0,0,0,0.55);
    z-index: 1000;
}

.menu-encabezado {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 4px 18px;
    margin-bottom: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.16);
}

.menu-encabezado strong {
    display: block;
    font-size: 18px;
}

.menu-encabezado span {
    display: block;
    margin-top: 3px;
    color: #bdbdbd;
    font-size: 12px;
}

.cerrar-menu {
    width: 42px;
    min-height: 42px;
    padding: 0;
    border-radius: 50%;
    background: rgba(255,255,255,0.09);
    box-shadow: none;
    font-size: 18px;
}

.menu-lateral > button,
.menu-lateral .submenu {
    margin-bottom: 10px;
}

.menu-lateral > button {
    width: 100%;
    text-align: left;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: none;
}

.menu-lateral > button:hover {
    background: rgba(164,0,0,0.65);
}

.menu-lateral .submenu summary {
    text-align: left;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
}

.menu-lateral .submenu[open] summary {
    background: rgba(164,0,0,0.72);
}

.menu-lateral .submenu button {
    margin: 6px 0 0 14px;
    width: calc(100% - 14px);
    text-align: left;
    background: rgba(255,255,255,0.05);
    border-left: 3px solid #b30000;
    border-radius: 8px;
    box-shadow: none;
}

.opcion-proximamente {
    margin: 6px 0 0 14px;
    width: calc(100% - 14px);
    text-align: left;
    border-left: 3px solid #666;
}

.menu-lateral::-webkit-scrollbar {
    width: 7px;
}

.menu-lateral::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.23);
    border-radius: 10px;
}

@media (max-width: 600px) {
    .menu-lateral {
        width: 88vw;
        padding: 15px;
    }
}
.titulo-seccion {
    margin-bottom: 18px;
}

.titulo-seccion h1 {
    margin-bottom: 6px;
}

.titulo-seccion p {
    margin: 0;
    color: var(--texto-secundario);
}

.selector-moviles-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.tarjeta-movil-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 125px;
    padding: 16px;
    text-align: left;
    background: linear-gradient(
        145deg,
        rgba(35, 35, 41, 0.96),
        rgba(75, 0, 0, 0.85)
    );
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tarjeta-movil-info strong {
    margin-top: 8px;
    font-size: 18px;
}

.tarjeta-movil-info small {
    margin-top: 4px;
    color: #d0d0d0;
}

.icono-movil {
    font-size: 27px;
}

@media (max-width: 520px) {
    .selector-moviles-info {
        grid-template-columns: 1fr;
    }
}
.subtitulo-info {
    margin-top: -8px;
    margin-bottom: 18px;
    color: var(--texto-secundario);
}

.ficha-movil {
    margin-top: 18px;
    padding: 18px;
    background: rgba(20, 20, 25, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 16px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.32);
}

.encabezado-ficha {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.etiqueta-ficha {
    color: #c9c9c9;
    font-size: 13px;
}

.encabezado-ficha h2 {
    margin: 4px 0 0;
}

.boton-editar-ficha {
    width: auto;
    min-width: 105px;
}

.semaforo-general {
    display: flex;
    align-items: center;
    gap: 13px;
    margin: 17px 0;
    padding: 14px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 12px;
}

.semaforo-general small {
    display: block;
    margin-top: 3px;
    color: #cccccc;
}

.luz-semaforo {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    box-shadow: 0 0 12px currentColor;
}

.luz-verde {
    color: #2ecc71;
    background: #2ecc71;
}

.luz-amarilla {
    color: #f1c40f;
    background: #f1c40f;
}

.luz-roja {
    color: #e74c3c;
    background: #e74c3c;
}

.luz-gris {
    color: #777777;
    background: #777777;
}

.datos-ficha {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.dato-movil {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 14px;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
}

.dato-movil span {
    color: #d2d2d2;
    font-size: 13px;
}

@media (max-width: 600px) {
    .encabezado-ficha {
        align-items: flex-start;
    }

    .datos-ficha {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   QUINTA OPERACIONES — REDISEÑO INSTITUCIONAL 2.0
   ========================================================= */
:root {
    --q-rojo: #d51d28;
    --q-rojo-profundo: #8f0710;
    --q-negro: #090a0d;
    --q-carbon: #14161c;
    --q-panel: rgba(18, 20, 26, 0.92);
    --q-linea: rgba(255,255,255,.11);
    --q-muted: #aeb3bf;
    --q-verde: #39d98a;
    --q-radio: 22px;
}
html { scroll-behavior: smooth; }
body {
    padding: 0;
    min-height: 100vh;
    background-image:
      radial-gradient(circle at 18% 0%, rgba(213,29,40,.22), transparent 34%),
      linear-gradient(rgba(4,5,8,.82), rgba(4,5,8,.93)),
      none;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}
body::before {
    content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
    background: linear-gradient(115deg, transparent 0 62%, rgba(255,255,255,.025) 62% 63%, transparent 63%);
}
#app { padding-bottom: 42px; animation: qEntrada .45s ease both; }
@keyframes qEntrada { from {opacity:0; transform:translateY(8px)} to {opacity:1; transform:none} }

/* Login */
#login { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-shell { width:min(980px,100%); display:grid; grid-template-columns:1.06fr .94fr; overflow:hidden; border:1px solid var(--q-linea); border-radius:30px; box-shadow:0 35px 90px rgba(0,0,0,.58); background:rgba(8,9,12,.88); backdrop-filter:blur(18px); }
.login-brand { position:relative; padding:58px; display:flex; flex-direction:column; justify-content:center; min-height:560px; background:linear-gradient(145deg,rgba(143,7,16,.96),rgba(23,4,8,.96)); overflow:hidden; }
.login-brand::after { content:"5"; position:absolute; right:-12px; bottom:-95px; font-size:360px; line-height:1; font-weight:900; color:rgba(255,255,255,.035); }
.login-emblema { width:110px; height:110px; display:grid; place-items:center; border-radius:50%; background:#08090c; border:1px solid rgba(255,255,255,.25); box-shadow:0 15px 40px rgba(0,0,0,.4); margin-bottom:28px; }
.login-emblema img { width:92px; height:92px; object-fit:contain; }
.login-kicker,.header-kicker,.hero-etiqueta,.seccion-eyebrow { font-size:11px; font-weight:800; letter-spacing:2px; text-transform:uppercase; color:#ffb8bd; }
.login-brand h1 { margin:12px 0 10px; font-size:clamp(38px,5vw,60px); letter-spacing:-2px; }
.login-brand p { max-width:430px; color:#f0cfd2; font-size:16px; }
.login-brand small { color:#ddb9bc; }
.login-divider { width:70px; height:3px; background:#fff; margin:28px 0 18px; border-radius:10px; }
.login-card { padding:50px 44px; display:flex; flex-direction:column; justify-content:center; background:rgba(12,14,18,.94); }
.login-card-heading { display:flex; gap:14px; align-items:center; margin-bottom:30px; }
.login-card-heading h2 { margin:0 0 5px; font-size:27px; }
.login-card-heading p { margin:0; color:var(--q-muted); }
.login-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:rgba(213,29,40,.16); font-size:22px; }
.campo-login { display:block; margin-bottom:18px; color:#daddE4; font-size:13px; font-weight:700; }
.campo-login input,.campo-login select { margin-top:8px; min-height:52px; background:#0a0c10; }
.recordar-login { display:flex; align-items:center; gap:10px; margin:2px 0 24px; color:var(--q-muted); font-size:14px; }
.recordar-login input { width:20px!important; min-height:20px; margin:0; }
.boton-ingreso { width:100%; min-height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 20px; border-radius:14px; }
.boton-ingreso b { font-size:22px; }

/* Header */
.header { position:sticky; top:0; z-index:500; margin:0; padding:12px max(18px,calc((100vw - 1180px)/2)); border-radius:0; gap:14px; backdrop-filter:blur(18px); }
.header .logo { width:58px; height:58px; background:#050609; padding:4px; border:1px solid rgba(255,255,255,.13); }
.header-identidad { min-width:0; }
.header-identidad h1 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.header-kicker { color:#f06b73; }
.header-estado { margin-left:auto; display:flex; align-items:center; gap:7px; color:#cbd0da; font-size:12px; background:rgba(255,255,255,.06); border:1px solid var(--q-linea); padding:8px 11px; border-radius:999px; }
.header-estado span { width:8px; height:8px; border-radius:50%; background:var(--q-verde); box-shadow:0 0 12px var(--q-verde); }
.menu-btn { width:46px!important; min-width:46px; height:46px; border-radius:14px; background:rgba(255,255,255,.07)!important; border:1px solid var(--q-linea)!important; }

/* Contenedores */
#inicio,#mecanica,#electrica,#era,#documentos,#novedades,#historialSeccion,#materialMenorB5,#administracionInventario { width:min(calc(100% - 32px),980px); margin:28px auto; padding:0; background:transparent; border:0; box-shadow:none; backdrop-filter:none; }
#mecanica,#electrica,#era,#documentos,#novedades,#historialSeccion,#materialMenorB5,#administracionInventario { padding:26px; background:var(--q-panel); border:1px solid var(--q-linea); border-radius:var(--q-radio); box-shadow:0 24px 60px rgba(0,0,0,.34); }

/* Dashboard */
.hero-dashboard { position:relative; min-height:270px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:36px 42px; overflow:hidden; border-radius:28px; background:linear-gradient(125deg,rgba(155,8,18,.97),rgba(55,5,10,.96) 58%,rgba(11,12,16,.96)); border:1px solid rgba(255,255,255,.16); box-shadow:0 30px 75px rgba(0,0,0,.45); }
.hero-dashboard::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 78% 20%,rgba(255,255,255,.13),transparent 24%),linear-gradient(90deg,transparent,rgba(255,255,255,.025)); }
.hero-contenido,.hero-insignia { position:relative; z-index:1; }
.hero-contenido h1 { margin:10px 0 6px; font-size:clamp(32px,6vw,54px); letter-spacing:-1.7px; }
.hero-contenido > p { margin:0; color:#f1cfd2; text-transform:capitalize; }
.hero-meta { display:flex; flex-wrap:wrap; gap:9px; margin-top:24px; }
.hero-meta span { padding:8px 11px; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(0,0,0,.2); font-size:12px; }
.hero-insignia { width:175px; height:175px; flex:0 0 175px; display:grid; place-items:center; border-radius:50%; background:rgba(4,5,8,.72); border:1px solid rgba(255,255,255,.2); box-shadow:inset 0 0 35px rgba(255,255,255,.05),0 24px 60px rgba(0,0,0,.42); }
.hero-insignia img { width:145px; height:145px; object-fit:contain; }
.accesos-dashboard,.dashboard-resumen { margin-top:24px; padding:26px; border-radius:24px; background:rgba(13,15,19,.9); border:1px solid var(--q-linea); box-shadow:0 22px 55px rgba(0,0,0,.28); backdrop-filter:blur(12px); }
.seccion-cabecera { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:19px; }
.seccion-cabecera h2 { margin:5px 0 0; font-size:24px; }
.seccion-eyebrow { color:#f06b73; }
.boton-menu-secundario { width:auto!important; min-height:38px; padding:8px 13px; background:rgba(255,255,255,.07); border:1px solid var(--q-linea); box-shadow:none; font-size:12px; }
.grid-accesos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.acceso-rapido { min-height:132px; padding:18px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; text-align:left; background:linear-gradient(145deg,rgba(36,39,47,.95),rgba(19,21,27,.96)); border:1px solid var(--q-linea); box-shadow:none; transition:.22s ease; }
.acceso-rapido:hover { transform:translateY(-3px); border-color:rgba(240,74,84,.7); background:linear-gradient(145deg,rgba(76,20,26,.96),rgba(24,25,31,.96)); }
.acceso-icono { font-size:28px; margin-bottom:auto; }
.acceso-rapido strong { font-size:16px; }
.acceso-rapido small { margin-top:4px; color:var(--q-muted); font-weight:500; }
.panel-inicio { gap:11px; }
.tarjeta-inicio { background:#15171d; border-color:var(--q-linea); border-radius:16px; }
.tarjeta-inicio summary { display:flex; align-items:center; gap:10px; padding:17px 18px; }
.tarjeta-inicio summary::after { margin-left:auto; }
.tarjeta-inicio > div { padding:2px 18px 18px; color:#d8dbe2; }
.tarjeta-inicio > div h3 { display:none; }

/* Formularios y checklists */
#mecanica > h1,#electrica > h1,#era > h1,#novedades > h1,#historialSeccion > h2,#materialMenorB5 > h1,#administracionInventario > h1 { margin:0 0 24px; padding-bottom:18px; border-bottom:1px solid var(--q-linea); }
.item { position:relative; margin:12px 0!important; padding:17px; background:linear-gradient(145deg,rgba(34,37,45,.94),rgba(23,25,31,.96)); border-color:var(--q-linea); transition:.2s ease; }
.item:has(input[type="checkbox"]:checked) { border-color:rgba(57,217,138,.55); box-shadow:inset 3px 0 0 var(--q-verde),0 8px 22px rgba(0,0,0,.2); }
.item label { font-weight:750; }
input,select,textarea { border-radius:12px; background:#0c0e12; border-color:rgba(255,255,255,.16); transition:.2s ease; }
input:focus,select:focus,textarea:focus { outline:none; border-color:#eb4650; box-shadow:0 0 0 3px rgba(213,29,40,.15); }
button { transition:transform .18s ease,filter .18s ease,background .18s ease; }
button:hover { filter:brightness(1.08); }
#mecanica > button,#electrica > button,#era > button,#novedades > button,#historialSeccion > button,#formularioInformacionMovil > button,#materialMenorB5 > button,#administracionInventario > button { min-height:52px; border-radius:14px; }

/* Menú lateral */
.menu-lateral { display:none; border-radius:0 24px 24px 0; background:rgba(8,9,12,.985); backdrop-filter:blur(18px); }
.menu-encabezado { padding-top:14px; }
.menu-encabezado strong { font-size:20px; }
.menu-lateral > button,.menu-lateral .submenu summary { min-height:50px; border-radius:12px; }

/* Responsable */
#selectorResponsable,#responsableActual { width:min(calc(100% - 32px),980px); margin:16px auto 0; padding:15px 18px; border-radius:16px; background:rgba(15,17,22,.9); border:1px solid var(--q-linea); }
#selectorResponsable h2 { margin:0 0 10px; font-size:16px; }
#responsableActual { color:#d5d9e1; font-size:13px; }

/* Toast */
#toastQ { position:fixed; left:50%; bottom:24px; z-index:5000; width:min(calc(100% - 28px),470px); padding:15px 17px; display:flex; align-items:center; gap:12px; border-radius:16px; color:#fff; background:rgba(14,16,21,.97); border:1px solid rgba(255,255,255,.15); box-shadow:0 22px 60px rgba(0,0,0,.55); backdrop-filter:blur(15px); opacity:0; pointer-events:none; transform:translate(-50%,18px); transition:.25s ease; }
#toastQ.visible { opacity:1; transform:translate(-50%,0); }
#toastQ .toast-icon { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:50%; background:rgba(213,29,40,.2); }

@media(max-width:760px){
    .login-shell{grid-template-columns:1fr}.login-brand{min-height:auto;padding:34px}.login-brand::after{font-size:220px}.login-emblema{width:82px;height:82px;margin-bottom:18px}.login-emblema img{width:68px;height:68px}.login-brand h1{font-size:38px}.login-card{padding:34px}
    .header{padding:9px 12px}.header .logo{width:48px;height:48px}.header-identidad h1{font-size:14px}.header-identidad p,.header-kicker,.header-estado{display:none}
    .hero-dashboard{padding:28px;min-height:240px}.hero-insignia{width:112px;height:112px;flex-basis:112px}.hero-insignia img{width:94px;height:94px}.hero-meta{gap:6px}.hero-meta span{font-size:10px}
    .grid-accesos{grid-template-columns:repeat(2,minmax(0,1fr))}.acceso-rapido{min-height:124px;width:100%}
}
@media(max-width:480px){
    #login{padding:12px}.login-shell{border-radius:22px}.login-brand{padding:26px}.login-card{padding:28px 22px}.login-brand p{font-size:14px}
    #inicio,#mecanica,#electrica,#era,#documentos,#novedades,#historialSeccion,#materialMenorB5,#administracionInventario{width:calc(100% - 20px);margin:14px auto}
    #mecanica,#electrica,#era,#documentos,#novedades,#historialSeccion,#materialMenorB5,#administracionInventario{padding:18px}
    .hero-dashboard{padding:24px 20px;min-height:220px;border-radius:22px}.hero-contenido h1{font-size:31px}.hero-insignia{position:absolute;right:-24px;bottom:-24px;opacity:.33;width:150px;height:150px}.hero-insignia img{width:125px;height:125px}
    .accesos-dashboard,.dashboard-resumen{padding:18px;border-radius:20px}.seccion-cabecera{align-items:flex-start}.boton-menu-secundario{display:none}.grid-accesos{gap:9px}.acceso-rapido{min-height:112px;padding:14px}.acceso-icono{font-size:25px}
    #selectorResponsable,#responsableActual{width:calc(100% - 20px)}
}



/* =========================================================
   GESTIÓN OPERATIVA QUINTA COMPAÑÍA — PWA v7.0
   ========================================================= */
#splashPWA {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
      radial-gradient(circle at 50% 22%, rgba(213,29,40,.28), transparent 34%),
      linear-gradient(155deg,#090a0d,#17070a 64%,#090a0d);
    transition: opacity .45s ease, visibility .45s ease;
}
#splashPWA.oculto { opacity: 0; visibility: hidden; }
.splash-contenido { text-align:center; animation:splashEntrada .65s ease both; }
.splash-logo {
    width:132px; height:132px; object-fit:contain; padding:10px;
    border-radius:50%; background:#07080b; border:1px solid rgba(255,255,255,.2);
    box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 45px rgba(213,29,40,.2);
}
.splash-contenido h1 { margin:24px 0 7px; font-size:clamp(27px,7vw,43px); letter-spacing:-1px; }
.splash-contenido p { margin:0; color:#d9b9bc; }
.splash-version { display:inline-block; margin-top:20px; padding:7px 12px; border-radius:999px; background:rgba(255,255,255,.08); color:#d8dbe2; font-size:12px; }
.splash-carga { width:150px; height:3px; margin:24px auto 0; overflow:hidden; border-radius:10px; background:rgba(255,255,255,.1); }
.splash-carga::after { content:""; display:block; width:55%; height:100%; border-radius:inherit; background:#d51d28; animation:splashCarga 1.1s ease-in-out infinite alternate; }
@keyframes splashEntrada { from{opacity:0;transform:scale(.96)} to{opacity:1;transform:none} }
@keyframes splashCarga { from{transform:translateX(-95%)} to{transform:translateX(180%)} }

#botonInstalarPWA {
    position:fixed; right:18px; bottom:20px; z-index:4200;
    width:auto!important; display:none; align-items:center; gap:9px;
    min-height:48px; padding:0 17px; border-radius:999px;
    box-shadow:0 18px 45px rgba(0,0,0,.5);
}
#avisoActualizacionPWA {
    position:fixed; left:50%; top:16px; z-index:6000;
    width:min(calc(100% - 28px),520px); transform:translate(-50%,-140%);
    padding:15px; display:flex; align-items:center; gap:12px;
    border:1px solid rgba(255,255,255,.15); border-radius:17px;
    background:rgba(12,14,18,.98); box-shadow:0 22px 65px rgba(0,0,0,.58);
    transition:transform .3s ease;
}
#avisoActualizacionPWA.visible { transform:translate(-50%,0); }
#avisoActualizacionPWA div { flex:1; }
#avisoActualizacionPWA strong,#avisoActualizacionPWA small { display:block; }
#avisoActualizacionPWA small { margin-top:3px; color:#bfc3cc; }
#avisoActualizacionPWA button { width:auto!important; min-height:40px; padding:8px 13px; }
.estado-sin-conexion span { background:#f1c40f!important; box-shadow:0 0 12px #f1c40f!important; }
.estado-sin-conexion { color:#ffe69a!important; border-color:rgba(241,196,15,.38)!important; background:rgba(241,196,15,.09)!important; }
@media(max-width:520px){
  #botonInstalarPWA { right:12px; bottom:12px; }
  #avisoActualizacionPWA { align-items:flex-start; }
}

.version-app{
    width:100%;
    margin-top:35px;
    padding:20px;
    text-align:center;
    color:rgba(255,255,255,.65);
    font-size:13px;
    line-height:1.6;
}

.version-app span{
    color:#888;
    font-size:11px;
}

/* Material menor B-5 */
.material-menor-cabecera{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}
.material-compartimiento{margin:12px 0;border:1px solid var(--q-linea);border-radius:15px;background:linear-gradient(145deg,rgba(34,37,45,.94),rgba(23,25,31,.96));overflow:hidden}
.material-compartimiento summary{cursor:pointer;list-style:none;padding:16px 17px;font-weight:800;display:flex;align-items:center;gap:10px}
.material-compartimiento summary::-webkit-details-marker{display:none}
.material-compartimiento summary::after{content:"▼";margin-left:auto;font-size:11px;color:var(--q-muted)}
.material-compartimiento[open] summary::after{content:"▲"}
.material-contenido{padding:0 17px 17px}
.material-revision{display:flex;align-items:center;gap:9px;padding:12px;border-radius:11px;background:rgba(255,255,255,.055);margin-bottom:10px}
.material-revision input{margin:0!important;flex:0 0 22px}
.material-revision label{font-weight:700}
.material-contador{margin:14px 0;padding:12px 14px;border-radius:12px;background:rgba(213,29,40,.13);border:1px solid rgba(213,29,40,.3)}
@media(max-width:560px){.material-menor-cabecera{grid-template-columns:1fr}}



/* Material Menor B-5 — detalle por cortina */
.material-resumen-general{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:14px 0;padding:14px;border-radius:13px;background:rgba(213,29,40,.13);border:1px solid rgba(213,29,40,.3)}
.material-resumen-general strong,.material-resumen-general small{display:block}.material-resumen-general small{color:var(--q-muted);margin-top:3px}
.material-compartimiento summary{justify-content:space-between}.material-titulo{display:flex;align-items:center;gap:10px}.material-estado-cortina{margin-left:auto;margin-right:10px;padding:5px 9px;border-radius:999px;font-size:11px;background:rgba(255,255,255,.08);color:#ddd}
.material-contenido{padding:0 14px 15px}.material-lista{display:grid;gap:10px}.material-item-detalle{padding:13px;border-radius:12px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11)}
.material-item-cabecera{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.material-item-cabecera strong{font-size:15px}.material-cantidad{flex:0 0 auto;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11px;color:#ddd}
.material-estados{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.material-opcion{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#0d0f13;cursor:pointer;font-weight:700}.material-opcion input{width:18px!important;min-height:18px;margin:0!important}.material-opcion.esta:has(input:checked){border-color:rgba(57,217,138,.72);background:rgba(57,217,138,.13)}.material-opcion.no-esta:has(input:checked){border-color:rgba(231,76,60,.78);background:rgba(231,76,60,.14)}
/* Estado visual explícito: evita que quede verde/rojo al desmarcar */
.material-opcion{border-color:rgba(255,255,255,.14)!important;background:#0d0f13!important;color:#ddd;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}
.material-item-detalle.estado-sin-marcar .material-opcion{border-color:rgba(255,255,255,.14)!important;background:#0d0f13!important;box-shadow:none!important}
.material-item-detalle.estado-esta .material-opcion.esta{border-color:rgba(57,217,138,.72)!important;background:rgba(57,217,138,.13)!important;box-shadow:inset 0 0 0 1px rgba(57,217,138,.18)}
.material-item-detalle.estado-no-esta .material-opcion.no-esta{border-color:rgba(231,76,60,.78)!important;background:rgba(231,76,60,.14)!important;box-shadow:inset 0 0 0 1px rgba(231,76,60,.18)}
.material-obs-item{margin-top:9px!important;min-height:42px!important}.material-vacio{padding:14px;color:var(--q-muted);font-style:italic}.material-acciones{display:flex;gap:10px;margin:14px 0}.material-acciones button{width:auto!important;background:rgba(255,255,255,.08);border:1px solid var(--q-linea);box-shadow:none}
@media(max-width:520px){.material-estados{grid-template-columns:1fr}.material-item-cabecera{flex-direction:column}.material-cantidad{align-self:flex-start}.material-acciones{flex-direction:column}.material-acciones button{width:100%!important}}

/* Administración de inventario */
.admin-inventario-cabecera{display:flex;gap:12px;align-items:end;justify-content:space-between;margin:16px 0}.admin-inventario-cabecera label{flex:1}.admin-inventario-cabecera button{width:auto!important}.admin-lista-inventario{display:grid;gap:10px;margin:16px 0}.admin-item-inventario{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;border:1px solid var(--q-linea);border-radius:12px;background:rgba(255,255,255,.045)}.admin-item-info strong,.admin-item-info small{display:block}.admin-item-info small{color:var(--q-muted);margin-top:4px}.admin-item-acciones{display:flex;gap:7px}.admin-item-acciones button{width:auto!important;min-height:40px!important;padding:8px 11px!important}.admin-formulario-material{margin:18px 0;padding:17px;border:1px solid rgba(213,29,40,.38);border-radius:14px;background:rgba(213,29,40,.08)}.admin-formulario-material label{display:block;margin:12px 0}.admin-form-acciones{display:flex;gap:10px}.admin-form-acciones button{width:auto!important}.boton-secundario{background:rgba(255,255,255,.08)!important;border:1px solid var(--q-linea)!important;box-shadow:none!important}.admin-vacio{padding:18px;text-align:center;color:var(--q-muted);border:1px dashed var(--q-linea);border-radius:12px}@media(max-width:600px){.admin-inventario-cabecera,.admin-item-inventario,.admin-form-acciones{flex-direction:column;align-items:stretch}.admin-inventario-cabecera button,.admin-item-acciones button,.admin-form-acciones button{width:100%!important}.admin-item-acciones{display:grid;grid-template-columns:1fr 1fr}}


/* ERA y sistema de carga — v4.7 */
.era-menu-principal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin:0 0 20px}
.era-menu-boton{min-height:112px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;text-align:left;background:linear-gradient(145deg,rgba(36,39,47,.95),rgba(19,21,27,.96));border:1px solid var(--q-linea);box-shadow:none}
.era-menu-boton span{font-size:25px;margin-bottom:auto}.era-menu-boton strong{font-size:15px}.era-menu-boton small{margin-top:4px;color:var(--q-muted);font-weight:500}
.era-menu-boton.activo{border-color:rgba(240,74,84,.7);background:linear-gradient(145deg,rgba(76,20,26,.96),rgba(24,25,31,.96))}
.era-bloque{padding:18px;border:1px solid var(--q-linea);border-radius:16px;background:rgba(255,255,255,.035);margin-bottom:18px}
.era-bloque h2{margin:5px 0 16px}.era-cabecera-seleccion{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px;padding-bottom:15px;border-bottom:1px solid var(--q-linea)}
.era-cabecera-seleccion h2{margin:5px 0}.era-cabecera-seleccion p{margin:0;color:var(--q-muted)}
.era-seccion-listado{margin:20px 0}.era-seccion-listado h2{margin:0 0 11px}.era-lista{display:grid;gap:10px}
.era-item{padding:13px;border-radius:12px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11)}
.era-item-cabecera{display:flex;justify-content:space-between;gap:12px;align-items:center}.era-item-cabecera strong{font-size:15px}.era-etiqueta-marca{padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11px;color:#ddd}
.era-estados{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.era-opcion{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#0d0f13;cursor:pointer;font-weight:700}
.era-opcion input{width:18px!important;min-height:18px;margin:0!important}.era-item.estado-esta .era-opcion.esta{border-color:rgba(57,217,138,.72);background:rgba(57,217,138,.13)}.era-item.estado-no-esta .era-opcion.no-esta{border-color:rgba(231,76,60,.78);background:rgba(231,76,60,.14)}
.era-obs{margin-top:9px!important;min-height:42px!important}.era-tipos{display:flex;gap:9px;flex-wrap:wrap;margin:15px 0}.era-tipos button{width:auto!important;background:rgba(255,255,255,.08);border:1px solid var(--q-linea);box-shadow:none}
.era-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.era-info-card{padding:15px;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid var(--q-linea)}.era-info-card h3{margin:0 0 10px}.era-info-card p{margin:5px 0;color:#d8dbe2}.era-info-card small{color:var(--q-muted)}.era-info-card button{margin-top:12px;width:100%}
@media(max-width:650px){.era-menu-principal{grid-template-columns:1fr}.era-menu-boton{min-height:92px}.era-info-grid{grid-template-columns:1fr}.era-cabecera-seleccion{flex-direction:column}.era-estados{grid-template-columns:1fr}}

/* Dashboard operativo y persistencia de sesión — v4.8 */
html, body { overscroll-behavior-y: none; }
.hero-dashboard { align-items: stretch; }
.hero-contenido { flex: 1; min-width: 0; }
.hero-panel-operativo {
  position:relative; z-index:2; margin-top:22px; padding:15px; border-radius:18px;
  background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.15);
}
.metricas-dashboard { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.metrica-dashboard { padding:10px 12px; text-align:center; border-right:1px solid rgba(255,255,255,.14); }
.metrica-dashboard:last-child { border-right:0; }
.metrica-dashboard strong { display:block; font-size:24px; line-height:1; }
.metrica-dashboard small { display:block; margin-top:6px; color:#f1d9db; font-size:11px; }
.estado-vehiculos-titulo { margin:13px 0 8px; color:#ff9da4; font-size:11px; font-weight:800; letter-spacing:1.7px; text-transform:uppercase; }
.estado-vehiculos-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.estado-movil-card { min-height:76px; padding:12px 14px; text-align:left; background:rgba(7,8,11,.48); border:1px solid rgba(255,255,255,.13); box-shadow:none; }
.estado-movil-card strong,.estado-movil-card small { display:block; }
.estado-movil-card strong { font-size:19px; }
.estado-movil-card small { margin-top:4px; color:#d7d9df; }
.estado-movil-linea { margin-top:3px; font-weight:800; }
.estado-movil-linea.operativo { color:#39d98a; }
.estado-movil-linea.fuera-servicio { color:#ff666f; }
.estado-movil-linea.observacion { color:#f1c40f; }
.recordatorios-dashboard { margin-top:24px; padding:20px; border-radius:22px; background:rgba(13,15,19,.92); border:1px solid var(--q-linea); box-shadow:0 22px 55px rgba(0,0,0,.28); }
.recordatorio-lista { display:grid; gap:8px; }
.recordatorio-item { display:flex; align-items:center; gap:12px; padding:13px; border-radius:13px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); }
.recordatorio-icono { width:39px; height:39px; flex:0 0 39px; display:grid; place-items:center; border-radius:50%; background:rgba(213,29,40,.18); }
.recordatorio-item strong,.recordatorio-item small { display:block; }
.recordatorio-item small { margin-top:2px; color:var(--q-muted); }
.recordatorio-vacio { color:var(--q-muted); padding:8px 2px; }
@media(max-width:680px){
  .hero-dashboard{display:block}.hero-insignia{position:absolute;right:18px;top:22px;opacity:.22}
  .metricas-dashboard{grid-template-columns:repeat(2,1fr)}
  .metrica-dashboard:nth-child(2){border-right:0}.metrica-dashboard:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14)}
}
@media(max-width:430px){.estado-vehiculos-grid{grid-template-columns:1fr}.metrica-dashboard strong{font-size:21px}}


/* Inicio compacto — v5.1 */
.hero-dashboard{min-height:auto;padding:24px 26px}
.hero-insignia{display:none!important}
.hero-panel-operativo{margin-top:16px;padding:12px}
.metricas-dashboard{gap:0}
.metrica-dashboard{padding:9px 8px}
.metrica-dashboard strong{font-size:21px}
.metrica-dashboard small{font-size:10px}
.estado-vehiculos-titulo{margin-top:11px}
.estado-movil-card{min-height:66px;padding:10px 12px}
.accesos-dashboard{margin-top:14px;padding:18px}
.accesos-dashboard .seccion-cabecera{margin-bottom:12px}
.grid-accesos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.acceso-rapido{min-height:104px;padding:15px}
.acceso-rapido.proximamente{opacity:.62;cursor:default}
@media(max-width:480px){
  .hero-dashboard{padding:20px 16px;min-height:auto}
  .hero-contenido h1{font-size:28px}
  .accesos-dashboard{padding:15px}
  .acceso-rapido{min-height:96px}
}

/* Material Menor por móvil — v6.0 */
.selector-material-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.selector-material-grid button{min-height:112px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;padding:20px;background:linear-gradient(145deg,rgba(45,47,55,.96),rgba(18,20,25,.98));border:1px solid var(--q-linea);box-shadow:none}
.selector-material-grid button strong{font-size:27px}.selector-material-grid button small{margin-top:6px;color:var(--q-muted)}
.material-navegacion-superior{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.material-navegacion-superior button{width:auto!important}.material-navegacion-superior span{padding:7px 12px;border-radius:999px;background:rgba(213,29,40,.18);font-weight:900}
.lista-cortinas-botones{display:grid;gap:9px;margin:14px 0 20px}
.material-compartimiento{margin:0!important}
.material-compartimiento summary{min-height:64px;padding:13px 15px;background:rgba(9,11,15,.78)}
.material-compartimiento summary::after{content:"›"!important;font-size:25px!important;line-height:1;transform:rotate(0deg);transition:.2s}
.material-compartimiento[open] summary::after{transform:rotate(90deg)}
.material-titulo{display:flex;flex-direction:column!important;align-items:flex-start!important;gap:2px!important}.material-titulo b{font-size:16px}.material-titulo small{font-size:12px;color:var(--q-muted);font-weight:500}
.material-estado-cortina{margin-left:auto!important;margin-right:8px!important}
@media(max-width:560px){.selector-material-grid{grid-template-columns:1fr}.selector-material-grid button{min-height:88px}}



/* ===== Alertas operativas v7.0 ===== */
.panel-disponibilidad{margin-top:18px;padding:18px;border-radius:22px;background:rgba(8,12,18,.84);border:1px solid rgba(255,255,255,.09);box-shadow:0 18px 45px rgba(0,0,0,.22)}
.panel-disponibilidad-cabecera{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}.panel-disponibilidad-cabecera h3{margin:0;font-size:18px}.panel-disponibilidad-cabecera p{margin:5px 0 0;color:#aeb6c3;font-size:13px}
.estado-recursos-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.estado-recurso-card{appearance:none;border:1px solid rgba(255,255,255,.09);background:#111823;color:#fff;padding:14px 12px;border-radius:17px;text-align:left;cursor:pointer;transition:.18s transform,.18s border-color,.18s background}.estado-recurso-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.22)}.estado-recurso-card strong{display:block;font-size:17px;margin-bottom:7px}.estado-recurso-card small{display:block;color:#aeb6c3;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.estado-recurso-linea{font-weight:800;font-size:12px}.estado-recurso-linea.operativo{color:#44d17a}.estado-recurso-linea.observacion{color:#f4c95d}.estado-recurso-linea.fuera-servicio{color:#ff6464}.estado-recurso-card.critico{background:linear-gradient(145deg,rgba(110,15,20,.95),rgba(35,12,16,.95));border-color:rgba(255,75,85,.55)}
.modal-operativo-fondo{display:none;position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.72);backdrop-filter:blur(5px);align-items:center;justify-content:center;padding:18px}.modal-operativo-fondo.visible{display:flex}.modal-operativo{width:min(520px,100%);background:#111821;border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:22px;box-shadow:0 28px 80px rgba(0,0,0,.48)}.modal-operativo h2{margin:0 0 6px}.modal-operativo p{color:#aeb6c3;margin:0 0 16px}.modal-operativo select,.modal-operativo textarea{width:100%;box-sizing:border-box;margin-bottom:12px}.modal-operativo-acciones{display:flex;gap:10px;justify-content:flex-end}.modal-operativo-acciones button{width:auto;margin:0}@media(max-width:950px){.estado-recursos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.estado-recursos-grid{grid-template-columns:1fr}.modal-operativo-acciones{flex-direction:column-reverse}.modal-operativo-acciones button{width:100%}}




/* =========================================================
   FIREOPS DESIGN SYSTEM 1.0 · CONTROL 2.0
   ========================================================= */
:root{--fo-bg:#08101c;--fo-bg2:#0b1422;--fo-surface:#111c2c;--fo-surface2:#172438;--fo-line:#2b3e59;--fo-primary:#1976ff;--fo-primary2:#56a0ff;--fo-text:#f8fbff;--fo-muted:#9dadc2;--fo-green:#20c875;--fo-yellow:#f3b61f;--fo-red:#e5484d}
body{color:var(--fo-text)!important;background:radial-gradient(circle at 12% -5%,rgba(25,118,255,.19),transparent 30rem),radial-gradient(circle at 92% 8%,rgba(86,160,255,.08),transparent 27rem),linear-gradient(145deg,var(--fo-bg),var(--fo-bg2) 56%,#09121f)!important;background-attachment:fixed!important}
body::before{background:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px)!important;background-size:38px 38px!important}
button{background:linear-gradient(180deg,var(--fo-primary2),var(--fo-primary))!important;box-shadow:0 8px 20px rgba(25,118,255,.18)!important}button:hover{filter:brightness(1.08);transform:translateY(-1px)}
input,select,textarea{background:#0a1320!important;border-color:var(--fo-line)!important}input:focus,select:focus,textarea:focus{border-color:var(--fo-primary)!important;box-shadow:0 0 0 3px rgba(25,118,255,.15)!important}
#splashPWA{background:radial-gradient(circle at 50% 18%,rgba(25,118,255,.28),transparent 34%),linear-gradient(155deg,#07101b,#0c1727 64%,#07101b)!important}.fireops-splash .splash-logo{border-radius:22px!important;background:#07101b!important;border-color:rgba(86,160,255,.34)!important}.splash-kicker{display:block;margin-top:18px;color:#73adff;font-size:11px;font-weight:900;letter-spacing:2.2px}.splash-carga::after{background:var(--fo-primary)!important}
.login-shell{background:rgba(8,16,28,.94)!important;border-color:rgba(86,160,255,.2)!important}.fireops-login-brand{background:radial-gradient(circle at 16% 10%,rgba(86,160,255,.2),transparent 24rem),linear-gradient(145deg,#0c1b30,#091321 68%,#07101b)!important}.fireops-login-brand::after{content:"F"!important;color:rgba(86,160,255,.035)!important}.fireops-login-emblema{border-radius:22px!important;border-color:rgba(86,160,255,.26)!important}.login-kicker,.header-kicker,.hero-etiqueta,.seccion-eyebrow{color:#73adff!important}.login-divider{background:var(--fo-primary)!important}.login-card{background:rgba(10,18,30,.97)!important}.login-icon{background:rgba(25,118,255,.16)!important}
.login-instituciones{display:flex;align-items:center;gap:10px;margin-top:4px}.login-instituciones img{width:54px;height:54px;object-fit:contain;padding:4px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}.login-instituciones div{margin-left:4px}.login-instituciones strong,.login-instituciones small{display:block}.login-instituciones small{margin-top:3px;color:var(--fo-muted)}
.fireops-header{background:rgba(7,14,24,.94)!important;border-bottom:1px solid rgba(86,160,255,.18)!important;box-shadow:0 10px 30px rgba(0,0,0,.34)!important}.fireops-logo{border-radius:14px!important;background:#07101b!important;border-color:rgba(86,160,255,.22)!important}.header-identidad h1{color:var(--fo-text)!important}.header-identidad p{color:var(--fo-muted)!important}.header-sellos{margin-left:auto;display:flex;align-items:center;gap:8px}.header-sellos img{width:46px;height:46px;object-fit:contain;padding:4px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}.header-estado{margin-left:0!important;background:rgba(32,200,117,.08)!important;border-color:rgba(32,200,117,.25)!important}.header-estado span{background:var(--fo-green)!important;box-shadow:0 0 12px var(--fo-green)!important}
.menu-lateral{background:rgba(7,14,24,.985)!important;border-right-color:rgba(86,160,255,.18)!important}.menu-lateral>button,.menu-lateral .submenu summary{background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.08)!important}.menu-lateral>button:hover,.menu-lateral .submenu[open] summary{background:rgba(25,118,255,.18)!important;border-color:rgba(86,160,255,.32)!important}.menu-lateral .submenu button{border-left-color:var(--fo-primary)!important}
.hero-dashboard{background:radial-gradient(circle at 82% 18%,rgba(86,160,255,.14),transparent 25%),linear-gradient(125deg,#102746,#0c1a2d 58%,#091321)!important;border-color:rgba(86,160,255,.2)!important}.hero-contenido>p{color:#c7d7ea!important}.hero-meta span{border-color:rgba(86,160,255,.2)!important;background:rgba(4,10,18,.28)!important}.hero-panel-operativo,.accesos-dashboard,.dashboard-resumen,.recordatorios-dashboard{background:rgba(13,24,39,.9)!important;border-color:rgba(86,160,255,.14)!important}
.estado-movil-card,.tarjeta-inicio,.item,.ficha-movil,.material-compartimiento,.era-bloque,.era-item,.admin-item-inventario{background:linear-gradient(145deg,rgba(23,36,56,.96),rgba(14,24,39,.98))!important;border-color:rgba(86,160,255,.12)!important}.acceso-rapido{background:linear-gradient(145deg,rgba(29,43,64,.97),rgba(17,28,44,.98))!important;border-color:rgba(86,160,255,.13)!important}.acceso-rapido:hover{background:linear-gradient(145deg,rgba(25,118,255,.19),rgba(17,28,44,.98))!important;border-color:rgba(86,160,255,.55)!important}
#mecanica,#electrica,#era,#documentos,#novedades,#historialSeccion,#materialMenorB5,#administracionInventario{background:rgba(13,24,39,.9)!important;border-color:rgba(86,160,255,.14)!important}.item:has(input[type="checkbox"]:checked){border-color:rgba(32,200,117,.5)!important;box-shadow:inset 3px 0 0 var(--fo-green),0 8px 22px rgba(0,0,0,.2)!important}
.version-app.fireops-footer{width:min(calc(100% - 28px),980px)!important;margin:34px auto 8px!important;padding:16px 18px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;border:1px solid rgba(86,160,255,.12)!important;border-radius:16px!important;background:rgba(13,24,39,.72)!important;color:var(--fo-muted)!important}.fireops-footer img{width:45px;height:45px;object-fit:contain;border-radius:10px}.fireops-footer strong{color:var(--fo-text)}
@media(max-width:760px){.header-sellos img{width:39px;height:39px}.header-sellos{gap:5px}}@media(max-width:540px){.header-sellos{display:none}.login-instituciones img{width:46px;height:46px}}


/* =========================================================
   MEJORAS DE CONTRASTE · FIREOPS CONTROL v2.1
   ========================================================= */
.era-menu-boton strong{
  color:#ffffff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.45);
}
.era-menu-boton small{
  color:#eef5ff!important;
  opacity:1!important;
  text-shadow:0 1px 2px rgba(0,0,0,.38);
}
.era-menu-boton span{filter:drop-shadow(0 2px 3px rgba(0,0,0,.34))}

/* Módulos EPP y Generador */
#epp,#generador{
  width:min(calc(100% - 32px),980px);
  margin:28px auto;
  color:var(--fo-text,#fff);
}
.modulo-card{
  margin-bottom:16px;
  padding:24px;
  border:1px solid rgba(86,160,255,.14);
  border-radius:22px;
  background:rgba(13,24,39,.92);
  box-shadow:0 22px 55px rgba(0,0,0,.27);
}
.modulo-card h2{margin:5px 0 0}
.texto-ayuda{color:var(--fo-muted,#9dadc2);margin-top:0}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.form-actions{display:flex;gap:10px;margin-top:15px}
.form-actions button{width:auto!important}
.boton-peligro{
  background:linear-gradient(180deg,#f05b60,#c83238)!important;
  box-shadow:none!important;
}
.epp-metricas{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:9px;
  margin:16px 0;
}
.epp-metricas article{
  padding:14px 10px;
  text-align:center;
  border:1px solid rgba(86,160,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.045);
}
.epp-metricas strong{display:block;font-size:24px;color:#fff}
.epp-metricas span{display:block;margin-top:5px;color:#aebdd0;font-size:10px}
.epp-filtros{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:15px;
}
.epp-listado{display:grid;gap:10px}
.epp-item{
  display:grid;
  grid-template-columns:50px 1fr auto auto;
  gap:13px;
  align-items:center;
  padding:14px;
  border:1px solid rgba(86,160,255,.12);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(23,36,56,.96),rgba(14,24,39,.98));
}
.epp-item-icono{
  width:46px;height:46px;display:grid;place-items:center;
  border-radius:13px;background:rgba(25,118,255,.14);font-size:24px
}
.epp-item-titulo{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.epp-item-titulo span{
  padding:4px 8px;border-radius:999px;background:rgba(25,118,255,.14);
  color:#b9d6ff;font-size:10px;font-weight:800
}
.epp-item-info p{margin:5px 0 0;color:#dce7f5}
.epp-item-info small{display:block;margin-top:5px;color:#9dadc2}
.epp-item-cantidad{text-align:center;min-width:70px}
.epp-item-cantidad strong{display:block;font-size:23px}
.epp-item-cantidad span{font-size:9px;color:#9dadc2}
.epp-item-acciones{display:flex;gap:6px}
.epp-item-acciones button{width:auto!important;min-height:38px!important;padding:7px 10px!important}
.generador-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:15px;
}
.check-grid-generador{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:15px 0;
}
.check-card{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:13px;
  border:1px solid rgba(86,160,255,.12);
  border-radius:13px;
  background:rgba(255,255,255,.04);
  cursor:pointer;
}
.check-card:has(input:checked){
  border-color:rgba(32,200,117,.55);
  background:rgba(32,200,117,.1);
}
.check-card input{width:20px!important;min-height:20px!important;margin:2px 0 0!important}
.check-card strong,.check-card small{display:block}
.check-card small{margin-top:3px;color:#9dadc2;font-weight:500}
.badge-estado{
  padding:7px 10px;border-radius:999px;font-size:11px;font-weight:900;
  background:rgba(255,255,255,.08);color:#dce7f5
}
.badge-estado.vigente{background:rgba(32,200,117,.12);color:#77e6ac}
.badge-estado.proximo{background:rgba(243,182,31,.13);color:#ffd66f}
.badge-estado.vencido{background:rgba(229,72,77,.14);color:#ff8f93}
.badge-estado.pendiente{background:rgba(255,255,255,.08);color:#c5cfdb}
.tabs-generador{display:flex;gap:8px;margin-bottom:13px}
.tabs-generador button{
  width:auto!important;min-height:40px!important;padding:8px 14px!important;
  background:rgba(255,255,255,.06)!important;border:1px solid rgba(86,160,255,.12)!important;
  box-shadow:none!important
}
.tabs-generador button.activo{
  background:rgba(25,118,255,.2)!important;border-color:rgba(86,160,255,.5)!important
}
.generador-historial-item{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:14px;
  padding:13px;
  margin-bottom:8px;
  border:1px solid rgba(86,160,255,.11);
  border-radius:13px;
  background:rgba(255,255,255,.035);
}
.generador-historial-fecha strong,.generador-historial-fecha span{display:block}
.generador-historial-fecha span{margin-top:3px;color:#9dadc2;font-size:11px}
.generador-historial-item p{margin:5px 0 0;color:#dce7f5}
.generador-historial-item small{display:block;margin-top:5px;color:#9dadc2}

@media(max-width:760px){
  #epp,#generador{width:calc(100% - 20px);margin:14px auto}
  .modulo-card{padding:18px}
  .epp-metricas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .generador-grid{grid-template-columns:1fr}
  .check-grid-generador{grid-template-columns:1fr}
  .epp-item{grid-template-columns:44px 1fr auto}
  .epp-item-acciones{grid-column:1/-1;justify-content:flex-end}
}
@media(max-width:520px){
  .form-grid,.epp-filtros{grid-template-columns:1fr}
  .epp-metricas{grid-template-columns:1fr 1fr}
  .epp-item{grid-template-columns:1fr}
  .epp-item-icono{display:none}
  .epp-item-cantidad{text-align:left}
  .epp-item-acciones{justify-content:stretch}
  .epp-item-acciones button{flex:1}
  .generador-historial-item{grid-template-columns:1fr}
  .form-actions{flex-direction:column}
  .form-actions button{width:100%!important}
}


/* =========================================================
   CONTRASTE GLOBAL DE BOTONES · FIREOPS CONTROL v2.1.1
   ========================================================= */
button,
button strong,
button b{
  color:#ffffff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.55)!important;
}
button small,
.acceso-rapido small,
.era-menu-boton small,
.selector-material-grid button small,
.tarjeta-movil-info small{
  color:#f4f8ff!important;
  opacity:1!important;
  font-weight:650!important;
  text-shadow:0 1px 2px rgba(0,0,0,.58)!important;
}
button:not(.boton-peligro):not(.boton-secundario):not(.cerrar-menu):not(.menu-btn){
  border:1px solid rgba(255,255,255,.2)!important;
}
.era-menu-boton,
.selector-material-grid button,
.acceso-rapido,
.tarjeta-movil-info,
.boton-ingreso{
  background:linear-gradient(180deg,#327fe5,#155fc9)!important;
}
.era-menu-boton:hover,
.selector-material-grid button:hover,
.acceso-rapido:hover,
.tarjeta-movil-info:hover{
  background:linear-gradient(180deg,#438eee,#1b68d7)!important;
}

.epp-solo-lectura{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#b9c7d8;
  background:rgba(255,255,255,.045);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  white-space:nowrap;
}


/* =========================================================
   CORRECCIÓN MÓVIL INVENTARIO EPP · v2.1.4
   ========================================================= */
@media(max-width:480px){
  #botonAgregarEPP{
    display:block;
    width:100%!important;
    margin-top:10px;
  }
  #epp .seccion-cabecera{
    flex-direction:column;
    align-items:stretch;
  }
}