/* Estilos propios de hrm sobre la plantilla SBAdmin-Arquitect (public/lib/sbadmin/main.css).
   Solo lo que la plantilla no trae: marca Complement HRM y pantallas de acceso. */

/* Logo del header (reemplaza el logo de la plantilla) */
.app-header__logo .hrm-logo{display:flex;align-items:center;gap:.5rem;text-decoration:none;}
.app-header__logo .hrm-logo img{height:32px;width:auto;}
.app-header__logo .hrm-logo span{font-weight:800;color:#3f6ad8;letter-spacing:.04em;}
.closed-sidebar .app-header__logo .hrm-logo span{display:none;}

.hrm-corp{font-weight:700;color:#495057;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40vw;}
.hrm-corp i{color:#3f6ad8;font-size:1.2rem;vertical-align:middle;}
.hrm-avatar{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;
	background:#3f6ad8;color:#fff;font-weight:700;}
.app-header .dropdown-menu form .dropdown-item{cursor:pointer;}

/* Pantallas de acceso (login, cambio de clave, corporacion no encontrada) */
/* Pantallas de acceso (login, olvide, restablecer, cambiar clave): dos paneles -- marca a la izquierda,
   formulario a la derecha; en celular la marca queda como franja arriba. Vista comun: login/marca.php */
.hrm-acceso{min-height:100vh;padding:0;background:#f3f5fa !important;}
.hrm-acceso .app-login-box{width:100%;max-width:none;min-height:100vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);}
.hrm-acceso .hrm-marca{position:relative;overflow:hidden;color:#fff;padding:48px 56px;display:flex;flex-direction:column;justify-content:space-between;
	background:radial-gradient(circle at 85% 12%,rgba(255,255,255,.14) 0,rgba(255,255,255,0) 32%),radial-gradient(circle at 8% 92%,rgba(255,255,255,.10) 0,rgba(255,255,255,0) 38%),linear-gradient(140deg,#1d3480 0%,#3f6ad8 55%,#7048c9 100%);}
.hrm-acceso .hrm-marca-logo{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.15rem;}
.hrm-acceso .hrm-marca-logo img{height:44px;width:44px;object-fit:contain;background:#fff;border-radius:12px;padding:6px;}
.hrm-acceso .hrm-marca-centro{max-width:460px;}
.hrm-acceso .hrm-marca-etiqueta{text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;opacity:.8;margin-bottom:.35rem;}
.hrm-acceso .hrm-marca-corp{font-size:2.3rem;font-weight:700;line-height:1.15;margin-bottom:1rem;}
.hrm-acceso .hrm-marca-lema{font-size:1.05rem;opacity:.9;margin-bottom:1.6rem;}
.hrm-acceso .hrm-marca-puntos{list-style:none;padding:0;margin:0;}
.hrm-acceso .hrm-marca-puntos li{display:flex;align-items:center;gap:12px;margin-bottom:.8rem;font-size:.95rem;}
.hrm-acceso .hrm-marca-puntos i{width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.16);display:inline-flex;align-items:center;justify-content:center;}
.hrm-acceso .hrm-marca-pie{font-size:.8rem;opacity:.75;}
.hrm-acceso .modal-dialog{align-self:center;justify-self:center;width:100%;max-width:430px;margin:32px 24px;}
.hrm-acceso .modal-content{border:0;border-radius:16px;box-shadow:0 10px 40px rgba(29,52,128,.12);}
.hrm-acceso .modal-body{padding:2rem 2rem .5rem;}
.hrm-acceso .modal-body h5{font-size:1.45rem;font-weight:700;color:#1f2a44;}
.hrm-acceso .modal-footer{background:#fff;border-top:0;padding:1rem 2rem 2rem;border-radius:0 0 16px 16px;}
.hrm-acceso .form-control{height:46px;border-radius:10px;}
.hrm-acceso .input-group .form-control{border-top-right-radius:0;border-bottom-right-radius:0;}
.hrm-acceso .input-group .btn{border-top-right-radius:10px;border-bottom-right-radius:10px;}
.hrm-acceso .btn-lg{border-radius:10px;font-weight:600;}
.hrm-acceso .ayuda{font-size:.8rem;color:#6c757d;}
@media (max-width: 991.98px){
	.hrm-acceso .app-login-box{grid-template-columns:1fr;grid-template-rows:auto 1fr;}
	.hrm-acceso .hrm-marca{padding:22px 20px;}
	.hrm-acceso .hrm-marca-corp{font-size:1.4rem;margin-bottom:0;}
	.hrm-acceso .hrm-marca-lema,.hrm-acceso .hrm-marca-puntos,.hrm-acceso .hrm-marca-pie{display:none;}
	.hrm-acceso .hrm-marca-centro{margin-top:14px;}
	.hrm-acceso .modal-dialog{align-self:start;margin:20px 16px !important;max-width:none;width:auto !important;}
	.hrm-acceso .modal-body{padding:1.5rem 1.25rem .25rem;}
	.hrm-acceso .modal-footer{padding:1rem 1.25rem 1.5rem;}
}

/* Ojito de contraseña (public/js/hrm-clave.js) */
.hrm-ojito{min-width:44px;}
.hrm-ojito .fa{margin-top:0;}

/* Foto de perfil */
.hrm-avatar-foto{width:38px;height:38px;object-fit:cover;}
.hrm-foto-perfil{width:110px;height:110px;font-size:2.4rem;object-fit:cover;}

/* Barra de MODO SOPORTE: fija ARRIBA de la cabecera (no en medio del contenido). La cabecera, el
   menu lateral y el contenido de la plantilla estan calculados para 60px desde arriba: con la barra
   se corren exactamente su alto (40px) para no encimarse. */
.hrm-barra-soporte{position:fixed;top:0;left:0;right:0;height:40px;z-index:1050;display:flex;align-items:center;
	justify-content:space-between;gap:.75rem;padding:0 1rem;background:#16aaff;color:#fff;font-size:.85rem;
	box-shadow:0 2px 6px rgba(0,0,0,.15);}
.hrm-barra-soporte__texto{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hrm-barra-soporte .btn{padding:.15rem .6rem;}
body.hrm-con-soporte .app-header{top:40px;}
body.hrm-con-soporte .app-main{padding-top:100px;}
body.hrm-con-soporte .app-sidebar{height:calc(100% - 40px);}

/* Select2 con el alto de los .form-control de la plantilla */
.select2-container .select2-selection--single{height:calc(2.25rem + 2px);border-color:#ced4da;}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:2.25rem;}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:2.25rem;}

/* Menu lateral con scroll propio (2026-09-29): SBAdmin solo inicia PerfectScrollbar en el menu si la
   pagina tiene algun .scrollbar-container, y su CSS fija overflow:hidden !important -- con un menu
   largo las ultimas opciones quedaban inalcanzables. Scroll nativo, debajo del header (60px). */
.app-sidebar .scrollbar-sidebar{position:absolute !important;top:60px;bottom:0;left:0;right:0;height:auto !important;overflow-y:auto !important;overflow-x:hidden !important;}
body.hrm-con-soporte .app-sidebar .scrollbar-sidebar{top:60px;}

/* DataTables alinea a la derecha las columnas que ordena como numero/fecha; .hrm-izq las deja a la izquierda */
table.hrm-tabla th.hrm-izq, table.hrm-tabla td.hrm-izq{text-align:left !important;}

/* Ficha del trabajador en solo lectura: titulo de seccion dentro de una tarjeta (datos laborales) */
.hrm-ficha-titulo{font-size:.8rem;font-weight:700;text-transform:uppercase;color:#3f6ad8;border-bottom:1px solid #e9ecef;padding-bottom:.25rem;margin:.5rem 0 .6rem;}
.hrm-dato{word-break:break-word;}

/* Ventana de captura: foto con la camara y firma dibujada (public/js/hrm-captura.js) */
.hrm-captura-fondo{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1050;display:flex;align-items:center;justify-content:center;padding:16px;}
.hrm-captura-caja{background:#fff;border-radius:8px;max-width:720px;width:100%;padding:16px;box-shadow:0 8px 30px rgba(0,0,0,.3);}
.hrm-captura-titulo{font-weight:700;font-size:1.1rem;margin-bottom:10px;}
.hrm-captura-video{width:100%;max-height:60vh;background:#000;border-radius:6px;}
.hrm-captura-firma{width:100%;height:auto;aspect-ratio:3/1;border:1px dashed #adb5bd;border-radius:6px;touch-action:none;cursor:crosshair;background:#fff;}
.hrm-captura-botones{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;margin-top:12px;}

/* Editor de plantillas (Quill) y documentos generados (contratos) */
.hrm-editor { min-height: 420px; background: #fff; font-size: .95rem; }
.hrm-editor .ql-editor { min-height: 400px; }
.hrm-variables .btn { font-family: monospace; font-size: .72rem; }
.hrm-documento { font-size: .92rem; line-height: 1.55; }
.hrm-documento .ql-align-center { text-align: center; }
.hrm-documento .ql-align-right { text-align: right; }
.hrm-documento .ql-align-justify { text-align: justify; }
.hrm-documento .ql-indent-1 { padding-left: 2em; } .hrm-documento .ql-indent-2 { padding-left: 4em; } .hrm-documento .ql-indent-3 { padding-left: 6em; }
.hrm-documento .falta { background: #fff3cd; color: #b02a37; font-weight: 600; padding: 0 .2em; }
mark.hrm-var { background: #e7f0ff; color: #3f6ad8; padding: 0 .2em; border-radius: .2em; font-family: monospace; font-size: .85em; }
body.hrm-firma-publica { background: #f1f4f6; }
.hrm-documento h1 { font-size: 1.4rem; } .hrm-documento h2 { font-size: 1.25rem; } .hrm-documento h3 { font-size: 1.1rem; }
.hrm-editor .ql-editor p { margin-bottom: .6em; }

/* Orden del menu (super-admin) */
.hrm-menu-asa { cursor: move; display: flex; align-items: center; }
.hrm-menu-item { cursor: move; }
.hrm-arrastrando { opacity: .45; }
/* Editor de plantillas de correo: misma letra y espaciado que el correo (MotorCorreos) */
.hrm-editor-correo .ql-editor { font-family: Arial, Helvetica, sans-serif; font-size: 15px; line-height: 1.55; color: #333; }
.hrm-editor-correo .ql-editor p { margin: 0 0 14px; }
.hrm-editor-correo .ql-editor h2 { font-size: 21px; margin: 0 0 16px; color: #222; }
.hrm-editor-correo .ql-editor h1 { font-size: 30px; letter-spacing: 6px; color: #222; }
.hrm-kpi { transition: box-shadow .15s; } .hrm-kpi:hover { box-shadow: 0 .3rem 1rem rgba(63,106,216,.18); }

.hrm-editor-simple { background: #fff; font-size: .95rem; }
.hrm-editor-simple .ql-editor { min-height: 130px; }
.hrm-instrucciones p { margin-bottom: .5rem; }

/* Campana de notificaciones del encabezado */
.hrm-campana { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: #495057; margin-right: .6rem; }
.hrm-campana .pe-7s-bell { font-size: 1.7rem; font-weight: bold; }
.hrm-campana-n { position: absolute; top: -2px; right: -4px; font-size: .62rem; line-height: 1; padding: .28rem .38rem; }
.hrm-campana-menu { min-width: 320px; max-width: 92vw; padding-bottom: .3rem; }
.hrm-noti { display: flex; align-items: flex-start; gap: .65rem; white-space: normal; padding: .6rem 1rem; border-bottom: 1px solid #f1f3f5; }
.hrm-noti-icono { margin-top: .2rem; color: #3f6ad8; width: 1.1rem; text-align: center; }

/* Numerito rojo de pendientes en el menu lateral (items y grupos) */
.vertical-nav-menu li > a{position:relative}
.vertical-nav-menu .hrm-menu-n{position:absolute;float:none;right:34px;top:50%;margin:0;transform:translateY(-50%);font-size:.68rem;line-height:1.1;min-width:1.35rem;padding:.28rem .4rem}
.vertical-nav-menu ul .hrm-menu-n{right:10px}
/* el sobre de comunicados usa el mismo icono grande que la campana */
.hrm-campana .pe-7s-mail { font-size: 1.7rem; font-weight: bold; }

/* una tabla ancha (reportes) no debe ensanchar la pagina: el area principal puede encogerse y la tabla desplaza dentro de su .table-responsive */
.app-main__outer{min-width:0}