/* Estilos compartidos por las páginas auxiliares (login, setup, upload,
   usuarios). Reutiliza la paleta e identidad visual del dashboard principal
   (Barlow Semi Condensed + los azules/verde reales de Ipsos, extraídos de
   ipsos.com) para que se sientan parte de la misma aplicación. */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@400;500;600;700;800&display=swap');

:root{
  --ipsos:#121B5A;
  --primary:#2F469C;
  --primary-d:#273980;
  --primary-soft:#F0F2F8;
  --primary-line:#DADEED;
  --aqua:#14A19E;
  --ink:#121B5A;
  --ink2:#46545E;
  --muted:#71808A;
  --line:#DDE4E8;
  --bg:#F4F7F8;
  --ok:#1E8E5A;
  --bad:#C0392B;
  --warn:#9A6400;
}
*{box-sizing:border-box;}
body{
  margin:0;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--bg);
  font-family:'Barlow Semi Condensed',system-ui,sans-serif;
  color:var(--ink);
}
.card{
  width:100%;
  max-width:420px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:32px;
  box-shadow:0 8px 30px rgba(30,42,50,.08);
}
.card.wide{width:90%;max-width:1800px;}
h1{
  font-size:22px;
  font-weight:800;
  margin:0 0 4px;
  color:var(--ipsos);
}
p.sub{
  margin:0 0 24px;
  color:var(--muted);
  font-size:14px;
}
label{
  display:block;
  font-size:13px;
  font-weight:600;
  color:var(--ink2);
  margin:14px 0 6px;
}
input[type=text],input[type=password],input[type=file],select{
  width:100%;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  font-family:inherit;
  font-size:14px;
  background:#fff;
}
input:focus,select:focus{outline:2px solid var(--primary-line);border-color:var(--primary);}
.pw-wrap{position:relative;}
.pw-wrap input{padding-right:40px;}
.pw-toggle{
  position:absolute;
  top:50%;
  right:4px;
  transform:translateY(-50%);
  margin:0;
  width:32px;
  padding:0;
  border:0;
  background:none;
  color:var(--muted);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  cursor:pointer;
}
.pw-toggle:hover{background:var(--primary-soft);color:var(--primary);}
.pw-toggle:focus-visible{outline:2px solid var(--primary-line);outline-offset:1px;}
.pw-toggle svg{display:block;}
button,.btn{
  margin-top:20px;
  width:100%;
  padding:11px 16px;
  border:none;
  border-radius:8px;
  background:var(--primary);
  color:#fff;
  font-family:inherit;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  text-align:center;
  text-decoration:none;
  display:inline-block;
}
button:hover,.btn:hover{background:var(--primary-d);}
button.secondary,.btn.secondary{background:#fff;color:var(--primary);border:1px solid var(--primary-line);}
.msg{
  margin:0 0 16px;
  padding:10px 12px;
  border-radius:8px;
  font-size:13px;
}
.msg.bad{background:#FBEAE8;color:var(--bad);border:1px solid #F1C4BE;}
.msg.ok{background:#E7F5EE;color:var(--ok);border:1px solid #BFE3D0;}
.msg.warn{background:#FBF2E1;color:var(--warn);border:1px solid #F0DDAF;}
.msg.warn form{margin-top:4px;}
.msg.warn .btn.danger,.msg.warn button.danger{margin-top:0;width:auto;}
button.danger,.btn.danger{background:var(--bad);}
button.danger:hover,.btn.danger:hover{background:#a3301f;}
table{width:100%;border-collapse:collapse;margin-top:12px;font-size:13px;}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);}
th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em;}
.top-link{display:block;text-align:center;margin-top:14px;font-size:13px;color:var(--primary);text-decoration:none;}
.top-link:hover{text-decoration:underline;}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
}
.brand .logo{
  height:38px;width:auto;max-width:44px;object-fit:contain;display:block;
}
.badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  background:var(--primary-soft);
  color:var(--primary-d);
}
