/* Shared SUPMED palette; all admin state and layout behavior is retained. */
:root { --navy:#142f40; --navy-2:#20485d; --blue:#006c96; --blue-soft:#eaf3f7; --ink:#172e3d; --muted:#607581; --line:#dbe3e5; --bg:#f2f5f5; --shadow:0 15px 50px #1230400c; }
:focus-visible { outline:3px solid #168ab5; outline-offset:4px; }
.login-view { background:#f3f5f3; grid-template-columns:1fr 1fr; }
.login-brand { position:relative; margin:20px; border-radius:16px; padding:44px; background:linear-gradient(180deg,#102d4050,#102d40ed),url("assets/hero-instrumental.png") center/cover; }
.login-brand::after { content:"Precisión que inspira confianza."; color:#fff; position:absolute; left:44px; right:44px; bottom:120px; max-width:460px; font-size:clamp(2.5rem,4.5vw,4.8rem); line-height:1.08; letter-spacing:-.06em; }
.login-brand img { width:165px; }
.login-brand span { font-size:.65rem; letter-spacing:.18em; }
.login-card { max-width:410px; padding:50px 0; }
.login-card h1 { font-size:2.8rem; line-height:1.12; font-weight:500; letter-spacing:-.055em; margin:15px 0; }
.login-card > p { font-size:.9rem; margin-bottom:36px; }
.eyebrow { font-size:.65rem; font-weight:600; }
.form-stack { gap:22px; }
.form-stack label,.form-grid label { font-weight:500; font-size:.8rem; }
.form-stack input,.modal-body input,.modal-body select,.modal-body textarea,.toolbar input,.toolbar select { border-radius:6px; padding:14px; border-color:#cedade; }
.button { border-radius:6px; font-weight:600; padding:12px 18px; font-size:.82rem; }
.button.full { min-height:50px; }
.sidebar { padding:32px 17px; background:#142f40; }
.sidebar-brand { padding-bottom:44px; }
.sidebar-brand span { font-size:.6rem; color:#b2cbd7; }
.nav-item { padding:14px; border-radius:6px; font-size:.82rem; font-weight:500; }
.nav-item.active { background:#ffffff13; box-shadow:inset 3px 0 #69c7e5; }
.topbar { height:88px; }
.topbar h1 { font-size:1.3rem; font-weight:500; letter-spacing:-.035em; }
.topbar p { font-size:.6rem; }
.content { padding:34px; }
.welcome-card { background:#e3eef2; color:var(--ink); border:1px solid #d1e1e7; border-radius:12px; box-shadow:none; padding:38px; }
.welcome-card span { color:var(--blue); font-size:.62rem; }
.welcome-card h2 { font-size:2rem; font-weight:500; letter-spacing:-.05em; }
.welcome-card p { color:var(--muted); font-size:.85rem; }
.welcome-card .button { background:var(--blue); color:#fff; }
.metric-grid { margin:24px 0; gap:18px; }
.metric-card { padding:24px 20px; border-radius:10px; }
.metric-card strong { font-size:2.2rem; font-weight:500; letter-spacing:-.05em; margin:6px 0; }
.metric-icon { border-radius:8px; width:36px; height:36px; }
.surface { border-radius:10px; box-shadow:0 4px 20px #12304003; }
.surface-head { padding:24px; }
.surface-head h3,.page-actions h2 { font-weight:600; letter-spacing:-.025em; }
.data-table th { padding:15px 18px; font-weight:500; background:#f4f7f7; }
.data-table td { padding:18px; }
.pipeline-card { border-radius:8px; padding:18px; }
.pipeline-card.active { background:#eaf3f7; border-color:#6ea9c0; box-shadow:none; }
.modal-backdrop { backdrop-filter:blur(6px); }
.modal { border-radius:14px; }
.modal-head { padding:24px; }
.modal-head h2 { font-weight:500; }
@media(max-width:1050px) {
  .metric-card { padding:20px; }
  .welcome-card h2 { font-size:1.7rem; }
}
@media(max-width:760px) {
  .login-view { grid-template-columns:1fr; }
  .login-brand { margin:12px; min-height:240px; padding:25px; }
  .login-brand::after { bottom:25px; left:25px; right:25px; font-size:2.4rem; max-width:300px; }
  .login-brand img { width:130px; }
  .login-card { padding:30px 0 50px; }
  .login-card h1 { font-size:2.2rem; }
  .content { padding:20px; }
  .topbar { height:74px; }
  .welcome-card { padding:26px; }
}
@media(max-width:480px) {
  .content { padding:14px; }
  .welcome-card h2 { font-size:1.65rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; } }
