/* CentralPyme RR.HH. - Portal de Personal
   Los colores y la tipografía definitivos de la marca se aplican en la Etapa 4. */

.itsp-app, .itsp-login {
  --itsp-bg: #F1F5F9;
  --itsp-surface: #E2E8F0;
  --itsp-text: #0F172A;
  --itsp-divider: rgba(15, 23, 42, 0.22);
  --itsp-acento: #6366F1;
  --itsp-acento-100: #EEF2FF;
  --itsp-acento-200: #E0E7FF;
  --itsp-acento-600: #4F46E5;
  --itsp-acento-700: #4338CA;
  --itsp-acento-800: #3730A3;
  --itsp-n200: #E2E8F0;
  --itsp-n400: #94A3B8;
  --itsp-n700: #475569;
  --itsp-n800: #334155;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--itsp-text);
  background: var(--itsp-bg);
  font-size: 14px;
  line-height: 1.5;
}

.itsp-app *, .itsp-login * { box-sizing: border-box; }

/* --- Tipografia --- */
.itsp-h1 { font-size: 44px; font-weight: 900; line-height: 1; letter-spacing: -0.03em; margin: 8px 0 0; }
.itsp-h2 { font-size: 30px; font-weight: 800; line-height: 1.05; letter-spacing: -0.02em; margin: 0; }
.itsp-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--itsp-n700); font-weight: 700; }
.itsp-kicker-claro { color: rgba(255,255,255,0.85); }
.itsp-fuerte { font-weight: 700; }
.itsp-sec { font-size: 12px; color: var(--itsp-n700); }
.itsp-sec2 { color: var(--itsp-n800); }
.itsp-etiqueta { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--itsp-n700); }
.itsp-num { text-align: right; }
.itsp-num-fuerte { font-size: 18px; font-weight: 900; }
.itsp-nota { font-size: 12px; color: var(--itsp-n700); }
.itsp-vacio { color: var(--itsp-n700); padding: 24px 0; }
.itsp-mt { margin-top: 32px; }
.itsp-td-der { text-align: right; }

.itsp-app a { color: var(--itsp-acento-700); text-decoration: none; }
.itsp-app a:hover { color: var(--itsp-acento); text-decoration: underline; }
.itsp-app :focus-visible, .itsp-login :focus-visible { outline: 2px solid var(--itsp-acento); outline-offset: 2px; }

/* --- Barra superior --- */
.itsp-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; padding: 14px 32px; border-bottom: 2px solid var(--itsp-text); }
.itsp-bar-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-width: 0; }
.itsp-bar-marca { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; min-width: 0; }
.itsp-menu-check { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.itsp-menu-btn { display: none; }
.itsp-logo-bar { height: 36px; width: auto; display: block; }
.itsp-bar-sub { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--itsp-n700); padding-left: 16px; border-left: 2px solid var(--itsp-divider); }
.itsp-bar-der { display: flex; align-items: center; gap: 16px 20px; flex-wrap: wrap; min-width: 0; }
.itsp-nav { display: flex; gap: 12px 20px; flex-wrap: wrap; }
.itsp-nav-item { font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; color: var(--itsp-text) !important; }
.itsp-nav-item.is-activo { color: var(--itsp-acento-700) !important; box-shadow: inset 0 -3px 0 var(--itsp-acento); padding-bottom: 3px; }
.itsp-sesion { display: flex; align-items: center; gap: 10px; padding-left: 20px; border-left: 2px solid var(--itsp-divider); flex: none; }
.itsp-sesion-datos { display: flex; flex-direction: column; }
.itsp-sesion-nombre { font-size: 12px; font-weight: 700; }
.itsp-sesion-rol { font-size: 11px; color: var(--itsp-n700); }

/* --- Monogramas --- */
.itsp-mono { width: 34px; height: 34px; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--itsp-n200); border: 2px solid var(--itsp-text); font-size: 12px; font-weight: 800; }
.itsp-mono-oscuro { width: 30px; height: 30px; background: var(--itsp-text); color: var(--itsp-bg); border: 0; }
.itsp-mono-xl { width: 92px; height: 92px; font-size: 30px; font-weight: 900; }
.itsp-foto { width: 34px; height: 34px; flex: none; display: block; object-fit: cover; border: 2px solid var(--itsp-text); }
.itsp-foto.itsp-mono-oscuro { width: 30px; height: 30px; border: 0; }
.itsp-foto.itsp-mono-xl { width: 92px; height: 92px; }
.itsp-foto-campo { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
.itsp-foto-controles { flex: 1; min-width: 0; }
.itsp-foto-controles .itsp-field { margin-bottom: 8px; }
.itsp-foto-campo input[type="file"] { font-family: inherit; font-size: 13px; padding: 9px 10px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); width: 100%; }
.itsp-checkbox { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 12px; color: var(--itsp-n800); }
.itsp-checkbox input { width: auto; }

/* --- Botones --- */
.itsp-btn { display: inline-block; font-family: inherit; font-size: 13px; font-weight: 700; text-align: left; padding: 10px 16px; border: 2px solid var(--itsp-text); background: transparent; color: var(--itsp-text) !important; cursor: pointer; text-decoration: none !important; }
.itsp-btn:hover { background: var(--itsp-acento-100); border-color: var(--itsp-acento-700); color: var(--itsp-acento-700) !important; }
.itsp-btn-pri { background: var(--itsp-acento); border-color: var(--itsp-acento); color: #fff !important; }
.itsp-btn-pri:hover { background: var(--itsp-acento-600); border-color: var(--itsp-acento-600); color: #fff !important; }
.itsp-btn-sec { font-size: 12px; padding: 8px 12px; }
.itsp-btn-peligro { border-color: #b3261e; color: #b3261e !important; background: transparent; }
.itsp-btn-peligro:hover { background: #b3261e; border-color: #b3261e; color: #fff !important; }
.itsp-btn-mini { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; padding: 7px 10px; border-color: var(--itsp-n400); color: var(--itsp-n800) !important; margin-left: 8px; }
.itsp-inline { display: inline-flex; gap: 8px; margin: 0; }
.itsp-acciones { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-start; }

/* --- Etiquetas de estado --- */
.itsp-tag { display: inline-block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; padding: 5px 9px; }
.itsp-tag-borde { border: 2px solid var(--itsp-text); color: var(--itsp-text); }
.itsp-tag-acento { background: var(--itsp-acento-200); color: var(--itsp-acento-800); }
.itsp-tag-neutro { background: var(--itsp-n200); color: var(--itsp-n800); }
.itsp-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }

/* --- Cabeceras y bloques --- */
.itsp-cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; padding: 40px 32px 24px; }
.itsp-cab-simple { align-items: flex-start; }
.itsp-bloque { padding: 32px 32px 56px; }
.itsp-seccion { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--itsp-n700); font-weight: 700; padding-bottom: 12px; border-bottom: 2px solid var(--itsp-text); margin-top: 32px; }
.itsp-seccion:first-child { margin-top: 0; }
.itsp-seccion-cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.itsp-seccion-cab .itsp-seccion { flex: 1; }
.itsp-hr { height: 2px; background: var(--itsp-divider); }
.itsp-volver { display: inline-block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; font-weight: 700; margin-bottom: 16px; }

/* --- Indicadores --- */
.itsp-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 2px solid var(--itsp-text); border-bottom: 2px solid var(--itsp-text); }
.itsp-stat { padding: 20px 32px; border-right: 2px solid var(--itsp-divider); }
.itsp-stat:last-child { border-right: 0; }
.itsp-cifra { font-size: 32px; font-weight: 900; line-height: 1; letter-spacing: -0.02em; }
.itsp-stat-k { font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--itsp-n700); margin-top: 4px; }

/* --- Dos columnas --- */
.itsp-dos-col { display: grid; grid-template-columns: 1fr 1fr; }
.itsp-dos-col > * { padding: 32px; }
.itsp-dos-col-form { gap: 48px; }
.itsp-dos-col-form > * { padding: 0; }
.itsp-col-borde, .itsp-dos-col-linea > *:first-child { border-right: 2px solid var(--itsp-divider); }
.itsp-dos-col-linea > *:first-child { padding-left: 0; }
.itsp-dos-col-linea > *:last-child { padding-right: 0; }

/* --- Filas --- */
.itsp-fila-persona, .itsp-fila-sol { display: flex; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-fila-datos { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.itsp-fila-hito { display: grid; grid-template-columns: 150px 110px 1fr; gap: 24px; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-fila-hito-admin { grid-template-columns: 150px 110px 1fr 120px; align-items: start; }

/* --- Tabla --- */
.itsp-tabla { width: 100%; border-collapse: collapse; font-size: 13px; }
.itsp-tabla th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--itsp-n700); font-weight: 700; padding: 14px 12px 12px; border-bottom: 2px solid var(--itsp-text); }
.itsp-tabla th:first-child, .itsp-tabla td:first-child { padding-left: 0; }
.itsp-tabla td { padding: 14px 12px; border-bottom: 2px solid var(--itsp-divider); vertical-align: middle; }
.itsp-celda-persona { display: flex; align-items: center; gap: 12px; }

/* --- Pestanas --- */
.itsp-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; border-top: 2px solid var(--itsp-text); border-bottom: 2px solid var(--itsp-text); }
.itsp-tab { flex: none; white-space: nowrap; }
.itsp-tab { font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; padding: 16px 20px; color: var(--itsp-n700) !important; }
.itsp-tab.is-activo { color: var(--itsp-acento-700) !important; box-shadow: inset 0 -4px 0 var(--itsp-acento); }

/* --- Ficha --- */
.itsp-ficha-cab { padding: 32px 32px 24px; }
.itsp-ficha-id { display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.itsp-ficha-persona { display: flex; align-items: flex-start; gap: 20px; }
.itsp-ficha-cargo { font-size: 15px; color: var(--itsp-n800); margin-top: 8px; }
.itsp-dl { display: grid; grid-template-columns: 160px 1fr; gap: 16px; padding: 10px 0; border-bottom: 2px solid var(--itsp-n200); }
.itsp-dl-k { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--itsp-n700); }
.itsp-dl-v { font-weight: 500; }

/* --- Trayectoria --- */
.itsp-hito { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 20px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-hito-admin { grid-template-columns: 120px 1fr 120px; align-items: start; }
.itsp-anio { font-size: 22px; font-weight: 900; letter-spacing: -0.02em; color: var(--itsp-acento-700); }
.itsp-hito-cargo { font-size: 16px; font-weight: 700; }
.itsp-hito-nota { color: var(--itsp-n800); max-width: 70ch; margin-top: 4px; }

/* --- Rejillas de datos --- */
.itsp-grid-eval { display: grid; grid-template-columns: 1fr 130px 130px 130px 110px; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-eval-admin { grid-template-columns: 1fr 120px 120px 120px 100px 120px; }
.itsp-grid-doc { display: grid; grid-template-columns: 1fr 180px 120px 110px; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-doc-admin { grid-template-columns: 1fr 160px 120px 110px 120px; }
.itsp-doc-form { margin-bottom: 40px; }
.itsp-doc-campos { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) 170px minmax(0, 1.4fr); gap: 24px; margin-top: 20px; }
.itsp-doc-campos .itsp-field { margin-bottom: 0; }
.itsp-doc-campos input[type="file"] { font-family: inherit; font-size: 13px; padding: 9px 10px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); width: 100%; }
.itsp-doc-pie { margin-top: 20px; }
.itsp-fila-campos { display: grid; grid-template-columns: 130px minmax(0, 1.2fr) minmax(0, 2fr); gap: 24px; margin-top: 20px; }
.itsp-fila-campos .itsp-field { margin-bottom: 0; }
.itsp-fila-campos .itsp-field-ancho { grid-column: auto; }
.itsp-liq-campos { display: grid; grid-template-columns: minmax(0, 2fr) 190px minmax(0, 1.4fr) minmax(0, 1.4fr); gap: 24px; margin-top: 20px; }
.itsp-liq-campos .itsp-field { margin-bottom: 0; }
.itsp-liq-campos input[type="file"] { font-family: inherit; font-size: 13px; padding: 9px 10px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); width: 100%; }
.itsp-bloque-liq { padding-bottom: 0; }
.itsp-grid-liq { display: grid; grid-template-columns: 190px 150px 160px 1fr; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-liq-todas { grid-template-columns: 1fr 190px 140px 170px 120px; }
.itsp-grid-liq-todas.itsp-grid-liq-admin { grid-template-columns: 1fr 170px 130px 150px 110px 120px; }
.itsp-grid-liq-admin { grid-template-columns: 190px 140px 160px 1fr 120px; }
.itsp-grid-liq-head { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; padding-bottom: 12px; }
.itsp-card-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.itsp-card-borrar { flex: none; }
.itsp-grid-aus { display: grid; grid-template-columns: 170px 1fr 110px 130px; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-eq { display: grid; grid-template-columns: 1fr 200px 140px 130px; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-eq-admin { grid-template-columns: 1fr 170px 130px 130px 120px; }
.itsp-eq-campos { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) 170px minmax(0, 1fr); gap: 24px; margin-top: 20px; }
.itsp-eq-campos .itsp-field { margin-bottom: 0; }
.itsp-sol-acciones { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.itsp-grid-sol { display: grid; grid-template-columns: 1fr 150px 220px 100px 120px 200px; gap: 20px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-area { display: grid; grid-template-columns: 220px 110px 1fr 90px; gap: 24px; align-items: center; padding: 18px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-roles { display: grid; grid-template-columns: 1fr 110px 110px 110px; gap: 16px; padding: 14px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-eval-head, .itsp-grid-roles-head, .itsp-grid-crit-head { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; }
.itsp-grid-eval-head, .itsp-grid-roles-head { border-bottom-color: var(--itsp-divider); }

/* --- Hoja 1:1 --- */
.itsp-grid-crit { display: grid; grid-template-columns: 1fr 120px 120px 100px; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-crit-head { padding: 40px 0 12px; border-bottom: 2px solid var(--itsp-text); }
.itsp-grid-crit-head:first-child { padding-top: 0; }
.itsp-nota-input { width: 64px; font-family: inherit; font-size: 14px; font-weight: 700; text-align: right; padding: 8px 10px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); }
.itsp-nota-empresa { border-color: var(--itsp-acento); }
.itsp-nota-fija { font-weight: 700; }
.itsp-ta-empresa { border-color: var(--itsp-acento) !important; }
.itsp-poster-cierre { background: var(--itsp-acento); color: #fff; padding: 32px; display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.itsp-poster-reco { font-size: 32px; font-weight: 900; line-height: 1.05; letter-spacing: -0.02em; max-width: 40ch; margin-top: 8px; }
.itsp-poster-nota { font-size: 64px; font-weight: 900; line-height: 1; letter-spacing: -0.03em; }

/* --- Tarjetas --- */
.itsp-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.itsp-card { background: var(--itsp-surface); border: 2px solid var(--itsp-divider); padding: 20px; display: flex; flex-direction: column; gap: 8px; min-height: 150px; }
.itsp-card-anio { font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; font-weight: 700; color: var(--itsp-acento-700); }
.itsp-card-titulo { font-size: 17px; font-weight: 800; line-height: 1.15; letter-spacing: -0.01em; }
.itsp-card-pie { margin-top: auto; font-size: 12px; color: var(--itsp-n700); }

/* --- Barras --- */
.itsp-barra-fondo { background: var(--itsp-n200); }
.itsp-barra { height: 10px; background: var(--itsp-acento); }

/* --- Formularios --- */
.itsp-form { margin: 0; }
.itsp-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.itsp-field > span { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; }
.itsp-field input, .itsp-field select, .itsp-field textarea { font-family: inherit; font-size: 14px; padding: 11px 12px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); width: 100%; }
.itsp-field textarea { resize: vertical; }
.itsp-field input:disabled, .itsp-field textarea:disabled, .itsp-field select:disabled { opacity: 0.45; }
.itsp-form-pie { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 20px; margin-top: 20px; border-top: 2px solid var(--itsp-text); }
.itsp-bloque-clave { border-top: 2px solid var(--itsp-text); padding-top: 32px; }
.itsp-nota-bloque { margin: 16px 0 20px; max-width: 60ch; }
.itsp-clave-campos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: 720px; }
.itsp-clave-campos .itsp-field { margin-bottom: 0; }
.itsp-buscador { display: flex; gap: 8px; margin: 0; }
.itsp-buscador input { font-family: inherit; font-size: 13px; padding: 10px 12px; width: 280px; max-width: 100%; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); }
.itsp-vac { display: grid; grid-template-columns: 320px 1fr; }
.itsp-vac-form { padding: 32px; border-right: 2px solid var(--itsp-divider); }
.itsp-vac-lista { padding: 32px 32px 56px; }

/* --- Avisos --- */
.itsp-aviso { background: var(--itsp-acento-100); border-top: 2px solid var(--itsp-acento); border-bottom: 2px solid var(--itsp-acento); padding: 12px 32px; font-size: 12px; color: var(--itsp-acento-800); }
.itsp-aviso-error { background: #fdecea; border-color: #b3261e; color: #7c1d16; }

/* --- Login --- */
.itsp-login { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; }
.itsp-login-poster { background: var(--itsp-acento); color: #fff; padding: 48px; display: flex; flex-direction: column; justify-content: space-between; gap: 48px; }
.itsp-poster-marca { font-size: 20px; font-weight: 900; letter-spacing: -0.01em; }
.itsp-poster-dominio { font-size: 12px; text-transform: uppercase; letter-spacing: 0.14em; opacity: 0.85; margin-top: 4px; }
.itsp-poster-titular { font-size: 56px; font-weight: 900; line-height: 0.95; letter-spacing: -0.03em; text-wrap: pretty; }
.itsp-poster-pie { font-size: 13px; opacity: 0.9; max-width: 34ch; }
.itsp-login-form { padding: 48px; display: flex; align-items: center; }
.itsp-login-col { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 16px; }
.itsp-logo-login { height: 56px; width: auto; display: block; align-self: flex-start; }
.itsp-login .login-username, .itsp-login .login-password { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.itsp-login label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; }
.itsp-login input[type="text"], .itsp-login input[type="password"] { font-family: inherit; font-size: 14px; padding: 11px 12px; border: 2px solid var(--itsp-n400); background: #fff; color: var(--itsp-text); width: 100%; }
.itsp-login .login-remember { font-size: 12px; margin-bottom: 16px; }
.itsp-login .login-remember label { text-transform: none; letter-spacing: 0; font-weight: 400; }
.itsp-login #wp-submit { font-family: inherit; font-size: 14px; font-weight: 700; text-align: left; padding: 13px 16px; border: 2px solid var(--itsp-acento); background: var(--itsp-acento); color: #fff; cursor: pointer; width: 100%; }
.itsp-login #wp-submit:hover { background: var(--itsp-acento-600); border-color: var(--itsp-acento-600); }

/* --- Home: informativos y paneles de resumen --- */
.itsp-bloque-info { padding-bottom: 0; }
.itsp-info {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  padding: 22px 24px; margin-top: 16px;
  border: 2px solid var(--itsp-divider); background: #fff;
}
.itsp-info-destacado { border-color: var(--itsp-acento); box-shadow: inset 5px 0 0 var(--itsp-acento); padding-left: 28px; background: var(--itsp-acento-100); }
.itsp-info-txt { min-width: 0; }
.itsp-info-meta { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; }
.itsp-info-flag { background: var(--itsp-acento); color: #fff; padding: 2px 7px; margin-left: 8px; letter-spacing: 0.08em; }
.itsp-info-titulo { font-size: 20px; font-weight: 800; letter-spacing: -0.01em; line-height: 1.2; margin: 6px 0; }
.itsp-info-cuerpo { color: var(--itsp-n800); max-width: 78ch; }
.itsp-info-borrar { flex: none; }
.itsp-info-form { border-top: 2px solid var(--itsp-text); margin-top: 32px; padding-top: 4px; padding-bottom: 32px; }
.itsp-info-campos { display: grid; grid-template-columns: minmax(0, 2fr) 190px; gap: 24px; margin-top: 20px; }
.itsp-info-campos .itsp-field { margin-bottom: 16px; }

.itsp-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; background: var(--itsp-divider); }
.itsp-panel { background: var(--itsp-bg); padding: 24px 28px 28px; min-width: 0; }
.itsp-panel-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid var(--itsp-text); margin-bottom: 4px; }
.itsp-panel-titulo { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--itsp-n700); font-weight: 700; }
.itsp-panel-link { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; flex: none; }
.itsp-panel-nota { font-size: 12px; color: var(--itsp-n700); margin: 14px 0 0; }
.itsp-mini-fila { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 2px solid var(--itsp-n200); }
.itsp-mini-txt { display: flex; flex-direction: column; flex: 1; min-width: 0; font-size: 13px; font-weight: 600; }
.itsp-mini-sub { display: block; font-size: 11px; font-weight: 400; color: var(--itsp-n700); margin-top: 2px; }
.itsp-mini-dato { font-size: 13px; font-weight: 700; flex: none; }
.itsp-mini-atrasada .itsp-mini-txt { color: var(--itsp-acento-800); }
.itsp-eval-nota { display: flex; align-items: baseline; gap: 8px; padding: 14px 0 10px; }
.itsp-eval-cifra { font-size: 42px; font-weight: 900; line-height: 1; letter-spacing: -0.03em; color: var(--itsp-acento-700); }
.itsp-eval-escala { font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; }

/* --- Horas extras --- */
.itsp-horas { display: grid; grid-template-columns: 320px 1fr; }
.itsp-horas-form { padding: 32px; border-right: 2px solid var(--itsp-divider); }
.itsp-horas-lista { padding: 32px 32px 56px; }
.itsp-grid-horas { display: grid; grid-template-columns: 130px 1fr 90px 120px 180px; gap: 20px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-horas-admin { grid-template-columns: 1fr 120px 1.4fr 90px 110px 200px; }
.itsp-grid-horas-head { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; padding-bottom: 12px; }
.itsp-horario { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* --- Tareas --- */
.itsp-tarea-campos { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 2fr) 170px 140px; gap: 24px; margin-top: 20px; }
.itsp-tarea-campos .itsp-field { margin-bottom: 0; }
.itsp-grid-tarea { display: grid; grid-template-columns: 1fr 110px 130px 220px; gap: 20px; align-items: center; padding: 16px 0; border-bottom: 2px solid var(--itsp-divider); }
.itsp-grid-tarea-eq { grid-template-columns: 190px 1fr 110px 130px 220px; }
.itsp-tarea-titulo { font-weight: 700; }
.itsp-tarea-lista .itsp-tarea-titulo { text-decoration: line-through; color: var(--itsp-n700); }

/* --- Organigrama y directorio --- */
.itsp-arbol, .itsp-ramas { list-style: none; margin: 0; padding: 0; }
.itsp-arbol { margin-top: 20px; }
.itsp-ramas { margin-left: 20px; padding-left: 24px; border-left: 2px solid var(--itsp-divider); }
.itsp-rama { position: relative; padding: 6px 0; }
.itsp-ramas > .itsp-rama::before { content: ""; position: absolute; left: -24px; top: 32px; width: 22px; height: 2px; background: var(--itsp-divider); }
.itsp-nodo { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 2px solid var(--itsp-divider); background: var(--itsp-bg); text-decoration: none !important; color: var(--itsp-text) !important; min-width: 0; }
a.itsp-nodo:hover { border-color: var(--itsp-acento); background: var(--itsp-acento-100); }
.itsp-nodo-jefe { border-color: var(--itsp-text); }
.itsp-nodo-propio { box-shadow: inset 4px 0 0 var(--itsp-acento); }
.itsp-nodo-foto { width: 40px; height: 40px; flex: none; font-size: 13px; }
.itsp-nodo-datos { display: flex; flex-direction: column; min-width: 0; }
.itsp-nodo-nombre { font-weight: 700; font-size: 14px; }
.itsp-nodo-cargo { font-size: 12px; color: var(--itsp-n700); }
.itsp-nodo-yo { font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-acento-700); }
.itsp-dir-area { margin-top: 28px; }
.itsp-dir-titulo { display: flex; align-items: center; gap: 10px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; color: var(--itsp-n700); padding-bottom: 10px; }
.itsp-dir-cuenta { background: var(--itsp-n200); color: var(--itsp-n800); padding: 2px 8px; font-size: 11px; }
.itsp-dir-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }

/* --- Margen lateral unico: se ajusta por tamano de pantalla ---
   Las reglas van dobladas bajo .itsp-app para ganarle a cualquier hoja del tema. */
.itsp-app { --itsp-pad: clamp(20px, 4vw, 72px); overflow-x: hidden; }
.itsp-app .itsp-bar,
.itsp-app .itsp-cab,
.itsp-app .itsp-bloque,
.itsp-app .itsp-ficha-cab,
.itsp-app .itsp-tabs,
.itsp-app .itsp-aviso,
.itsp-app .itsp-poster-cierre,
.itsp-app .itsp-vac-form,
.itsp-app .itsp-vac-lista,
.itsp-app .itsp-horas-form,
.itsp-app .itsp-horas-lista,
.itsp-app .itsp-stat,
.itsp-app .itsp-dos-col > * {
  padding-left: var(--itsp-pad);
  padding-right: var(--itsp-pad);
}
.itsp-app .itsp-dos-col-linea > *:first-child { padding-left: 0; }
.itsp-app .itsp-dos-col-linea > *:last-child { padding-right: 0; }

/* Nada puede desbordar el ancho de la pantalla */
.itsp-app img, .itsp-app input, .itsp-app select, .itsp-app textarea, .itsp-app table { max-width: 100%; }
.itsp-app { overflow-wrap: break-word; }
.itsp-fuerte, .itsp-dl-v, .itsp-hito-nota, .itsp-card-titulo { min-width: 0; }

/* --- Responsive --- */
@media (min-width: 1500px) {
  .itsp-app { --itsp-pad: 72px; }
}
@media (max-width: 1200px) {
  .itsp-app { --itsp-pad: 32px; }
  .itsp-tarea-campos { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .itsp-grid-horas-admin { grid-template-columns: 1fr 110px 1fr 80px 100px; }
  .itsp-grid-horas-admin > *:last-child { grid-column: 1 / -1; text-align: left; }
  .itsp-grid-tarea, .itsp-grid-tarea-eq { grid-template-columns: 1fr 110px 120px; }
  .itsp-grid-tarea > *:last-child, .itsp-grid-tarea-eq > *:last-child { grid-column: 1 / -1; text-align: left; }
  .itsp-horas { grid-template-columns: 280px 1fr; }
  .itsp-grid-sol { grid-template-columns: 1fr 130px 200px 90px 110px; }
  .itsp-grid-sol > *:last-child { grid-column: 1 / -1; text-align: left; }
  .itsp-grid-liq-todas, .itsp-grid-liq-todas.itsp-grid-liq-admin { grid-template-columns: 1fr 150px 120px 130px; }
  .itsp-grid-liq-todas > *:nth-child(n + 5) { grid-column: span 2; text-align: left; }
}
@media (max-width: 900px) {
  .itsp-app { --itsp-pad: 20px; font-size: 15px; }
  .itsp-h1 { font-size: 30px; }
  .itsp-h2 { font-size: 24px; }
  .itsp-cifra { font-size: 26px; }
  .itsp-poster-titular { font-size: 36px; }
  .itsp-login { grid-template-columns: 1fr; min-height: 0; }
  .itsp-login-poster { gap: 24px; padding: 28px 20px; }
  .itsp-login-form { padding: 28px 20px 44px; }
  .itsp-login-col { max-width: none; }

  /* Barra superior: logo + boton de menu; el resto se despliega al tocarlo */
  .itsp-bar { flex-direction: column; align-items: stretch; gap: 0; padding-top: 12px; padding-bottom: 12px; }
  .itsp-bar-sub { display: none; }
  .itsp-logo-bar { height: 24px; width: 94px; }

  .itsp-menu-btn {
    display: inline-flex; align-items: center; gap: 10px;
    font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700;
    padding: 10px 14px; min-height: 44px; flex: none;
    border: 2px solid var(--itsp-text); background: transparent; color: var(--itsp-text);
    cursor: pointer; user-select: none;
  }
  .itsp-hamb { position: relative; display: block; width: 18px; height: 2px; background: currentColor; }
  .itsp-hamb::before, .itsp-hamb::after { content: ""; position: absolute; left: 0; width: 18px; height: 2px; background: currentColor; }
  .itsp-hamb::before { top: -6px; }
  .itsp-hamb::after { top: 6px; }
  .itsp-menu-cerrar { display: none; }

  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-menu-btn { background: var(--itsp-acento); border-color: var(--itsp-acento); color: #fff; }
  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-hamb { background: transparent; }
  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-hamb::before { top: 0; transform: rotate(45deg); }
  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-hamb::after { top: 0; transform: rotate(-45deg); }
  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-menu-abrir { display: none; }
  .itsp-menu-check:checked ~ .itsp-bar-top .itsp-menu-cerrar { display: inline; }
  .itsp-menu-check:focus-visible ~ .itsp-bar-top .itsp-menu-btn { outline: 2px solid var(--itsp-acento); outline-offset: 2px; }

  .itsp-bar-der { display: none; flex-direction: column; align-items: stretch; gap: 0; }
  .itsp-menu-check:checked ~ .itsp-bar-der { display: flex; }
  .itsp-nav { gap: 0; flex-direction: column; margin-top: 12px; border-top: 2px solid var(--itsp-text); }
  .itsp-nav-item { padding: 14px 0; border-bottom: 2px solid var(--itsp-divider); }
  .itsp-nav-item.is-activo { padding: 14px 0 14px 12px; box-shadow: inset 3px 0 0 var(--itsp-acento); }
  .itsp-sesion { padding: 14px 0 0; border-left: 0; }
  .itsp-sesion-datos { flex: 1; min-width: 0; }
  .itsp-btn-mini { margin-left: auto; }

  /* Cabeceras y acciones */
  .itsp-cab, .itsp-ficha-cab, .itsp-ficha-id, .itsp-seccion-cab { flex-direction: column; align-items: stretch; gap: 16px; }
  .itsp-acciones, .itsp-inline { width: 100%; flex-wrap: wrap; }
  .itsp-acciones .itsp-btn, .itsp-inline .itsp-btn { flex: 1 1 auto; justify-content: flex-start; }
  .itsp-ficha-persona { gap: 14px; }
  .itsp-buscador { flex-direction: column; }
  .itsp-buscador input { width: 100%; }

  /* Dos columnas y rejillas: una sola columna */
  .itsp-dos-col, .itsp-vac, .itsp-horas, .itsp-home-grid { grid-template-columns: 1fr; }
  .itsp-clave-campos, .itsp-doc-campos, .itsp-eq-campos, .itsp-fila-campos, .itsp-liq-campos,
  .itsp-info-campos, .itsp-tarea-campos, .itsp-horario { grid-template-columns: 1fr; gap: 16px; }
  .itsp-horas-form { border-right: 0; border-bottom: 2px solid var(--itsp-divider); }
  .itsp-panel { padding: 22px 0 24px; }
  .itsp-home-grid { gap: 0; background: transparent; }
  .itsp-panel + .itsp-panel { border-top: 2px solid var(--itsp-divider); }
  .itsp-info { flex-direction: column; gap: 14px; padding: 18px; }
  .itsp-info-destacado { padding-left: 20px; }
  .itsp-info-titulo { font-size: 18px; }
  .itsp-eval-cifra { font-size: 36px; }
  .itsp-dos-col-linea > *:first-child, .itsp-col-borde, .itsp-vac-form { border-right: 0; border-bottom: 2px solid var(--itsp-divider); }
  .itsp-dos-col > *, .itsp-dos-col-linea > *:first-child, .itsp-dos-col-linea > *:last-child { padding: 24px 0; }
  .itsp-stats { grid-template-columns: 1fr 1fr; }
  .itsp-stat { border-bottom: 2px solid var(--itsp-divider); padding-top: 16px; padding-bottom: 16px; }
  .itsp-stat:nth-child(even) { border-right: 0; }
  .itsp-cards { grid-template-columns: 1fr; }

  .itsp-dl, .itsp-hito, .itsp-hito-admin, .itsp-fila-hito, .itsp-fila-hito-admin,
  .itsp-grid-eval, .itsp-grid-eval-admin, .itsp-grid-doc, .itsp-grid-doc-admin,
  .itsp-grid-eq, .itsp-grid-eq-admin, .itsp-grid-aus, .itsp-grid-sol, .itsp-grid-area,
  .itsp-grid-roles, .itsp-grid-liq, .itsp-grid-liq-todas, .itsp-grid-liq-admin,
  .itsp-grid-liq-todas.itsp-grid-liq-admin, .itsp-grid-horas, .itsp-grid-horas-admin,
  .itsp-grid-tarea, .itsp-grid-tarea-eq {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 14px 0;
  }
  .itsp-grid-liq-todas > *:nth-child(n + 5) { grid-column: auto; }
  .itsp-grid-eval-head, .itsp-grid-roles-head, .itsp-grid-liq-head, .itsp-grid-horas-head { display: none; }
  .itsp-dl-k { padding-top: 2px; }
  .itsp-num, .itsp-td-der { text-align: left; }
  .itsp-sol-acciones { justify-content: flex-start; }

  /* Hoja 1:1: criterio arriba, las dos notas lado a lado con su rotulo */
  .itsp-grid-crit { grid-template-columns: 1fr 1fr; gap: 10px 16px; padding: 18px 0; align-items: start; }
  .itsp-grid-crit > *:first-child { grid-column: 1 / -1; font-weight: 700; }
  .itsp-grid-crit > *:nth-child(2)::before { content: "Autoevaluación"; }
  .itsp-grid-crit > *:nth-child(3)::before { content: "Nota empresa"; }
  .itsp-grid-crit > *:nth-child(4)::before { content: "Brecha"; }
  .itsp-grid-crit > *:nth-child(n + 2)::before { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--itsp-n700); font-weight: 700; margin-bottom: 4px; }
  .itsp-grid-crit-head { display: none; }
  .itsp-nota-input { width: 100%; text-align: left; min-height: 44px; }
  .itsp-poster-cierre { flex-direction: column; align-items: flex-start; gap: 20px; padding-top: 28px; padding-bottom: 28px; }
  .itsp-poster-nota { font-size: 44px; }
  .itsp-poster-reco { font-size: 24px; }

  /* Fotos y retratos */
  .itsp-mono-xl, .itsp-foto.itsp-mono-xl { width: 72px; height: 72px; font-size: 24px; }
  .itsp-ramas { margin-left: 12px; padding-left: 16px; }
  .itsp-ramas > .itsp-rama::before { left: -16px; top: 28px; width: 14px; }
  .itsp-dir-grid { grid-template-columns: 1fr; }
  .itsp-foto-campo { flex-direction: column; gap: 12px; }

  /* Controles con area tactil suficiente */
  .itsp-btn { min-height: 44px; display: inline-flex; align-items: center; }
  .itsp-btn-mini, .itsp-btn-sec { min-height: 40px; }
  .itsp-field input, .itsp-field select, .itsp-field textarea { min-height: 44px; font-size: 15px; }
  .itsp-checkbox input { width: 20px; height: 20px; }

  /* Tabla de personal como tarjetas, con el rotulo de cada dato */
  .itsp-tabla thead { display: none; }
  .itsp-tabla, .itsp-tabla tbody, .itsp-tabla tr, .itsp-tabla td { display: block; width: 100%; }
  .itsp-tabla tr { border-bottom: 2px solid var(--itsp-text); padding: 16px 0; }
  .itsp-tabla td { border: 0; padding: 3px 0; }
  .itsp-tabla td[data-label]::before { content: attr(data-label) ": "; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--itsp-n700); font-weight: 700; }
  .itsp-tabla td:first-child { padding-bottom: 10px; }
  .itsp-tabla td:last-child { padding-top: 12px; }
  .itsp-tabla td:last-child .itsp-btn { width: 100%; }

  /* Pestanas de la ficha: deslizables en una sola linea */
  .itsp-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .itsp-tab { padding: 14px 14px; white-space: nowrap; flex: none; }
}

@media (max-width: 520px) {
  .itsp-app { --itsp-pad: 16px; }
  .itsp-h1 { font-size: 26px; }
  .itsp-poster-titular { font-size: 30px; }
  .itsp-stats { grid-template-columns: 1fr; }
  .itsp-stat { border-right: 0; }
  .itsp-grid-crit { grid-template-columns: 1fr; }
  .itsp-poster-nota { font-size: 36px; }
  .itsp-acciones .itsp-btn, .itsp-inline .itsp-btn { flex: 1 1 100%; }
}