:root{
  --nv:#0d9488; --nv-d:#0f766e; --nv-dk:#134e4a;
}
/* Tema por rol */
body.role-admin       { --nv:#4338ca; --nv-d:#3730a3; --nv-dk:#312e81; }  /* índigo */
body.role-portero     { --nv:#ea580c; --nv-d:#c2410c; --nv-dk:#9a3412; }  /* naranja */
body.role-propietario { --nv:#0d9488; --nv-d:#0f766e; --nv-dk:#134e4a; }  /* teal */
body{ background:#f1f5f9; -webkit-tap-highlight-color:transparent; font-family:'Inter', system-ui, -apple-system, sans-serif; }
.nv-nav{ background:linear-gradient(90deg,var(--nv-dk),var(--nv)); }
.nv-rolbadge{ background:rgba(255,255,255,.18); }
.nv-btn{ background:var(--nv); border-color:var(--nv); color:#fff; }
.nv-btn:hover,.nv-btn:focus{ background:var(--nv-d); border-color:var(--nv-d); color:#fff; }
.nv-logo{ width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,var(--nv),var(--nv-dk));
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:30px;box-shadow:0 8px 24px rgba(13,148,136,.35); }

/* Tarjetas de menú grandes (mobile) */
.nv-tile{ display:flex;align-items:center;gap:14px;padding:18px;border-radius:16px;background:#fff;
  border:1px solid #e2e8f0;text-decoration:none;color:#0f172a;box-shadow:0 1px 2px rgba(0,0,0,.04); }
.nv-tile:active{ transform:scale(.99); }
.nv-tile i{ font-size:26px;color:var(--nv); }
.nv-tile .t{ font-weight:600; }
.nv-tile .s{ font-size:.8rem;color:#64748b; }

/* Botones grandes Entrada/Salida */
.mov-btn{ border:3px solid transparent;border-radius:18px;padding:22px;font-size:1.3rem;font-weight:700;width:100%; }
.mov-in{ background:#ecfdf5;color:#065f46;border-color:#10b981; }
.mov-out{ background:#fff7ed;color:#9a3412;border-color:#f59e0b; }
.mov-btn.sel{ box-shadow:0 0 0 4px rgba(13,148,136,.18); }

/* Scanner */
#scanWrap{ position:relative;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:3/4;max-height:60vh; }
#scanVideo{ width:100%;height:100%;object-fit:cover; }
#scanFrame{ position:absolute;inset:12% 8%;border:3px solid rgba(255,255,255,.85);border-radius:14px;
  box-shadow:0 0 0 2000px rgba(0,0,0,.25); }
.scan-hint{ position:absolute;bottom:10px;left:0;right:0;text-align:center;color:#fff;font-size:.85rem;text-shadow:0 1px 3px #000; }

/* Resultado */
.res-card{ border-radius:18px;padding:26px 18px;text-align:center; }
.res-ok{ background:#dcfce7;color:#14532d;border:2px solid #22c55e; }
.res-no{ background:#fee2e2;color:#7f1d1d;border:2px solid #ef4444; }
.res-card .ico{ font-size:54px;line-height:1; }
.res-card .big{ font-size:1.5rem;font-weight:800; }

.list-cedula{ font-variant-numeric:tabular-nums; }

/* Marca elegante */
.navbar-brand{ font-family:'Playfair Display', Georgia, serif; letter-spacing:.2px; }

/* ── Login con foto de portada + glass ── */
.login-page{ font-family:'Inter', system-ui, sans-serif; }
.login-wrap{ position:relative; min-height:100vh; min-height:100svh; display:flex; flex-direction:column;
  align-items:center; justify-content:center; padding:28px 16px; overflow:hidden; background:#0b1f1c; }
.login-bg{ position:absolute; inset:0; background:url('/assets/img/portada.jpg') center/cover no-repeat;
  transform:scale(1.06); animation:loginZoom 18s ease-in-out infinite alternate; }
.login-bg::after{ content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,30,27,.45) 0%, rgba(8,30,27,.74) 55%, rgba(8,30,27,.92) 100%); }
@keyframes loginZoom{ from{ transform:scale(1.06);} to{ transform:scale(1.16);} }
@media (prefers-reduced-motion: reduce){ .login-bg{ animation:none; } }
.login-card{ position:relative; z-index:2; width:100%; max-width:400px; border-radius:24px; padding:30px 26px 28px;
  background:rgba(255,255,255,.93); -webkit-backdrop-filter:blur(14px) saturate(140%); backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 24px 60px rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.6); }
.login-badge{ width:66px; height:66px; border-radius:20px; margin:0 auto 14px; display:flex; align-items:center;
  justify-content:center; font-size:30px; color:#fff; background:linear-gradient(135deg,#0d9488,#134e4a);
  box-shadow:0 10px 26px rgba(13,148,136,.45); }
.login-title{ font-family:'Playfair Display', Georgia, serif; font-weight:700; font-size:1.95rem; color:#0f172a; line-height:1.1; }
.login-sub{ color:#475569; font-size:.88rem; }
.login-card .input-group-text{ border-right:0; }
.login-foot{ position:relative; z-index:2; margin-top:22px; color:rgba(255,255,255,.85); font-size:.8rem;
  text-shadow:0 1px 3px rgba(0,0,0,.5); }