/**
 * Usuarios — estilos del editor de empleados.
 * Hereda gxc-panel del CSS base.
 */

/* Ícono de nav 'users' */
.gxc-nav__icon--users {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

/* Tarjeta de horario laboral */
.usu-horario-bar {
	background: linear-gradient(135deg, #f0f9ff 0%, #fef3c7 100%);
	border: 1px solid #fcd34d;
	border-radius: 12px;
	padding: 16px 20px;
	margin-bottom: 18px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}
.usu-horario-bar__title {
	font-weight: 600;
	color: #78350f;
}
.usu-horario-bar__hint {
	display: block;
	font-size: 12px;
	font-weight: 400;
	color: #92400e;
	margin-top: 2px;
}
.usu-horario-bar__controls {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}
.usu-horario-bar__controls label {
	display: flex;
	flex-direction: column;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .3px;

	color: #78350f;
}
.usu-horario-bar__controls input[type="time"] {
	margin-top: 4px;
	padding: 6px 10px;
	border: 1px solid #fcd34d;
	border-radius: 6px;
	background: #fff;
	font-size: 14px;
}

/* Tabla de usuarios */
#usu-table .usu-pin {
	font-family: ui-monospace, "SF Mono", Menlo, monospace;
	font-weight: 700;
	letter-spacing: 1.2px;
	color: #0f172a;
}
#usu-table .usu-rol--dueno {
	display: inline-block;
	padding: 2px 9px;
	background: #1e293b;
	color: #fff;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .3px;
}
#usu-table .usu-rol--operario {
	display: inline-block;
	padding: 2px 9px;
	background: #e2e8f0;
	color: #334155;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .3px;
}

/* Estado pill */
.usu-state-pill {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .3px;
}
.usu-state-pill--ok           { background: #dcfce7; color: #166534; }
.usu-state-pill--inactivo     { background: #f1f5f9; color: #475569; }
.usu-state-pill--bloqueado    { background: #fee2e2; color: #991b1b; }
.usu-state-pill--temp         { background: #ddd6fe; color: #5b21b6; }
.usu-state-pill--fuera        { background: #fef3c7; color: #92400e; }

/* Acciones por fila */
.usu-actions {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}
.usu-actions button {
	padding: 4px 10px;
	border: 1px solid #d0d4dc;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .3px;
	color: #334155;
	transition: all .12s ease;
}
.usu-actions button:hover { background: #f1f5f9; }
.usu-actions button.--edit    { color: #1d4ed8; border-color: #93c5fd; }
.usu-actions button.--block   { color: #b91c1c; border-color: #fca5a5; }
.usu-actions button.--unblock { color: #15803d; border-color: #86efac; }
.usu-actions button.--temp    { color: #5b21b6; border-color: #c4b5fd; }

/* Checkbox del modal */
.usu-check {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	cursor: pointer;
}
.usu-check input[type="checkbox"] {
	width: 16px;
	height: 16px;
}

/* Botón de eliminar (peligroso) */
.gxc-btn--danger {
	color: #b91c1c !important;
}
.gxc-btn--danger:hover {
	background: #fee2e2 !important;
}

/* Responsive */
@media (max-width: 768px) {
	.usu-horario-bar {
		flex-direction: column;
		align-items: stretch;
	}
	#usu-table th:nth-child(4), /* EMPRESA */
	#usu-table td:nth-child(4),
	#usu-table th:nth-child(5), /* ÚLTIMO LOGIN */
	#usu-table td:nth-child(5) {
		display: none;
	}
}