:root{
  --mpt:#06478f;         /* azul oficial */
  --mpt-500:#0b5fc0;     /* azul gradiente */
  --mpt-600:#053a76;     /* hover */
  --text:#222;
  --muted:#6b7280;
  --bg:#f5f7fb;

  /* header */
  --hd-bg:#0b468f;
  --hd-bg-2:#0d509f;
  --hd-bg-hover:#0f5bc0;
  --hd-shadow:0 1px 0 rgba(255,255,255,.06), 0 1px 8px rgba(0,0,0,.15);
  --ring: 0 0 0 3px rgba(21,93,185,.18);
}

/* Reset básico */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;
  color:var(--text);
  background:var(--bg);
}

/* ---------- Topbar legacy (si aún la usas en otras vistas) ---------- */
.topbar{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:12px 20px;background:var(--mpt);color:#fff
}
.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.3px}
.topbar nav{display:flex;align-items:center;gap:12px}
.topbar a{color:#fff;text-decoration:none}
.topbar a:hover{text-decoration:underline}

/* ---------- Layout contenedor ---------- */
.container{padding:20px;max-width:1100px;margin:0 auto}

/* ---------- Login simple (legacy) ---------- */
.login-bg{display:grid;place-items:center;min-height:100vh}
.login-card{
  background:#fff;padding:28px 24px;width:360px;border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.08)
}
.login-card h1{margin:0 0 10px;color:var(--mpt)}
.login-card small{font-weight:400;color:#666}
.login-card label{display:block;margin-top:12px;font-size:.9rem;color:#444}
.login-card input{
  width:100%;padding:10px;border:1px solid #ddd;border-radius:10px;outline:0
}
.login-card input:focus{border-color:var(--mpt);box-shadow:var(--ring)}
.login-card button{
  margin-top:16px;width:100%;padding:12px;background:var(--mpt);color:#fff;
  border:0;border-radius:10px;cursor:pointer;font-weight:700
}
.login-card button:hover{background:var(--mpt-600)}
.alert{
  background:#e8f2ff;border-left:4px solid var(--mpt);
  padding:8px 10px;border-radius:8px;margin:10px 0;font-size:.9rem;color:#155db9
}
.alert.error{background:#ffecec;border-left-color:#e04848;color:#a94442}

/* ---------- Badge contador ---------- */
.badge{
  display:inline-block; min-width:64px; text-align:center;
  padding:4px 10px; border-radius:999px;
  background:#e8f2ff; color:#155db9; font-weight:600;
  margin-right:8px; border:1px solid rgba(21,93,185,.15);
}
.badge.warn{   background:#fff3cd; color:#7a5a00; border-color:#ffe69c; }
.badge.danger{ background:#ffe5e5; color:#842029; border-color:#f5c2c7; }

/* ---------- Progreso de sesión (opcional) ---------- */
.session-progress{height:4px;background:transparent}
.session-progress #sessBar{
  height:4px;width:0;background:#32c28f;
  transition:width .25s linear, background-color .25s linear;
  border-radius:0 4px 4px 0;
}
#sessBar.warn{background:#f2a100!important}
#sessBar.danger{background:#d72f2f!important}

/* ---------- Home corporativo ---------- */
.hero{
  background:linear-gradient(180deg,#f8fbff 0,#f1f5ff 100%);
  border:1px solid #e6eaf2;border-radius:16px;padding:18px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:12px
}
.hero h2{margin:.2rem 0 .2rem 0}
.hero p{margin:0;color:var(--muted)}
.pill{
  display:inline-block;padding:6px 10px;border-radius:999px;
  background:#f0f6ff;color:#155db9;border:1px solid #d9e8ff;font-size:12px
}

.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.card{
  background:#fff;border:1px solid #e6eaf2;border-radius:14px;padding:16px;
  box-shadow:0 1px 2px rgba(16,24,40,.03)
}
.card h3{margin:.3rem 0}
.muted{color:var(--muted)}

@media (max-width:1000px){
  .grid{grid-template-columns:1fr}
}

/* ===== RH360 – Login 2025 ===== */
.login-2025{ background:#f5f7fb; margin:0; min-height:100vh; }
.login-2025__shell{ min-height:100vh; display:grid; grid-template-columns: 1.05fr 1fr; }

/* Lado marca */
.login-2025__brand{
  color:#fff;
  background: linear-gradient(160deg, var(--mpt) 0%, var(--mpt-500) 100%);
  padding:48px 56px;
  display:flex; flex-direction:column; justify-content:space-between;
}
.login-2025__brand-top{ display:flex; align-items:center; gap:14px; }
.login-2025__logo{ width:150px; height:150px; object-fit:contain }
.login-2025__logo--sm{ width:160px; height:160px; object-fit:contain }
.login-2025__title{ font-weight:800; letter-spacing:.5px; font-size:20px; line-height:1.1 }
.login-2025__subtitle{ opacity:.9; font-size:13px; letter-spacing:.2px }
.login-2025__brand-mid h1{ margin:.2rem 0 .6rem 0; font-size:34px; font-weight:800; letter-spacing:.5px }
.login-2025__brand-mid p{ margin:.2rem 0 1rem 0; opacity:.95 }
.login-2025__chips{ display:flex; flex-wrap:wrap; gap:8px }
.chip{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background:#eaf3ff; color:#0a2b57; border:1px solid rgba(255,255,255,.35);
  font-size:12px
}
.login-2025__brand-foot{ opacity:.9; font-size:12px }

/* Lado formulario */
.login-2025__form-pane{ display:flex; align-items:center; justify-content:center; padding:56px }
.login-2025__card{
  background:#fff; width:100%; max-width:560px;
  border-radius:22px; padding:44px 40px;
  box-shadow:0 20px 60px rgba(0,0,0,.12); border:1px solid #e8eef7;
}
.login-2025__card-head{ text-align:center; margin-bottom:8px }
.login-2025__card-head h2{ margin:8px 0 2px 0; color:#155db9; font-size:26px }
.login-2025__card-head small{ color:#6b7280 }

/* Campos */
.fld-label{ display:block; margin-top:12px; font-size:14px; font-weight:600; color:#374151 }
.fld input{
  width:100%; padding:14px 14px;
  border:1px solid #d7dbe3; border-radius:10px; outline:0;
  transition:border-color .2s, box-shadow .2s; background:#fff;
  font-size:16px;
}
.fld input:focus{ border-color:#155db9; box-shadow:var(--ring) }

/* Ayudas y botones */
.helper-row{ display:flex; justify-content:space-between; align-items:center; margin-top:6px }
.muted{ color:#6b7280; text-decoration:none }
.muted:hover{ text-decoration:underline }

.btn{
  width:100%; margin-top:16px; padding:14px; border:0; border-radius:10px;
  cursor:pointer; font-weight:700; font-size:16px;
}
.btn-primary{ background:#155db9; color:#fff }
.btn-primary:hover{ background:#0f4b98 }

/* Etiquetas */
.tag{ display:inline-block; padding:7px 12px; border-radius:999px; font-size:13px; margin-top:10px }
.tag-info{ background:#e8f2ff; color:#155db9; border:1px solid rgba(21,93,185,.2) }
.tag-ok{ background:#eafaf0; color:#0f6b3d; border:1px solid rgba(16,107,61,.2) }

.disclaimer{ color:#6b7280; font-size:12px; text-align:center; margin:10px 0 0 }

/* Responsive login */
@media (max-width: 992px){
  .login-2025__shell{ grid-template-columns: 1fr }
  .login-2025__brand{ padding:32px }
  .login-2025__form-pane{ padding:22px }
  .login-2025__card{ padding:26px 22px; max-width: 100% }
}

/* ======= RH Header – corporativo ======= */
.rh-header { position: sticky; top: 0; z-index: 1000; }
.rh-bar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:10px 16px; background:var(--hd-bg); color:#fff; box-shadow: var(--hd-shadow);
}
.rh-brand{
  display:flex; align-items:center; gap:8px; text-decoration:none;
  background:var(--hd-bg-2); padding:6px 10px; border-radius:999px; color:#fff;
  transition:background .15s ease, box-shadow .15s ease;
}
.rh-brand:hover{ background:var(--hd-bg-hover) }
.rh-brand:focus{ outline:2px solid #fff; outline-offset:2px; }
.rh-logo{ font-weight:800; letter-spacing:.5px; }
.rh-logo-img{ display:block }
.rh-sep{ opacity:.5 }
.rh-org{ font-weight:600; opacity:.9 }

/* Menú principal */
.rh-nav{
  display:flex; align-items:center; gap:8px;
}
.rh-link{
  color:#fff; text-decoration:none; padding:8px 10px; border-radius:8px;
  transition:background .15s ease, color .15s ease;
}
.rh-link:hover{ background:var(--hd-bg-hover); color:#fff; }
.rh-link:focus{ outline:2px solid #fff; outline-offset:2px; }

/* Dropdown */
.rh-dd{ position:relative }
.rh-dd__btn{
  display:flex; align-items:center; gap:6px; background:var(--hd-bg-2); color:#fff;
  border:0; border-radius:10px; padding:8px 12px; cursor:pointer; font-weight:600;
  transition:background .15s ease;
}
.rh-dd__btn:hover{ background:var(--hd-bg-hover) }
.rh-dd__btn:focus{ outline:2px solid #fff; outline-offset:2px }
.rh-dd__btn svg{ width:14px; height:14px; fill:#fff; opacity:.85 }

.rh-dd__menu{
  position:absolute; top:calc(100% + 8px); left:0; min-width:220px; background:#fff;
  border-radius:12px; padding:8px; box-shadow: 0 8px 24px rgba(0,0,0,.15); display:none;
}
.rh-dd[data-open] .rh-dd__menu{ display:block }
.rh-dd__item{
  display:block; padding:10px 12px; border-radius:8px; color:#062a54; text-decoration:none; font-weight:500;
}
.rh-dd__item:hover{ background:#e9f0ff; color:#0b468f }
.rh-dd__item:focus{ outline:2px solid #0b468f; outline-offset:2px }

/* Lado derecho */
.rh-right{ display:flex; align-items:center; gap:12px; color:#fff }
.rh-user{ opacity:.95; font-weight:600 }
.rh-logout{ background:transparent; }
.rh-logout:hover{ background:var(--hd-bg-hover) }

/* Pill contador */
.rh-pill{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:56px; height:28px; padding:0 10px; border-radius:999px;
  background:var(--hd-bg-hover); color:#fff; font-weight:700;
}
.rh-pill.warn{ background:#f2a100; color:#fff }
.rh-pill.danger{ background:#d72f2f }

/* Burger (móvil) */
.rh-burger{
  display:none; background:transparent; border:0; padding:6px 4px; border-radius:8px; cursor:pointer;
}
.rh-burger:focus{ outline:2px solid #fff; outline-offset:2px }
.rh-burger-bar{ display:block; width:22px; height:2px; background:#fff; margin:4px 0; border-radius:2px }

/* Responsive header */
@media (max-width: 992px){
  .rh-burger{ display:block }
  .rh-nav{
    position:absolute; left:0; right:0; top:100%;
    background:var(--hd-bg); display:none; flex-direction:column; gap:4px;
    padding:8px; border-bottom:1px solid rgba(255,255,255,.08);
  }
  .rh-nav[data-open]{ display:flex }
  .rh-dd{ width:100% }
  .rh-dd__menu{ position:static; box-shadow:none; border:1px solid rgba(0,0,0,.06) }
  .rh-dd__btn, .rh-link{ width:100%; text-align:left }
  .rh-right{ display:none } /* si quieres, ocúltalo en móvil; o muévelo abajo */
}

/* Enfoques visibles solo al usar teclado */
.kbd .rh-link:focus,
.kbd .rh-brand:focus,
.kbd .rh-dd__btn:focus{ box-shadow: 0 0 0 3px rgba(255,255,255,.35) }

/* Preferencia de reducir animaciones */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ===== Footer ===== */
.site-footer{
  border-top:1px solid #e6eaf2;
  background:#f7f9fd;
  color:#4b5563;
  margin-top:24px;
}
.site-footer .footer-inner{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 20px;
  font-size:.9rem;
}
@media (max-width: 768px){
  .site-footer .footer-inner{ flex-direction:column; gap:6px; }
}

/* ===== Layout sticky footer ===== */
html, body {
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
}

main.container {
  flex: 1 0 auto;           /* ocupa el espacio disponible */
}

.site-footer {
  flex-shrink: 0;
}
