/* H&H UI 2026.08 — contrato responsive común para las cuatro plataformas. */
html{overflow-x:hidden}
body.hhAdaptiveUI{min-width:0;overflow-x:clip}
body.hhAdaptiveUI :where(main,.view){padding-top:clamp(16px,2vw,28px)}
body.hhAdaptiveUI :where(.pageHero,.viewHead,.metricStrip,.kpiGrid,.miniKpis,.areaMetrics){margin-bottom:clamp(10px,1.2vw,16px)}

body.hhAdaptiveUI .hhTableViewport{
  position:relative;
  width:100%;
  max-width:100%;
  overflow:auto;
  overscroll-behavior-inline:contain;
  scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
  border-inline:0;
}
body.hhAdaptiveUI .hhTableViewport:focus-visible{outline:3px solid rgba(165,43,46,.28);outline-offset:-3px}
body.hhAdaptiveUI .hhTableViewport::-webkit-scrollbar{width:9px;height:9px}
body.hhAdaptiveUI .hhTableViewport::-webkit-scrollbar-track{background:#efedea}
body.hhAdaptiveUI .hhTableViewport::-webkit-scrollbar-thumb{background:#a8a5a2;border:2px solid #efedea;border-radius:999px}
body.hhAdaptiveUI .hhTableViewport.hhHasOverflow{box-shadow:inset -10px 0 12px -14px rgba(25,31,40,.75)}
body.hhAdaptiveUI .hhTableScrollable{max-height:min(64vh,680px)}

body.hhAdaptiveUI table.hhAdaptiveTable{
  width:100%!important;
  min-width:max(100%,var(--hh-table-min,100%))!important;
  table-layout:auto!important;
  border-collapse:collapse;
  font-variant-numeric:tabular-nums;
}
body.hhAdaptiveUI table.hhAdaptiveTable.hhTablePreserveLayout{table-layout:fixed!important}
body.hhAdaptiveUI table.hhAdaptiveTable thead{position:sticky;top:0;z-index:3}
body.hhAdaptiveUI table.hhAdaptiveTable th{
  min-width:var(--hh-column-min,auto);
  padding:clamp(7px,.62vw,10px) clamp(7px,.7vw,11px)!important;
  vertical-align:middle;
  line-height:1.2!important;
  white-space:normal!important;
  overflow-wrap:break-word;
}
body.hhAdaptiveUI table.hhAdaptiveTable td{
  height:auto!important;
  padding:clamp(7px,.62vw,10px) clamp(7px,.7vw,11px)!important;
  line-height:1.3!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:anywhere;
  text-overflow:clip!important;
}
body.hhAdaptiveUI table.hhAdaptiveTable :where(input,select,textarea){
  box-sizing:border-box;
  width:100%;
  min-width:0!important;
  max-width:100%;
}
body.hhAdaptiveUI table.hhAdaptiveTable :where(.hhColumn-numeric,.hhColumn-status,.hhColumn-control){white-space:nowrap!important}
body.hhAdaptiveUI table.hhAdaptiveTable td.hhColumn-numeric{text-align:right}
body.hhAdaptiveUI table.hhAdaptiveTable th.hhColumn-numeric{text-align:right}
body.hhAdaptiveUI table.hhAdaptiveTable.hhTableDense th{font-size:clamp(7.25px,.55vw,8.5px)!important}
body.hhAdaptiveUI table.hhAdaptiveTable.hhTableDense td{font-size:clamp(8.5px,.66vw,10px)!important}
body.hhAdaptiveUI table.hhAdaptiveTable.hhTableDense td :where(small,.sourceHint,.inputSource){font-size:clamp(7px,.52vw,8px)!important}

@media (min-width:901px){
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide th:first-child,
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide td:first-child{
    position:sticky;
    left:0;
    z-index:2;
    box-shadow:1px 0 #d8d3ce;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide th:first-child{z-index:5}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tbody tr:nth-child(odd) td:first-child{background:#fff}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tbody tr:nth-child(even) td:first-child{background:#faf9f7}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tr.riskRow td:first-child{background:#fff4f4}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tr.watchRowV72 td:first-child{background:#fffaf0}
}

@media (max-width:1100px){
  body.hhAdaptiveUI :where(main,.view){padding-inline:clamp(12px,2.1vw,22px)!important}
  body.hhAdaptiveUI table.hhAdaptiveTable th{padding:7px 8px!important}
  body.hhAdaptiveUI table.hhAdaptiveTable td{padding:7px 8px!important}
}

@media (max-width:700px){
  body.hhAdaptiveUI .hhTableScrollable{max-height:none}
  body.hhAdaptiveUI table.hhAdaptiveTable:not(.hhTableStackable){min-width:var(--hh-table-min,680px)!important}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide th:first-child,
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide td:first-child{
    position:sticky;
    left:0;
    z-index:2;
    box-shadow:1px 0 #d8d3ce;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide th:first-child{z-index:5}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tbody tr:nth-child(odd) td:first-child{background:#fff}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableWide tbody tr:nth-child(even) td:first-child{background:#faf9f7}

  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable{
    display:block;
    min-width:100%!important;
    border:0!important;
    background:transparent!important;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable thead{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable tbody,
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable tr,
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable td{display:block;width:100%}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable tr{
    margin:0 0 12px;
    border:1px solid #d8d3ce;
    border-top:4px solid #303946;
    background:#fff;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable td{
    display:grid!important;
    grid-template-columns:minmax(104px,36%) minmax(0,1fr);
    gap:12px;
    align-items:start;
    min-height:42px;
    border:0!important;
    border-bottom:1px solid #ebe7e3!important;
    background:#fff!important;
    text-align:left!important;
    white-space:normal!important;
  }
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable td:last-child{border-bottom:0!important}
  body.hhAdaptiveUI table.hhAdaptiveTable.hhTableStackable td::before{
    content:attr(data-label);
    color:#6d6865;
    font-size:8px;
    font-weight:900;
    letter-spacing:.06em;
    line-height:1.3;
    text-transform:uppercase;
  }
}

/* Acceso institucional: mismo tamaño, retícula y jerarquía en las cuatro aplicaciones. */
body .hhLoginGate{
  position:fixed!important;
  inset:0!important;
  z-index:1000!important;
  display:grid!important;
  place-items:center!important;
  overflow:auto!important;
  padding:clamp(16px,4vw,36px)!important;
  background-color:#eeece9!important;
  background-image:linear-gradient(rgba(255,255,255,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.7) 1px,transparent 1px)!important;
  background-size:28px 28px!important;
}
body .hhLoginCard{
  display:block!important;
  width:min(470px,100%)!important;
  min-height:0!important;
  max-height:none!important;
  margin:auto!important;
  padding:clamp(26px,4vw,36px)!important;
  overflow:visible!important;
  border:1px solid #d8d2cd!important;
  border-top:8px solid #a52a2a!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:0 30px 90px rgba(65,27,35,.24)!important;
  color:#27303c!important;
}
body .hhLoginCard .loginBrand{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  min-height:0!important;
  margin:0 0 22px!important;
  padding:0 0 20px!important;
  border:0!important;
  border-bottom:1px solid #d8d2cd!important;
  background:transparent!important;
}
body .hhLoginCard .loginBrand .wordmark{
  display:block!important;
  margin:0!important;
  color:#27303c!important;
  font-size:38px!important;
  font-weight:950!important;
  letter-spacing:-3px!important;
  line-height:1!important;
}
body .hhLoginCard .loginBrand b,
body .hhLoginCard .loginBrand span{display:block!important;margin:0!important}
body .hhLoginCard .loginBrand b{color:#27303c!important;font-size:11px!important;letter-spacing:1.5px!important}
body .hhLoginCard .loginBrand span{margin-top:4px!important;color:#756f6d!important;font-size:8px!important;letter-spacing:.04em!important;text-transform:uppercase!important}
body .hhLoginCard>.eyebrow{
  display:block!important;
  margin:0!important;
  color:#a52a2a!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
body .hhLoginCard>h1{
  margin:5px 0 8px!important;
  color:#27303c!important;
  font-size:28px!important;
  font-weight:850!important;
  letter-spacing:-.04em!important;
  line-height:1.15!important;
  text-transform:none!important;
}
body .hhLoginCard>p:not(.eyebrow){margin:0!important;color:#756f6d!important;font-size:11px!important;line-height:1.55!important}
body .hhLoginCard form{display:grid!important;gap:0!important;margin:0!important}
body .hhLoginCard .hhLoginField,
body .hhLoginCard form>label{
  display:grid!important;
  gap:5px!important;
  margin:13px 0 0!important;
  color:#6e6967!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
body .hhLoginCard form input{
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 12px!important;
  border:1px solid #aaa5a1!important;
  border-radius:0!important;
  background:#fffdf1!important;
  color:#27303c!important;
  font-size:14px!important;
  box-shadow:none!important;
}
body .hhLoginCard form input:focus{outline:2px solid #27303c!important;outline-offset:-2px!important;border-color:#27303c!important}
body .hhLoginCard form button[type="submit"]{
  width:100%!important;
  min-height:44px!important;
  margin:18px 0 0!important;
  padding:10px 14px!important;
  border:1px solid #a52a2a!important;
  border-radius:2px!important;
  background:#a52a2a!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
}
body .hhLoginCard .forgotPasswordLink{
  justify-self:center!important;
  width:auto!important;
  min-height:0!important;
  margin:9px auto 0!important;
  padding:3px 0!important;
  border:0!important;
  background:transparent!important;
  color:#6e6967!important;
  font-size:8px!important;
  font-weight:800!important;
  text-decoration:underline!important;
  text-transform:none!important;
}
body .hhLoginCard :where(.loginError,#loginError){display:block!important;min-height:14px!important;margin:9px 0 0!important;color:#9c2d30!important;font-size:9px!important}
body .hhLoginCard .hhAccessNote{
  display:block!important;
  margin:18px 0 0!important;
  padding:10px 12px!important;
  border:0!important;
  border-left:4px solid #629952!important;
  background:#f1f8f2!important;
  color:#416649!important;
  font-size:8px!important;
  line-height:1.45!important;
}

@media (max-width:520px){
  body .hhLoginGate{place-items:start center!important;padding:12px!important}
  body .hhLoginCard{width:100%!important;margin:auto!important;padding:24px 20px!important}
  body .hhLoginCard .loginBrand{margin-bottom:18px!important;padding-bottom:16px!important}
  body .hhLoginCard>h1{font-size:25px!important}
}

@media (max-height:670px) and (min-width:521px){
  body .hhLoginGate{place-items:start center!important;padding-block:14px!important}
  body .hhLoginCard{padding-block:24px!important}
  body .hhLoginCard .loginBrand{margin-bottom:15px!important;padding-bottom:14px!important}
  body .hhLoginCard .hhLoginField,body .hhLoginCard form>label{margin-top:9px!important}
  body .hhLoginCard form button[type="submit"]{margin-top:13px!important}
  body .hhLoginCard .hhAccessNote{margin-top:12px!important}
}