/* ============================================================================= RRHH EN EL TELÉFONO — etapa 3m del teléfono docs/movil/lamina-15-personas-rrhh.html: ganó la B (08/10/2026), «el Turno de hoy primero», con la línea del día de la PC. La pantalla la arma ENTERA `rrhh-movil.js`. Scope por id `#mobile-data-container #rhm-ui`. Las piezas comunes son las del Semanal del teléfono con otro prefijo. La línea del día trae su CSS de la PC (`rrhh-ui.css`, scope `.rrhh-ui`); acá sólo se la ajusta al ancho. [ Hoy | Días | Novedades ] Faltan 3 · 22 de 25 que ya debían estar… el veredicto de la PC El día, por sector 05 · · 08 · · 11 · · 14 … la línea del día Por sector · Faltan, sin novedad (→ hoja) · Con novedad · La semana ========================================================================== */ @media (max-width: 767px) { #mobile-data-container #rhm-ui { display: flex; flex-direction: column; min-height: 100%; background: var(--canvas); color: var(--ink); font-size: 14px; line-height: 1.45; } #mobile-data-container #rhm-ui .rhm-zona { flex: 1; padding-bottom: 18px; } /* ── La píldora (el indicador que viaja lo pone mobile-gestos.js) ──── */ #mobile-data-container #rhm-ui .rhm-seg { position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(4, 1fr); margin: 8px 12px 0; padding: 3px; border-radius: 11px; background: #e3e7ef; } #mobile-data-container #rhm-ui .rhm-seg[hidden] { display: none; } #mobile-data-container #rhm-ui .rhm-seg > button { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 38px; border: 0; border-radius: 8px; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); transition: color .24s; } #mobile-data-container #rhm-ui .rhm-seg > button.on { color: var(--navy); } #mobile-data-container #rhm-ui .rhm-seg:not(.mv-con-ind) > button.on { background: #fff; box-shadow: var(--e1); } #mobile-data-container #rhm-ui .rhm-seg > button:focus-visible { outline: 2px solid var(--navy-300); outline-offset: -2px; } /* ── Rótulos, listas, vacíos ───────────────────────────────────────── */ #mobile-data-container #rhm-ui .rhm-hh { display: flex; align-items: center; gap: 8px; padding: 14px 16px 6px; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); font-weight: 700; } #mobile-data-container #rhm-ui .rhm-hh .der { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; } #mobile-data-container #rhm-ui .rhm-lista { margin: 0 12px 4px; background: #fff; border: 1px solid var(--hair); border-radius: 14px; box-shadow: var(--e1); overflow: hidden; } #mobile-data-container #rhm-ui .rhm-vacio { margin: 14px 12px; padding: 22px 18px; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.45; background: #fff; border: 1px solid var(--hair); border-radius: 14px; display: flex; flex-direction: column; align-items: center; gap: 4px; } #mobile-data-container #rhm-ui .rhm-vacio > .material-symbols-outlined { font-size: 30px; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-vacio b { color: var(--ink); font-size: 14.5px; } #mobile-data-container #rhm-ui .rhm-vacio.mal { color: var(--crit); } /* el vacío «chico» (lámina 22): un renglón, no una caja */ #mobile-data-container #rhm-ui .rhm-vacio.chico { margin: 0; border: 0; border-radius: 0; padding: 10px 12px; flex-direction: row; justify-content: flex-start; gap: 8px; text-align: left; font-size: 12.5px; } #mobile-data-container #rhm-ui .rhm-vacio.chico > .material-symbols-outlined { font-size: 17px; } #mobile-data-container #rhm-ui .rhm-nota { margin: 10px 16px 0; font-size: 12px; color: var(--muted); line-height: 1.45; } /* ── Los renglones ─────────────────────────────────────────────────── */ #mobile-data-container #rhm-ui .rhm-r { display: grid; gap: 2px 10px; padding: 10px 12px; border-bottom: 1px solid var(--hair); cursor: pointer; transition: background .12s ease, transform .12s ease; animation: rhmEntra .3s cubic-bezier(.2, .8, .2, 1) both; } #mobile-data-container #rhm-ui .rhm-r:last-child { border-bottom: 0; } #mobile-data-container #rhm-ui .rhm-r:active, #mobile-data-container #rhm-ui .rhm-r.rhm-toc { background: var(--navy-050); transform: scale(.985); } /* ── El pie: pegado abajo ──────────────────────────────────────────── */ #mobile-data-container #rhm-ui .rhm-pie { position: sticky; bottom: 0; z-index: 5; display: flex; gap: 10px; align-items: center; padding: 10px 12px 14px; background: var(--surface); border-top: 1px solid var(--hair); box-shadow: 0 -4px 14px rgba(16, 32, 64, .05); } #mobile-data-container #rhm-ui .rhm-pie[hidden] { display: none; } /* ── Las piezas comunes: las del Pase de Depósito, con otro prefijo ── */ #mobile-data-container #rhm-ui .rhm-btn { min-height: 44px; padding: 0 18px; border-radius: 11px; border: 1px solid var(--navy); background: var(--navy); color: #fff; font: inherit; font-weight: 600; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; transition: transform .12s ease, background .12s ease; } #mobile-data-container #rhm-ui .rhm-btn:active { transform: scale(.96); background: var(--navy-700); } #mobile-data-container #rhm-ui .rhm-btn[disabled] { opacity: .45; pointer-events: none; } #mobile-data-container #rhm-ui .rhm-btn.sec { background: #fff; color: var(--ink); border-color: var(--hair-strong); } #mobile-data-container #rhm-ui .rhm-btn .material-symbols-outlined { font-size: 18px; } #mobile-data-container #rhm-ui .rhm-btn .gs-spin { width: 14px; height: 14px; } /* ── Las consecuencias ─────────────────────────────────────────────── */ #mobile-data-container #rhm-ui .rhm-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 600; line-height: 1.4; padding: 2px 8px; border-radius: 9px; border: 1px solid var(--hair-strong); background: #fff; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-chip .material-symbols-outlined { font-size: 14px; } #mobile-data-container #rhm-ui .rhm-chip.ok { color: var(--ok); background: var(--ok-050); border-color: var(--ok-hair); } #mobile-data-container #rhm-ui .rhm-chip.warn { color: var(--warn); background: var(--warn-050); border-color: var(--warn-hair); } #mobile-data-container #rhm-ui .rhm-chip.mal { color: var(--crit); background: var(--crit-050); border-color: var(--crit-hair); } /* ── El velo y las hojas ───────────────────────────────────────────── */ #mobile-data-container #rhm-ui .rhm-velo { position: fixed; inset: 0; z-index: 184; background: rgba(10, 20, 40, .38); opacity: 0; pointer-events: none; transition: opacity .25s ease; } #mobile-data-container #rhm-ui.rhm-con-hoja .rhm-velo { opacity: 1; pointer-events: auto; } #mobile-data-container #rhm-ui .rhm-hoja[hidden] { display: none; } #mobile-data-container #rhm-ui .rhm-hoja { position: fixed; left: 0; right: 0; bottom: 0; z-index: 185; max-height: 88vh; display: flex; flex-direction: column; background: var(--surface); border-radius: 20px 20px 0 0; box-shadow: 0 -10px 30px rgba(16, 32, 64, .18); animation: mvHojaSube .28s cubic-bezier(.2, .8, .2, 1) both; will-change: transform; } #mobile-data-container #rhm-ui .rhm-hoja .asa { flex: none; align-self: center; width: 40px; height: 5px; margin: 8px 0 4px; border-radius: 9px; background: var(--hair-strong); } #mobile-data-container #rhm-ui .rhm-hoja .h-cab { padding: 4px 18px 10px; border-bottom: 1px solid var(--hair); flex: none; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .lb { font-size: 12px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-hoja .h-cab h4 { margin: 2px 0 2px; font-size: 18px; line-height: 1.25; font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .sub { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .sub .material-symbols-outlined { font-size: 15px; } #mobile-data-container #rhm-ui .rhm-hoja .h-cuerpo { padding: 4px 18px 14px; overflow: auto; overscroll-behavior: contain; flex: 1; font-size: 13.5px; } #mobile-data-container #rhm-ui .rhm-hoja .h-pie { flex: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 14px 16px; border-top: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-hoja .h-pie .rhm-btn { flex: 1 1 30%; padding: 0 10px; } #mobile-data-container #rhm-ui .rhm-hoja .h-pie .rhm-btn.ancho { flex: 1 1 100%; } #mobile-data-container #rhm-ui .rhm-hoja.mv-arrastra { animation: none; transition: none; } #mobile-data-container #rhm-ui .rhm-hoja.mv-baja { transition: transform .22s ease-in; transform: translateY(105%) !important; } #mobile-data-container #rhm-ui .rhm-hoja.mv-vuelve { transition: transform .2s ease; } #mobile-data-container #rhm-ui .nota { margin: 10px 0 0; font-size: 12px; color: var(--muted); line-height: 1.45; } /* ── Las piezas del Parte Diario que el Semanal usa igual ──────────── */ #mobile-data-container #rhm-ui .rhm-cab:empty { display: none; } #mobile-data-container #rhm-ui .rhm-chip.nav { color: var(--navy-500); background: var(--navy-050); border-color: #d3dff0; } #mobile-data-container #rhm-ui .rhm-chip.mut { color: var(--faint); background: #f4f5f8; } #mobile-data-container #rhm-ui .rhm-r .rhm-chip { white-space: nowrap; flex: none; } #mobile-data-container #rhm-ui .w { color: var(--warn); } #mobile-data-container #rhm-ui .o { color: var(--ok); } /* la lista de días */ #mobile-data-container #rhm-ui .rhm-mes { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 14px 16px 6px; font-size: 13px; color: var(--navy); } #mobile-data-container #rhm-ui .rhm-mes small { font-size: 11.5px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-r.dd { grid-template-columns: 46px minmax(0, 1fr) auto; gap: 2px 10px; align-items: center; } /* lámina 22: el veredicto, la barra apilada y el resumen chico */ #mobile-data-container #rhm-ui .rhm-r.dd .t { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r.dd .t.mal { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-r.dd .t.warn { color: var(--warn); } #mobile-data-container #rhm-ui .rhm-r.dd .t.ok { color: var(--ok); } #mobile-data-container #rhm-ui .rhm-r.dd .t.nav { color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-r.dd .bar { grid-column: 2 / -1; display: flex; height: 6px; border-radius: 3px; overflow: hidden; background: var(--hair); } #mobile-data-container #rhm-ui .rhm-r.dd .bar i { display: block; height: 100%; } #mobile-data-container #rhm-ui .rhm-r.dd .bar i.ok { background: #9fd3bb; } #mobile-data-container #rhm-ui .rhm-r.dd .bar i.warn { background: var(--warn); } #mobile-data-container #rhm-ui .rhm-r.dd .bar i.mal { background: var(--crit); } #mobile-data-container #rhm-ui .rhm-r.dd .bar i.nav { background: var(--navy-300); } #mobile-data-container #rhm-ui .rhm-r.dd .bar i.ext { background: #4d82c8; opacity: .5; } #mobile-data-container #rhm-ui .rhm-r.dd.fer .fe { background: #eef0f4; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-r.dd.fer .fe small { color: var(--faint); } #mobile-data-container #rhm-ui .rhm-dias-mas { margin: 10px 12px 0; } #mobile-data-container #rhm-ui .rhm-dias-mas .rhm-btn { width: 100%; } #mobile-data-container #rhm-ui .rhm-hh .material-symbols-outlined { font-size: 15px; margin-right: 4px; vertical-align: -3px; } #mobile-data-container #rhm-ui .rhm-pleg { display: flex; align-items: center; gap: 6px; width: 100%; padding: 10px 12px; border: 0; background: #fafbfd; color: var(--navy); font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; text-align: left; } #mobile-data-container #rhm-ui .rhm-pleg .material-symbols-outlined { font-size: 18px; transition: transform .15s; } #mobile-data-container #rhm-ui .rhm-pleg.ab .material-symbols-outlined { transform: rotate(180deg); } #mobile-data-container #rhm-ui .rhm-pleg.ir { border-top: 1px solid var(--hair); color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-pleg.ir .material-symbols-outlined { transform: none; } #mobile-data-container #rhm-ui .rhm-dia-ver .vch .rhm-chip, #mobile-data-container #rhm-ui .rhm-nov-ver .vl b { white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-ver.warn { border-left-color: var(--warn); } #mobile-data-container #rhm-ui .rhm-ver.warn .vt { color: var(--warn); } #mobile-data-container #rhm-ui .rhm-ver.nav .vt { color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-nov-chips { margin-top: 10px; } #mobile-data-container #rhm-ui .rhm-btn.peligro { color: var(--crit); border-color: var(--crit-hair); } #mobile-data-container #rhm-ui .rhm-r.pe.nv { grid-template-columns: 34px minmax(0, 1fr) auto; } #mobile-data-container #rhm-ui .rhm-r.pe.nv .hr { color: var(--ink); } #mobile-data-container #rhm-ui .rhm-hdl a.rhm-chip { text-decoration: none; } #mobile-data-container #rhm-ui .rhm-r.dd .fe { grid-row: 1 / 3; align-self: center; display: flex; flex-direction: column; align-items: center; line-height: 1.05; padding: 5px 0; border-radius: 10px; background: var(--navy-050); color: var(--navy); } #mobile-data-container #rhm-ui .rhm-r.dd .fe small { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-r.dd .fe b { font-size: 18px; font-weight: 800; } #mobile-data-container #rhm-ui .rhm-r.dd .st { min-width: 0; display: flex; align-items: center; overflow: hidden; } #mobile-data-container #rhm-ui .rhm-r.dd .val { font-size: 12px; font-weight: 500; color: var(--muted); white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-r.dd .l2 { grid-column: 2 / -1; display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--muted); white-space: nowrap; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r.dd .l2 > span:first-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r.dd .dv { font-variant-numeric: tabular-nums; flex: none; } #mobile-data-container #rhm-ui .rhm-r.dd .dv.warn { color: var(--warn); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-r.dd .dv.mal { color: var(--crit); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-r.dd.sin .fe { background: var(--warn-050); color: var(--warn); } #mobile-data-container #rhm-ui .rhm-r.dd.sin .fe small { color: var(--warn); } #mobile-data-container #rhm-ui .rhm-r.dd.viejo { opacity: .72; } #mobile-data-container #rhm-ui .rhm-r.dd.viejo .fe { background: #eef0f4; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-r.dd.viejo .fe small { color: var(--faint); } #mobile-data-container #rhm-ui .rhm-mas { display: flex; align-items: center; justify-content: center; gap: 6px; width: calc(100% - 24px); margin: 10px 12px 20px; padding: 11px; border: 1px dashed var(--hair-strong); border-radius: 12px; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--navy-500); cursor: pointer; } #mobile-data-container #rhm-ui .rhm-mas[disabled] { opacity: .6; } #mobile-data-container #rhm-ui .rhm-mas .gs-spin { width: 14px; height: 14px; } #mobile-data-container #rhm-ui .rhm-fin { margin: 12px 16px 20px; text-align: center; font-size: 11.5px; color: var(--faint); } /* las cuatro cifras */ #mobile-data-container #rhm-ui .rhm-cifras { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 8px 12px 0; background: var(--hair); border: 1px solid var(--hair); border-radius: 14px; overflow: hidden; box-shadow: var(--e1); } #mobile-data-container #rhm-ui .rhm-cifras > button { display: block; min-width: 0; padding: 8px 11px; border: 0; background: #fff; font: inherit; color: inherit; text-align: left; cursor: pointer; transition: background .12s ease; } #mobile-data-container #rhm-ui .rhm-cifras > button:active { background: var(--navy-050); } #mobile-data-container #rhm-ui .rhm-cifras > button[disabled] { cursor: default; } #mobile-data-container #rhm-ui .rhm-cifras .k { display: block; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-cifras .v { display: block; font-size: 19px; font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; line-height: 1.2; white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-cifras .v small { font-size: 11.5px; color: var(--muted); font-weight: 500; } #mobile-data-container #rhm-ui .rhm-cifras .v.ok { color: var(--ok); } #mobile-data-container #rhm-ui .rhm-cifras .v.warn { color: var(--warn); } #mobile-data-container #rhm-ui .rhm-cifras .v.mal { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-cifras .s { display: block; font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-gau { position: relative; display: flex; height: 5px; margin: 4px 0 2px; } #mobile-data-container #rhm-ui .rhm-gau i { flex: 6; background: #cfe7dc; } #mobile-data-container #rhm-ui .rhm-gau i:first-child { border-radius: 9px 0 0 9px; } #mobile-data-container #rhm-ui .rhm-gau i + i { flex: 4; background: #f3e2c2; border-radius: 0; } #mobile-data-container #rhm-ui .rhm-gau i + i + i { flex: 5; background: #f3d0d0; border-radius: 0 9px 9px 0; } #mobile-data-container #rhm-ui .rhm-gau b { position: absolute; top: -2px; width: 3px; height: 9px; border-radius: 2px; background: var(--navy); transform: translateX(-1px); } #mobile-data-container #rhm-ui .rhm-franja { display: flex; gap: 9px; margin: 12px 12px 0; padding: 10px 12px; border: 1px solid var(--crit-hair); border-left: 4px solid var(--crit); border-radius: 12px; background: var(--crit-050); color: #8f1d1d; font-size: 12.5px; line-height: 1.45; } #mobile-data-container #rhm-ui .rhm-franja > .material-symbols-outlined { color: var(--crit); font-size: 20px; flex: none; } #mobile-data-container #rhm-ui .rhm-franja b { color: var(--crit); } /* los renglones de la ficha */ #mobile-data-container #rhm-ui .rhm-r.ar { grid-template-columns: minmax(0, 1fr) auto; gap: 1px 8px; cursor: default; } #mobile-data-container #rhm-ui .rhm-r.ar:active { background: none; transform: none; } #mobile-data-container #rhm-ui .rhm-r.ar .l2 { grid-column: 1 / -1; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-r.ar .l2 b { color: var(--ink); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-r .pg { color: var(--warn); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-dl { padding: 8px 14px; } #mobile-data-container #rhm-ui .rhm-dl dl, #mobile-data-container #rhm-ui .rhm-hdl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0; font-size: 13px; } #mobile-data-container #rhm-ui .rhm-dl dt, #mobile-data-container #rhm-ui .rhm-hdl dt { color: var(--muted); } #mobile-data-container #rhm-ui .rhm-dl dd, #mobile-data-container #rhm-ui .rhm-hdl dd { margin: 0; text-align: right; font-weight: 500; overflow-wrap: anywhere; } #mobile-data-container #rhm-ui .rhm-hdl { margin-top: 10px; } #mobile-data-container #rhm-ui .rhm-nota-l { margin: 10px 16px 6px; font-size: 12px; color: var(--faint); line-height: 1.45; } /* los depósitos, plegados */ #mobile-data-container #rhm-ui .rhm-dep { margin: 0 12px 8px; background: #fff; border: 1px solid var(--hair); border-radius: 14px; box-shadow: var(--e1); overflow: hidden; } #mobile-data-container #rhm-ui .rhm-dep > button { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1px 8px; align-items: center; width: 100%; padding: 10px 12px; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; } #mobile-data-container #rhm-ui .rhm-dep > button .nm { font-weight: 700; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-dep > button .val { font-weight: 700; font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-dep > button .l2 { grid-column: 1 / -1; font-size: 11.5px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-dep > button > .material-symbols-outlined { grid-row: 1; grid-column: 3; color: var(--faint); transition: transform .24s cubic-bezier(.2, .8, .2, 1); } #mobile-data-container #rhm-ui .rhm-dep.ab > button > .material-symbols-outlined { transform: rotate(180deg); } #mobile-data-container #rhm-ui .rhm-dep .cue { display: none; border-top: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-dep.ab .cue { display: block; } #mobile-data-container #rhm-ui .rhm-dep .sub3 { padding: 8px 14px 3px; font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); font-weight: 700; background: #fafbfc; border-bottom: 1px solid var(--hair); } /* la hoja del insumo */ #mobile-data-container #rhm-ui .rhm-aviso { display: flex; gap: 9px; margin-top: 12px; padding: 9px 11px; border: 1px solid; border-radius: 10px; font-size: 12.5px; line-height: 1.45; } #mobile-data-container #rhm-ui .rhm-aviso .material-symbols-outlined { font-size: 18px; flex: none; } #mobile-data-container #rhm-ui .rhm-aviso.nav { background: var(--navy-050); border-color: #cfdcf1; color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-aviso.nav b { color: var(--navy); } #mobile-data-container #rhm-ui .rhm-aviso.warn { background: var(--warn-050); border-color: var(--warn-hair); color: #7a4100; } #mobile-data-container #rhm-ui .rhm-pie .rhm-btn { flex: 1; } /* el toast, arriba del pie; con la hoja abierta, arriba de todo */ body:has(#mobile-data-container #rhm-ui) #gs-toasts { left: 12px; right: 12px; bottom: 84px; align-items: center; } body:has(#mobile-data-container #rhm-ui.rhm-con-hoja) #gs-toasts { bottom: auto; top: 70px; flex-direction: column; } /* ── Lo propio de RRHH ─────────────────────────────────────────────── */ /* el veredicto (el de la PC) */ #mobile-data-container #rhm-ui .rhm-ver { margin: 10px 12px 0; padding: 12px 14px; background: #fff; border: 1px solid var(--hair); border-left: 4px solid var(--navy-500); border-radius: 14px; box-shadow: var(--e1); } #mobile-data-container #rhm-ui .rhm-ver.mal { border-left-color: var(--crit); } #mobile-data-container #rhm-ui .rhm-ver.ok { border-left-color: var(--ok); } #mobile-data-container #rhm-ui .rhm-ver .vt { font-size: 22px; font-weight: 800; color: var(--navy); line-height: 1.15; } #mobile-data-container #rhm-ui .rhm-ver.mal .vt { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-ver.ok .vt { color: var(--ok); } #mobile-data-container #rhm-ui .rhm-ver .vl { margin-top: 4px; font-size: 12.5px; color: var(--muted); line-height: 1.45; } #mobile-data-container #rhm-ui .rhm-ver .vl b { color: var(--ink); } #mobile-data-container #rhm-ui .rhm-ver .vch { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; } /* la línea del día: la de la PC (rrhh-ui.css), a la medida del teléfono. --rhm-col = columna de nombres + su hueco: la usa la raya de «ahora». */ #mobile-data-container #rhm-ui .rhm-linea { --rhm-col: 98px; margin: 0 12px 4px; background: #fff; border: 1px solid var(--hair); border-radius: 14px; box-shadow: var(--e1); overflow: hidden; } #mobile-data-container #rhm-ui .rhm-linea .th-linea { padding: 10px 10px 8px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-h, #mobile-data-container #rhm-ui .rhm-linea .th-linea-f, #mobile-data-container #rhm-ui .rhm-linea .th-linea-p { grid-template-columns: 90px 1fr; gap: 8px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-h .esc span { font-size: 9px; padding-left: 1px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-h .esc span:nth-child(even) { color: transparent; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-f .n { font-size: 12px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-f .n small, #mobile-data-container #rhm-ui .rhm-linea .th-linea-p .n small { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-p .n { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-linea .th-banda span { font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-linea .th-ahora { display: block; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-h2 { display: block; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-h2 .th-prox { margin-left: 6px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-ley { gap: 6px 10px; font-size: 10.5px; } #mobile-data-container #rhm-ui .rhm-linea .th-linea-ley span:last-child { display: none; } /* los sectores */ #mobile-data-container #rhm-ui .rhm-r.sec { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; cursor: default; } #mobile-data-container #rhm-ui .rhm-r.sec:active { background: none; transform: none; } #mobile-data-container #rhm-ui .rhm-r.sec .nm { font-weight: 700; font-size: 14px; } #mobile-data-container #rhm-ui .rhm-r.sec .val { font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-r.sec .val.mal { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-r.sec .val.ok { color: var(--ok); } #mobile-data-container #rhm-ui .rhm-r.sec .val.nav { color: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-r.sec .l2 { grid-column: 1 / -1; font-size: 11.5px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-r.sec .l2 .mal { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-r.sec .bar { grid-column: 1 / -1; } /* la garita: los turnos de Portería adentro de su renglón */ #mobile-data-container #rhm-ui .rhm-r.sec .tur { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; margin-top: 6px; } #mobile-data-container #rhm-ui .rhm-r.sec .tu { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; align-items: center; padding: 7px 9px; background: #fafbfc; border: 1px solid var(--hair); border-radius: 10px; } #mobile-data-container #rhm-ui .rhm-r.sec .tn { font-weight: 700; font-size: 13px; } #mobile-data-container #rhm-ui .rhm-r.sec .tn small { font-weight: 500; color: var(--muted); font-size: 11px; } #mobile-data-container #rhm-ui .rhm-r.sec .tq { grid-column: 1 / -1; font-size: 12px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-r.sec .tq b { color: var(--ink); } /* las personas */ #mobile-data-container #rhm-ui .rhm-r.pe { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 1px 10px; align-items: center; cursor: default; } #mobile-data-container #rhm-ui .rhm-r.pe:active { background: none; transform: none; } #mobile-data-container #rhm-ui .rhm-r.pe.toca { cursor: pointer; } #mobile-data-container #rhm-ui .rhm-r.pe.toca:active, #mobile-data-container #rhm-ui .rhm-r.pe.toca.rhm-toc { background: var(--navy-050); transform: scale(.985); } #mobile-data-container #rhm-ui .rhm-r.pe .av { grid-row: 1 / 3; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11.5px; font-weight: 700; background: var(--navy-050); color: var(--navy); } #mobile-data-container #rhm-ui .rhm-r.pe .av.ok { background: var(--ok-050); color: var(--ok); } #mobile-data-container #rhm-ui .rhm-r.pe .av.mal { background: var(--crit-050); color: var(--crit); } #mobile-data-container #rhm-ui .rhm-r.pe .av.warn { background: var(--warn-050); color: var(--warn); } #mobile-data-container #rhm-ui .rhm-r.pe .nm { font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-r.pe .hr, #mobile-data-container #rhm-ui .rhm-r.nv .hr { font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-r.pe .l2 { grid-column: 2 / -1; display: flex; align-items: center; gap: 6px; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r .ref { margin-left: auto; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r.nv { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; cursor: default; } #mobile-data-container #rhm-ui .rhm-r.nv:active { background: none; transform: none; } #mobile-data-container #rhm-ui .rhm-r.nv .nm { font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-r.nv .hr { color: var(--muted); font-weight: 500; } #mobile-data-container #rhm-ui .rhm-r.nv .l2 { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; min-width: 0; } #mobile-data-container #rhm-ui .rhm-tira { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 12px 8px; } /* la semana */ #mobile-data-container #rhm-ui .rhm-sem { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin: 0 12px; } #mobile-data-container #rhm-ui .rhm-sem .sd { position: relative; padding: 6px 0; text-align: center; line-height: 1.15; background: #fff; border: 1px solid var(--hair); border-radius: 10px; } #mobile-data-container #rhm-ui .rhm-sem .sd small { display: block; font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-sem .sd b { display: block; font-size: 16px; color: var(--navy); } #mobile-data-container #rhm-ui .rhm-sem .sd span { display: block; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-sem .sd i { position: absolute; top: -6px; right: -5px; min-width: 17px; height: 17px; border-radius: 9px; background: var(--crit); color: #fff; font-size: 10.5px; font-style: normal; font-weight: 700; line-height: 17px; } #mobile-data-container #rhm-ui .rhm-sem .sd.hoy { border-color: var(--navy); box-shadow: 0 0 0 1px var(--navy); } #mobile-data-container #rhm-ui .rhm-sem .sd.paso { opacity: .65; } /* el formulario de la novedad */ #mobile-data-container #rhm-ui .rhm-campo { display: block; margin-top: 10px; font-size: 12px; font-weight: 600; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-campo[hidden] { display: none; } #mobile-data-container #rhm-ui .rhm-campo small { font-weight: 400; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-campo input, #mobile-data-container #rhm-ui .rhm-campo textarea { display: block; width: 100%; min-width: 0; box-sizing: border-box; margin-top: 4px; padding: 10px 12px; border: 1px solid var(--hair-strong); border-radius: 11px; font: inherit; font-size: 16px; color: var(--ink); background: #fff; } #mobile-data-container #rhm-ui .rhm-dosc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; } /* las licencias como filas con icono y pista, en dos grupos (lámina 26) */ #mobile-data-container #rhm-ui .rhm-gr { font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); margin: 12px 2px 4px; } #mobile-data-container #rhm-ui .rhm-gr small { font-weight: 600; text-transform: none; letter-spacing: 0; } #mobile-data-container #rhm-ui .rhm-fichas { border: 1px solid var(--hair); border-radius: 11px; overflow: hidden; background: #fff; } #mobile-data-container #rhm-ui .rhm-fichas .fi { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 7px 10px 7px 12px; border: 0; border-bottom: 1px solid var(--hair); background: #fff; font: inherit; text-align: left; color: var(--ink); cursor: pointer; position: relative; } #mobile-data-container #rhm-ui .rhm-fichas .fi:last-child { border-bottom: 0; } #mobile-data-container #rhm-ui .rhm-fichas .fi::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: transparent; } #mobile-data-container #rhm-ui .rhm-fichas .fi.on { background: var(--navy-050); } #mobile-data-container #rhm-ui .rhm-fichas .fi.on::before { background: var(--navy); } #mobile-data-container #rhm-ui .rhm-fichas .fi > .material-symbols-outlined { font-size: 20px; color: var(--faint); flex: none; } #mobile-data-container #rhm-ui .rhm-fichas .fi.on > .material-symbols-outlined { color: var(--navy); } #mobile-data-container #rhm-ui .rhm-fichas .fi > span:not(.material-symbols-outlined):not(.rd) { flex: 1; min-width: 0; } #mobile-data-container #rhm-ui .rhm-fichas .fi b { display: block; font-weight: 600; font-size: 13.5px; line-height: 1.2; } #mobile-data-container #rhm-ui .rhm-fichas .fi small { display: block; color: var(--faint); font-size: 11px; line-height: 1.2; } #mobile-data-container #rhm-ui .rhm-fichas .fi .rd { width: 17px; height: 17px; border-radius: 50%; border: 1.5px solid var(--hair-strong); flex: none; position: relative; } #mobile-data-container #rhm-ui .rhm-fichas .fi.on .rd { border-color: var(--navy); } #mobile-data-container #rhm-ui .rhm-fichas .fi.on .rd::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; background: var(--navy); } #mobile-data-container #rhm-ui .rhm-fichas .fi.vac { background: #fafbfd; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-fichas .fi.vac small { color: var(--navy); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-fichas .fi.vac > .material-symbols-outlined:last-child { color: var(--navy); font-size: 18px; } #mobile-data-container #rhm-ui .rhm-cuenta { display: flex; gap: 8px; align-items: center; margin-top: 10px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--hair); background: #fafbfd; font-size: 12px; color: var(--muted); line-height: 1.35; } #mobile-data-container #rhm-ui .rhm-cuenta[hidden] { display: none; } #mobile-data-container #rhm-ui .rhm-cuenta > .material-symbols-outlined { font-size: 18px; color: var(--navy-500); flex: none; } #mobile-data-container #rhm-ui .rhm-cuenta b { color: var(--ink); } #mobile-data-container #rhm-ui .rhm-cuenta .bar { flex: none; width: 56px; height: 7px; border-radius: 5px; background: #e3e7ef; overflow: hidden; position: relative; } #mobile-data-container #rhm-ui .rhm-cuenta .bar i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--navy); } #mobile-data-container #rhm-ui .rhm-cuenta.warn { border-color: var(--warn-hair); background: var(--warn-050); color: #7a4100; } #mobile-data-container #rhm-ui .rhm-cuenta.warn > .material-symbols-outlined, #mobile-data-container #rhm-ui .rhm-cuenta.warn .bar i { color: var(--warn); background: var(--warn); } #mobile-data-container #rhm-ui .rhm-cuenta.warn > .material-symbols-outlined { background: none; } #mobile-data-container #rhm-ui .rhm-cuenta.mal { border-color: var(--crit-hair); background: var(--crit-050); color: var(--crit); } #mobile-data-container #rhm-ui .rhm-cuenta.mal > .material-symbols-outlined { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-cuenta.mal .bar i { background: var(--crit); } #mobile-data-container #rhm-ui .rhm-segm { display: flex; gap: 0; padding: 3px; border-radius: 10px; background: #e3e7ef; margin-top: 5px; } #mobile-data-container #rhm-ui .rhm-segm button { flex: 1; min-width: 0; text-align: center; font: inherit; font-size: 12px; font-weight: 600; color: var(--muted); padding: 8px 2px; border: 0; border-radius: 7px; background: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; } #mobile-data-container #rhm-ui .rhm-segm button.on { color: var(--navy); background: #fff; box-shadow: var(--e1); } #mobile-data-container #rhm-ui .rhm-segm button small { font-weight: 500; opacity: .8; } #mobile-data-container #rhm-ui .rhm-campo input[data-f=fin][hidden] { display: none; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-av.warn { background: var(--warn-050); color: var(--warn); } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-av.mal { background: var(--crit-050); color: var(--crit); } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .sub b { color: var(--ink); } /* el calendario de la planta, adentro de Novedades (lámina 26) */ #mobile-data-container #rhm-ui .rhm-nov-ver .vch { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; } #mobile-data-container #rhm-ui .rhm-nov-ver .vch .rhm-chip { font: inherit; font-size: 11.5px; cursor: pointer; } #mobile-data-container #rhm-ui .rhm-cal-prox { display: grid; grid-template-columns: 50px minmax(0, 1fr) auto; gap: 2px 10px; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-cal-prox .fe { grid-row: 1 / 3; display: flex; flex-direction: column; align-items: center; line-height: 1.05; padding: 5px 0; border-radius: 10px; background: var(--warn-050); color: var(--warn); } #mobile-data-container #rhm-ui .rhm-cal-prox .fe.cie { background: #fffbea; color: #8a6d00; } #mobile-data-container #rhm-ui .rhm-cal-prox .fe small { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; } #mobile-data-container #rhm-ui .rhm-cal-prox .fe b { font-size: 17px; font-weight: 800; } #mobile-data-container #rhm-ui .rhm-cal-prox .t { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } #mobile-data-container #rhm-ui .rhm-cal-prox .s { grid-column: 2 / 4; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-mes { display: block; padding: 8px 12px 6px; } #mobile-data-container #rhm-ui .rhm-mes h6 { margin: 0 0 4px; font-size: 12px; font-weight: 700; color: var(--navy); display: flex; justify-content: space-between; } #mobile-data-container #rhm-ui .rhm-mes h6 small { color: var(--faint); font-weight: 500; } #mobile-data-container #rhm-ui .rhm-mes .dd { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; } #mobile-data-container #rhm-ui .rhm-mes .dd span { height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 12px; font-variant-numeric: tabular-nums; color: var(--ink); } #mobile-data-container #rhm-ui .rhm-mes.chico .dd span { height: 19px; font-size: 10.5px; border-radius: 4px; } #mobile-data-container #rhm-ui .rhm-mes .dd span.h { color: var(--faint); font-size: 10px; font-weight: 700; } #mobile-data-container #rhm-ui .rhm-mes.chico .dd span.h { font-size: 8.5px; } #mobile-data-container #rhm-ui .rhm-mes .dd span.dom { color: var(--faint); } #mobile-data-container #rhm-ui .rhm-mes .dd span.fer { background: var(--warn-050); color: var(--warn); font-weight: 700; } #mobile-data-container #rhm-ui .rhm-mes .dd span.nol { color: var(--warn); font-weight: 700; outline: 1px dashed var(--warn); outline-offset: -1px; } #mobile-data-container #rhm-ui .rhm-mes .dd span.cie { background: #fffbea; color: #8a6d00; font-weight: 700; } #mobile-data-container #rhm-ui .rhm-mes .dd span.cor { background: var(--crit-050); color: var(--crit); font-weight: 700; } #mobile-data-container #rhm-ui .rhm-mes .dd span.lic { box-shadow: inset 0 -3px 0 var(--navy-300); } #mobile-data-container #rhm-ui .rhm-mes .dd span.pas { opacity: .5; } #mobile-data-container #rhm-ui .rhm-mes .dd span.hoy { outline: 2px solid var(--navy); outline-offset: -2px; font-weight: 800; color: var(--navy); opacity: 1; } #mobile-data-container #rhm-ui .rhm-anio { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; } #mobile-data-container #rhm-ui .rhm-leg { display: flex; flex-wrap: wrap; gap: 8px; padding: 2px 12px 8px; font-size: 10.5px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-leg i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; vertical-align: -1px; margin-right: 3px; border: 1px solid var(--hair-strong); } #mobile-data-container #rhm-ui .rhm-leg i.fer { background: var(--warn-050); border-color: var(--warn-hair); } #mobile-data-container #rhm-ui .rhm-leg i.nol { border: 1px dashed var(--warn); background: #fff; } #mobile-data-container #rhm-ui .rhm-leg i.cie { background: #fffbea; border-color: #e3b341; } #mobile-data-container #rhm-ui .rhm-leg i.cor { background: var(--crit-050); border-color: var(--crit-hair); } #mobile-data-container #rhm-ui .rhm-leg i.lic { box-shadow: inset 0 -3px 0 var(--navy-300); border: 0; } #mobile-data-container #rhm-ui .rhm-cal-pie { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--hair); padding-right: 10px; } #mobile-data-container #rhm-ui .rhm-cal-pie .rhm-pleg { flex: 1; } #mobile-data-container #rhm-ui .rhm-cal-pie .rhm-chip { font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; } #mobile-data-container #rhm-ui .rhm-nota-vac { display: flex; gap: 5px; align-items: flex-start; margin-top: 7px; font-size: 11.5px; font-weight: 400; color: var(--faint); line-height: 1.35; } #mobile-data-container #rhm-ui .rhm-nota-vac .material-symbols-outlined { font-size: 15px; flex: none; } #mobile-data-container #rhm-ui .rhm-opciones { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; } #mobile-data-container #rhm-ui .rhm-opciones:empty { display: none; } #mobile-data-container #rhm-ui .rhm-opciones .op { display: flex; justify-content: space-between; gap: 8px; padding: 9px 12px; border: 1px solid var(--hair); border-radius: 10px; background: #fafbfc; font: inherit; font-size: 13.5px; text-align: left; cursor: pointer; } #mobile-data-container #rhm-ui .rhm-opciones .op small { color: var(--faint); } #mobile-data-container #rhm-ui .rhm-aviso.mal { background: var(--crit-050); border-color: var(--crit-hair); color: var(--crit); } #mobile-data-container #rhm-ui .rhm-pie .rhm-btn { flex: 1; } /* el formulario del horario especial (láminas 17 y 18): las mismas clases he-* que el modal de la PC, con este scope y a tamaño de dedo */ #mobile-data-container #rhm-ui .rhm-hoja .h-cab.h-ficha { display: flex; gap: 12px; align-items: center; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-av { width: 40px; height: 40px; border-radius: 11px; background: var(--navy-050); color: var(--navy); font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-tx { min-width: 0; flex: 1; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-ficha .lb { font-size: 11px; text-transform: uppercase; letter-spacing: .07em; font-weight: 700; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-tx h4 { margin: 1px 0 0; font-size: 16.5px; } #mobile-data-container #rhm-ui .rhm-hoja .h-cab .h-tx .sub b { font-weight: 600; color: var(--ink); } #mobile-data-container #rhm-ui .rhm-he .he-campo { display: block; margin-top: 14px; } #mobile-data-container #rhm-ui .rhm-he .he-campo:first-child { margin-top: 10px; } #mobile-data-container #rhm-ui .rhm-he [hidden] { display: none !important; } #mobile-data-container #rhm-ui .rhm-he .he-lab { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 0 0 6px; } #mobile-data-container #rhm-ui .rhm-he .he-lab small { font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-he .he-in { display: block; width: 100%; min-width: 0; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--hair-strong); border-radius: 11px; font: inherit; font-size: 16px; color: var(--ink); background: #fff; font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-he .he-in:focus { outline: none; border-color: var(--navy-500); box-shadow: 0 0 0 3px rgba(21, 74, 148, .14); } #mobile-data-container #rhm-ui .rhm-he textarea.he-in { min-height: 48px; } #mobile-data-container #rhm-ui .rhm-he .he-opts { border: 1px solid var(--hair); border-radius: 12px; overflow: hidden; background: #fff; } #mobile-data-container #rhm-ui .rhm-he .he-opt { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 46px; padding: 10px 12px 10px 14px; border: 0; border-bottom: 1px solid var(--hair); background: #fff; font: inherit; text-align: left; color: var(--ink); } #mobile-data-container #rhm-ui .rhm-he .he-opt:last-of-type { border-bottom: 0; } #mobile-data-container #rhm-ui .rhm-he .he-opt:active { background: var(--navy-050); } #mobile-data-container #rhm-ui .rhm-he .he-opt::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: transparent; } #mobile-data-container #rhm-ui .rhm-he .he-opt.on { background: var(--navy-050); } #mobile-data-container #rhm-ui .rhm-he .he-opt.on::before { background: var(--navy); } #mobile-data-container #rhm-ui .rhm-he .he-rd { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--hair-strong); flex: none; background: #fff; position: relative; } #mobile-data-container #rhm-ui .rhm-he .he-opt.on .he-rd { border-color: var(--navy); } #mobile-data-container #rhm-ui .rhm-he .he-opt.on .he-rd::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; background: var(--navy); } #mobile-data-container #rhm-ui .rhm-he .he-h { font-weight: 700; font-size: 16px; font-variant-numeric: tabular-nums; min-width: 112px; display: inline-flex; align-items: center; gap: 4px; } #mobile-data-container #rhm-ui .rhm-he .he-n { flex: 1; min-width: 0; color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #mobile-data-container #rhm-ui .rhm-he .he-opt.on .he-n { color: var(--ink); } #mobile-data-container #rhm-ui .rhm-he .he-tag { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; padding: 2px 7px; border-radius: 99px; border: 1px solid var(--hair-strong); color: var(--faint); background: #fff; flex: none; } #mobile-data-container #rhm-ui .rhm-he .he-opt.otro .he-h { color: var(--navy); font-weight: 600; font-size: 15px; } #mobile-data-container #rhm-ui .rhm-he .he-opt.otro .material-symbols-outlined { font-size: 18px; } #mobile-data-container #rhm-ui .rhm-he .he-otro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 10px; padding: 10px 14px 12px; background: #fafbfd; border-top: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-he .he-otro .he-lab { margin-bottom: 4px; } #mobile-data-container #rhm-ui .rhm-he .he-dur { grid-column: 1 / -1; font-size: 12.5px; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-he .he-dur:empty { display: none; } #mobile-data-container #rhm-ui .rhm-he .he-hasta { display: flex; flex-direction: column; gap: 8px; } #mobile-data-container #rhm-ui .rhm-he .he-seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: 3px; border-radius: 11px; background: #e3e7ef; } #mobile-data-container #rhm-ui .rhm-he .he-seg button { font: inherit; font-size: 12px; line-height: 1.15; font-weight: 600; color: var(--muted); border: 0; background: none; min-height: 40px; padding: 5px 4px; border-radius: 8px; white-space: normal; } #mobile-data-container #rhm-ui .rhm-he .he-seg button.on { color: var(--navy); background: #fff; box-shadow: var(--e1); } #mobile-data-container #rhm-ui .rhm-he-nota { display: flex; gap: 6px; align-items: flex-start; margin-top: 12px; font-size: 12px; color: var(--muted); line-height: 1.4; } #mobile-data-container #rhm-ui .rhm-he-nota .material-symbols-outlined { font-size: 16px; color: var(--navy-500); flex: none; } } @keyframes rhmEntra { from { opacity: 0; transform: translateY(10px); } } @media (prefers-reduced-motion: reduce) { #mobile-data-container #rhm-ui .rhm-r, #mobile-data-container #rhm-ui .rhm-hoja { animation: none; } } /* ── Vacaciones (lámina 21, 09/10/2026, ganó la A «las personas»): la tarjeta de la temporada con la franja que se toca, el buscador, los chips de filtro, la lista por puesto con ficha, y las hojas de la persona y de la semana. ── */ #mobile-data-container #rhm-ui .rhm-vac-ver .vl .r { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-vac-cifras { display: flex; gap: 6px; margin-top: 9px; } #mobile-data-container #rhm-ui .rhm-vac-cifras > div { flex: 1; border: 1px solid var(--hair); border-radius: 9px; padding: 5px 8px; min-width: 0; } #mobile-data-container #rhm-ui .rhm-vac-cifras .l { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-vac-cifras .v { font-size: 16px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; line-height: 1.2; } #mobile-data-container #rhm-ui .rhm-vac-cifras .v small { font-size: 10.5px; font-weight: 600; color: var(--muted); margin-left: 2px; } #mobile-data-container #rhm-ui .rhm-vac-franja { display: grid; grid-template-columns: repeat(30, 1fr); gap: 1.5px; margin-top: 10px; } #mobile-data-container #rhm-ui .rhm-vac-franja i { height: 18px; border-radius: 2px; background: var(--ok-050); border: 1px solid #c7e4d7; position: relative; cursor: pointer; } #mobile-data-container #rhm-ui .rhm-vac-franja i.warn { background: var(--warn-050); border-color: var(--warn); } #mobile-data-container #rhm-ui .rhm-vac-franja i.crit { background: var(--crit); border-color: var(--crit); } #mobile-data-container #rhm-ui .rhm-vac-franja i.cierre { background: #dfe6f4; border-color: #c5d3ea; } #mobile-data-container #rhm-ui .rhm-vac-franja i.base { background: repeating-linear-gradient(135deg, var(--crit-050) 0 3px, #f3c9c9 3px 5px); border-color: #f3c9c9; } #mobile-data-container #rhm-ui .rhm-vac-franja i.hoy::after { content: ''; position: absolute; left: 50%; top: -6px; border: 4px solid transparent; border-top: 5px solid var(--navy); transform: translateX(-50%); } #mobile-data-container #rhm-ui .rhm-vac-franja i:active { outline: 2px solid var(--navy); outline-offset: 1px; } #mobile-data-container #rhm-ui .rhm-vac-meses { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--faint); text-transform: uppercase; letter-spacing: .04em; margin-top: 2px; } #mobile-data-container #rhm-ui .rhm-vac-pie { font-size: 11px; color: var(--faint); margin-top: 5px; display: flex; gap: 4px; align-items: center; } #mobile-data-container #rhm-ui .rhm-vac-pie .material-symbols-outlined { font-size: 13px; } #mobile-data-container #rhm-ui .rhm-vac-busca { display: flex; align-items: center; gap: 8px; margin: 10px 12px 0; padding: 0 10px; background: #fff; border: 1px solid var(--hair-strong); border-radius: 11px; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-vac-busca .material-symbols-outlined { font-size: 18px; flex: none; } #mobile-data-container #rhm-ui .rhm-vac-busca input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 14px; color: var(--ink); padding: 10px 0; outline: none; } #mobile-data-container #rhm-ui .rhm-vac-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 12px 0; padding: 0 0 6px; } #mobile-data-container #rhm-ui .rhm-vac-chips .rhm-chip { flex: none; font-size: 12px; padding: 5px 11px; border-radius: 999px; cursor: pointer; font: inherit; font-weight: 600; } #mobile-data-container #rhm-ui .rhm-vac-chips .rhm-chip .n { font-size: 10.5px; background: var(--navy-050); color: var(--navy); border-radius: 999px; padding: 0 6px; line-height: 16px; margin-left: 4px; } #mobile-data-container #rhm-ui .rhm-vac-chips .rhm-chip.on { border-color: var(--navy); color: var(--navy); box-shadow: inset 0 -2px 0 var(--navy); } #mobile-data-container #rhm-ui .rhm-vac-chips .rhm-chip.cero { opacity: .55; } #mobile-data-container #rhm-ui .rhm-vac-chips .rhm-chip.cero .n { background: #f4f5f8; color: var(--faint); } #mobile-data-container #rhm-ui .rhm-hh.peg { position: sticky; top: 0; z-index: 3; background: var(--canvas); padding-top: 8px; padding-bottom: 4px; } #mobile-data-container #rhm-ui .rhm-r.vp .nm .material-symbols-outlined { font-size: 14px; color: var(--warn); vertical-align: -2px; margin-left: 4px; } #mobile-data-container #rhm-ui .rhm-r.vp .hr { grid-column: 3; grid-row: 1; } #mobile-data-container #rhm-ui .rhm-r.vp .l2 { grid-column: 2 / 4; display: flex; align-items: center; gap: 7px; min-width: 0; } #mobile-data-container #rhm-ui .rhm-r.vp .l2 .mm { flex: 0 0 56px; height: 4px; border-radius: 2px; background: var(--hair); overflow: hidden; } #mobile-data-container #rhm-ui .rhm-r.vp .l2 .mm i { display: block; height: 100%; background: var(--navy-500); } #mobile-data-container #rhm-ui .rhm-r.vp .l2 .ref { margin-left: 0; } #mobile-data-container #rhm-ui .rhm-vac-tres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 6px 0 12px; } #mobile-data-container #rhm-ui .rhm-vac-tres > div { border: 1px solid var(--hair); border-left: 3px solid var(--hair-strong); border-radius: 9px; padding: 6px 9px; min-width: 0; } #mobile-data-container #rhm-ui .rhm-vac-tres > div.nav { border-left-color: var(--navy); } #mobile-data-container #rhm-ui .rhm-vac-tres > div.ok { border-left-color: var(--ok); } #mobile-data-container #rhm-ui .rhm-vac-tres .l { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); } #mobile-data-container #rhm-ui .rhm-vac-tres .v { font-size: 18px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-vac-tres .v small { font-size: 10.5px; color: var(--muted); font-weight: 600; } #mobile-data-container #rhm-ui .rhm-vac-tramo { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-vac-tramo > .material-symbols-outlined { color: var(--navy-500); font-size: 20px; flex: none; } #mobile-data-container #rhm-ui .rhm-vac-tramo .t { flex: 1; min-width: 0; } #mobile-data-container #rhm-ui .rhm-vac-tramo .t b { display: block; font-variant-numeric: tabular-nums; } #mobile-data-container #rhm-ui .rhm-vac-tramo .t small { color: var(--muted); font-size: 11.5px; display: block; } #mobile-data-container #rhm-ui .rhm-aviso.mal { background: var(--crit-050); border-color: var(--crit-hair); color: #7a1f1f; } #mobile-data-container #rhm-ui .rhm-aviso.mal b { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-aviso.mal .material-symbols-outlined { color: var(--crit); } #mobile-data-container #rhm-ui .rhm-seg > button { font-size: 12.5px; } /* el puntaje de conducta en la hoja de la persona (lámina 28) */ #mobile-data-container #rhm-ui .cdt-n.ok { color: var(--ok); } #mobile-data-container #rhm-ui .cdt-n.wrn { color: var(--warn); } #mobile-data-container #rhm-ui .cdt-n.neg { color: var(--crit); } /* Horas extra sin pedido (lámina 31, 16/10/2026): Acreditar / Desestimar en Novedades. */ #mobile-data-container #rhm-ui .rhm-hx-r { padding: 10px 12px; border-bottom: 1px solid var(--hair); } #mobile-data-container #rhm-ui .rhm-hx-r:last-child { border-bottom: 0; } #mobile-data-container #rhm-ui .rhm-hx-r b { display: block; font-size: 14px; color: var(--warn); } #mobile-data-container #rhm-ui .rhm-hx-r span { display: block; font-size: 12px; color: var(--muted); margin-top: 1px; } #mobile-data-container #rhm-ui .rhm-hx-r .bs { display: flex; gap: 8px; margin-top: 8px; } #mobile-data-container #rhm-ui .rhm-hx-r .bs .rhm-btn { flex: 1; } #mobile-data-container #rhm-ui .rhm-btn.ok { background: var(--ok); border-color: var(--ok); color: #fff; } #mobile-data-container #rhm-ui .rhm-btn.ok .material-symbols-outlined { color: #fff; }