/* Cámaras para Medios — estilos propios (sobre Bootstrap 5) */
body { background: #f2f4f7; }
.login-box { max-width: 380px; margin: 10vh auto 0; }

/* Grilla de cámaras */
.cam-card { overflow: hidden; }
.cam-video { position: relative; background: #000; aspect-ratio: 16 / 9; }
.cam-video video { width: 100%; height: 100%; object-fit: contain; display: block; }
.cam-estado {
  position: absolute; top: 8px; left: 8px; font-size: .75rem; padding: 2px 8px;
  border-radius: 10px; background: rgba(0,0,0,.6); color: #fff;
}
.cam-estado.ok::before { content: "● "; color: #ff3b30; }
.cam-estado.warn { background: rgba(200,120,0,.8); }
.cam-estado.error { background: rgba(180,0,0,.85); }
.cam-marca {
  position: absolute; bottom: 6px; right: 10px; font-size: .7rem; color: rgba(255,255,255,.7);
  text-shadow: 0 0 3px #000; pointer-events: none;
}

/* Matriz de permisos */
.matriz th.rot { white-space: nowrap; }
.matriz td, .matriz th { vertical-align: middle; }
.matriz .celda { text-align: center; }
.matriz .vence { display: block; font-size: .65rem; color: #b45309; }

code.link { word-break: break-all; font-size: .8rem; }