<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<?php
	$is_enabled = empty($app_user) || !isset($app_user['is_enabled']) || (int)$app_user['is_enabled'] === 1;
	$is_admin = !empty($app_user['is_admin']);
	$include_in_statistics = empty($app_user) || !isset($app_user['include_in_statistics']) || (int)$app_user['include_in_statistics'] === 1;
	$current_tab = isset($active_tab) ? (string)$active_tab : 'general';
	if ($current_tab === 'permisos_visor' && !$is_enabled) {
		$current_tab = 'general';
	}
	if ($current_tab === 'permisos_admin' && !$is_admin) {
		$current_tab = 'general';
	}
	$employee_id = isset($employee['person_id']) ? (int)$employee['person_id'] : 0;
?>
<style>
	.employee-detail-shell {
		display: grid;
		gap: 18px;
	}
	.employee-hero {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		gap: 16px;
		flex-wrap: wrap;
	}
	.employee-title {
		margin: 0;
		font-size: 2rem;
		line-height: 1.05;
	}
	.employee-subtitle {
		color: var(--muted);
		margin-top: 8px;
	}
	.employee-counter-row {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		flex-wrap: wrap;
	}
	.employee-counter-chip {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 10px 14px;
		border-radius: 999px;
		background: rgba(77, 116, 195, 0.14);
		font-weight: 800;
	}
	.employee-counter-icon {
		width: 24px;
		height: 24px;
		border-radius: 999px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		background: rgba(77, 116, 195, 0.18);
	}
	.employee-tabs {
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
	}
	.employee-tab {
		display: inline-flex;
		align-items: center;
		padding: 11px 16px;
		border-radius: 999px;
		background: rgba(95, 143, 168, 0.14);
		color: var(--text);
		font-weight: 800;
		text-decoration: none;
		box-shadow: inset 0 0 0 1px rgba(95, 143, 168, 0.08);
		transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
	}
	.employee-tab.active {
		background: #163b6d;
		color: #ffffff;
		box-shadow: 0 10px 24px rgba(22, 59, 109, 0.28), inset 0 0 0 2px rgba(255,255,255,0.16);
		transform: translateY(-1px);
	}
	.employee-panel {
		padding: 20px;
	}
	.employee-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
		gap: 14px;
	}
	.employee-field label,
	.employee-section-label {
		display: block;
		font-size: 0.82rem;
		font-weight: 800;
		letter-spacing: 0.02em;
		text-transform: uppercase;
		color: var(--muted);
		margin-bottom: 7px;
	}
	.employee-field input,
	.employee-field textarea {
		width: 100%;
		padding: 12px 14px;
		border-radius: 14px;
		border: 0;
		box-shadow: inset 0 0 0 1px var(--border);
		background: #fff;
		font: inherit;
	}
	.employee-checkbox-list {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
		gap: 12px;
	}
	.employee-checkbox {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 13px 14px;
		border-radius: 16px;
		background: rgba(255,255,255,0.78);
		box-shadow: inset 0 0 0 1px var(--border);
	}
	.employee-group-chip {
		display: inline-flex;
		align-items: center;
		padding: 6px 10px;
		border-radius: 999px;
		color: #fff;
		font-size: 0.82rem;
		font-weight: 800;
		margin-right: 8px;
		margin-bottom: 8px;
	}
	.employee-permission-block {
		padding: 18px 20px;
		border-radius: 18px;
		background: rgba(255,255,255,0.72);
		box-shadow: inset 0 0 0 1px var(--border);
		margin-top: 14px;
	}
	.employee-permission-title {
		margin: 0 0 10px;
		font-size: 1rem;
		font-weight: 900;
	}
	.employee-permission-list {
		display: grid;
		gap: 8px;
	}
	.employee-permission-item {
		display: flex;
		align-items: center;
		gap: 10px;
		padding-left: 12px;
		font-size: 0.98rem;
	}
	.employee-permission-dash {
		color: var(--muted);
		font-weight: 800;
	}
	.points-summary {
		display: grid;
		grid-template-columns: minmax(220px, 300px) 1fr;
		gap: 18px;
		align-items: start;
	}
	.points-total-card {
		padding: 22px;
		border-radius: 22px;
		background: linear-gradient(145deg, rgba(77, 116, 195, 0.16), rgba(95, 143, 168, 0.10));
		box-shadow: inset 0 0 0 1px rgba(77, 116, 195, 0.15);
	}
	.points-total-label {
		font-size: 0.82rem;
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		color: var(--muted);
	}
	.points-total-value {
		font-size: 2.6rem;
		font-weight: 900;
		line-height: 1;
		margin-top: 10px;
	}
	.points-movement-form {
		display: grid;
		grid-template-columns: 180px 1fr auto;
		gap: 12px;
		align-items: end;
	}
	.points-table-wrap {
		overflow-x: auto;
		margin-top: 18px;
	}
	.points-table {
		width: 100%;
		border-collapse: collapse;
	}
	.points-table th,
	.points-table td {
		padding: 12px 10px;
		border-bottom: 1px solid var(--border);
		text-align: left;
		vertical-align: top;
	}
	.points-delta-positive {
		color: #1f8f4d;
		font-weight: 800;
	}
	.points-delta-negative {
		color: #c64242;
		font-weight: 800;
	}
	.empty-note {
		padding: 16px;
		border-radius: 16px;
		background: rgba(255,255,255,0.68);
		box-shadow: inset 0 0 0 1px var(--border);
		color: var(--muted);
	}
	@media (max-width: 860px) {
		.points-summary {
			grid-template-columns: 1fr;
		}
		.points-movement-form {
			grid-template-columns: 1fr;
		}
	}
</style>

<div class="employee-detail-shell">
	<div class="actions" style="margin-bottom:0;">
		<a class="btn btn-outline" href="<?php echo site_url('empleados'); ?>">Volver</a>
	</div>

	<?php if (!empty($flash_message)) { ?>
		<div class="panel" style="background:#e9f7ef; color:#1f5c3a;">
			<?php echo htmlspecialchars($flash_message, ENT_QUOTES, 'UTF-8'); ?>
		</div>
	<?php } ?>
	<?php if (!empty($flash_error)) { ?>
		<div class="panel" style="background:#fdecea; color:#7a2d2d;">
			<?php echo htmlspecialchars($flash_error, ENT_QUOTES, 'UTF-8'); ?>
		</div>
	<?php } ?>

	<div class="panel employee-panel">
		<div class="employee-hero">
			<div>
				<h2 class="employee-title"><?php echo htmlspecialchars($employee['full_name'], ENT_QUOTES, 'UTF-8'); ?></h2>
				<div class="employee-subtitle">
					Usuario: <?php echo htmlspecialchars(isset($employee['username']) ? $employee['username'] : '', ENT_QUOTES, 'UTF-8'); ?>
					&nbsp;&middot;&nbsp;
					Gala: <?php echo !empty($employee['is_active_in_gala']) ? 'Activo' : 'Inactivo'; ?>
				</div>
			</div>
			<div class="employee-counter-row">
				<span class="employee-counter-chip" title="Metas completadas">
					<span class="employee-counter-icon">&#9733;</span>
					<?php echo isset($completion_counters['goals']) ? (int)$completion_counters['goals'] : 0; ?>
				</span>
				<span class="employee-counter-chip" title="Tareas completadas">
					<span class="employee-counter-icon">&#10003;</span>
					<?php echo isset($completion_counters['tasks']) ? (int)$completion_counters['tasks'] : 0; ?>
				</span>
			</div>
		</div>
	</div>

	<div class="employee-tabs">
		<a class="employee-tab <?php echo $current_tab === 'general' ? 'active' : ''; ?>" href="<?php echo site_url('empleados/'.$employee_id.'?tab=general'); ?>">General</a>
		<a class="employee-tab <?php echo $current_tab === 'puntos' ? 'active' : ''; ?>" href="<?php echo site_url('empleados/'.$employee_id.'?tab=puntos'); ?>">Puntos</a>
		<a class="employee-tab <?php echo $current_tab === 'grupos' ? 'active' : ''; ?>" href="<?php echo site_url('empleados/'.$employee_id.'?tab=grupos'); ?>">Grupos</a>
		<?php if ($is_enabled) { ?>
			<a class="employee-tab <?php echo $current_tab === 'permisos_visor' ? 'active' : ''; ?>" href="<?php echo site_url('empleados/'.$employee_id.'?tab=permisos_visor'); ?>">Permisos Visor</a>
		<?php } ?>
		<?php if ($is_admin) { ?>
			<a class="employee-tab <?php echo $current_tab === 'permisos_admin' ? 'active' : ''; ?>" href="<?php echo site_url('empleados/'.$employee_id.'?tab=permisos_admin'); ?>">Permiso Administrador</a>
		<?php } ?>
	</div>

	<?php if ($current_tab === 'general') { ?>
		<form method="post" class="panel employee-panel">
			<input type="hidden" name="action_type" value="save_general" />
			<input type="hidden" name="employee_tab" value="general" />
			<div class="employee-grid">
				<div class="employee-field">
					<label>Nombre</label>
					<input type="text" value="<?php echo htmlspecialchars($employee['full_name'], ENT_QUOTES, 'UTF-8'); ?>" disabled />
				</div>
				<div class="employee-field">
					<label>Usuario</label>
					<input type="text" value="<?php echo htmlspecialchars(isset($employee['username']) ? $employee['username'] : '', ENT_QUOTES, 'UTF-8'); ?>" disabled />
				</div>
				<div class="employee-field">
					<label>Estado Gala</label>
					<input type="text" value="<?php echo !empty($employee['is_active_in_gala']) ? 'Activo' : 'Inactivo'; ?>" disabled />
				</div>
			</div>
			<div class="employee-checkbox-list" style="margin-top:16px;">
				<label class="employee-checkbox">
					<input type="checkbox" name="is_enabled" value="1" <?php echo $is_enabled ? 'checked' : ''; ?> />
					<span>Activo en Visor</span>
				</label>
				<label class="employee-checkbox">
					<input type="checkbox" name="is_admin" value="1" <?php echo $is_admin ? 'checked' : ''; ?> />
					<span>Administrador en Visor</span>
				</label>
				<label class="employee-checkbox">
					<input type="checkbox" name="include_in_statistics" value="1" <?php echo $include_in_statistics ? 'checked' : ''; ?> />
					<span>Entra en estadistica</span>
				</label>
			</div>
			<div class="actions" style="justify-content:flex-end; margin-top:18px;">
				<button class="btn" type="submit">Guardar general</button>
			</div>
		</form>
	<?php } ?>

	<?php if ($current_tab === 'puntos') { ?>
		<div class="panel employee-panel">
			<div class="points-summary">
				<div class="points-total-card">
					<div class="points-total-label">Puntos acumulados</div>
					<div class="points-total-value"><?php echo (int)$points_total; ?></div>
				</div>
				<div class="panel" style="padding:18px; box-shadow: inset 0 0 0 1px var(--border); display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:12px;">
					<div>
						<div class="employee-section-label">Metas completadas</div>
						<div style="font-size:2rem; font-weight:900; line-height:1;"><?php echo isset($completion_counters['goals']) ? (int)$completion_counters['goals'] : 0; ?></div>
					</div>
					<div>
						<div class="employee-section-label">Tareas completadas</div>
						<div style="font-size:2rem; font-weight:900; line-height:1;"><?php echo isset($completion_counters['tasks']) ? (int)$completion_counters['tasks'] : 0; ?></div>
					</div>
					<div>
						<div class="employee-section-label">Como suma</div>
						<div class="note">Cada meta y cada tarea completada suma 1 al acumulado.</div>
					</div>
				</div>
			</div>
			<div class="points-table-wrap">
				<table class="points-table">
					<thead>
						<tr>
							<th>Fecha</th>
							<th>Tipo</th>
							<th>Movimiento</th>
							<th>Acumulado</th>
							<th>Detalle</th>
						</tr>
					</thead>
					<tbody>
						<?php if (empty($points_history)) { ?>
							<tr>
								<td colspan="5"><div class="empty-note">Todavia no hay metas ni tareas completadas para sumar puntos.</div></td>
							</tr>
						<?php } else { ?>
							<?php foreach ($points_history as $movement) { ?>
								<?php $delta = isset($movement['points_delta']) ? (int)$movement['points_delta'] : 0; ?>
								<tr>
									<td><?php echo htmlspecialchars(isset($movement['occurred_at_label']) ? $movement['occurred_at_label'] : '-', ENT_QUOTES, 'UTF-8'); ?></td>
									<td>
										<span class="points-type-chip <?php echo htmlspecialchars(isset($movement['type']) ? $movement['type'] : 'task', ENT_QUOTES, 'UTF-8'); ?>">
											<?php echo htmlspecialchars(isset($movement['type_label']) ? $movement['type_label'] : 'Movimiento', ENT_QUOTES, 'UTF-8'); ?>
										</span>
									</td>
									<td class="points-delta-positive">+<?php echo $delta; ?></td>
									<td><?php echo isset($movement['balance_after']) ? (int)$movement['balance_after'] : 0; ?></td>
									<td>
										<strong><?php echo htmlspecialchars(isset($movement['item_name']) ? $movement['item_name'] : '', ENT_QUOTES, 'UTF-8'); ?></strong>
										<?php if (!empty($movement['detail'])) { ?>
											<div class="note"><?php echo htmlspecialchars($movement['detail'], ENT_QUOTES, 'UTF-8'); ?></div>
										<?php } ?>
									</td>
								</tr>
							<?php } ?>
						<?php } ?>
					</tbody>
				</table>
			</div>
		</div>
	<?php } ?>

	<?php if ($current_tab === 'grupos') { ?>
		<form method="post" class="panel employee-panel">
			<input type="hidden" name="action_type" value="save_groups" />
			<input type="hidden" name="employee_tab" value="grupos" />
			<div class="employee-section-label">Grupos actuales</div>
			<?php if (empty($assigned_groups)) { ?>
				<div class="empty-note" style="margin-bottom:16px;">Este empleado no pertenece a ningun grupo.</div>
			<?php } else { ?>
				<div style="margin-bottom:14px;">
					<?php foreach ($assigned_groups as $group) { ?>
						<span class="employee-group-chip" style="background: <?php echo htmlspecialchars(!empty($group['color']) ? $group['color'] : '#4d74c3', ENT_QUOTES, 'UTF-8'); ?>;">
							<?php echo htmlspecialchars($group['name'], ENT_QUOTES, 'UTF-8'); ?>
						</span>
					<?php } ?>
				</div>
			<?php } ?>
			<div class="employee-section-label">Editar grupos</div>
			<div class="employee-checkbox-list">
				<?php foreach ((array)$groups as $group) { ?>
					<?php $group_id = isset($group['id']) ? (int)$group['id'] : 0; ?>
					<label class="employee-checkbox">
						<input type="checkbox" name="group_ids[]" value="<?php echo $group_id; ?>" <?php echo in_array($group_id, (array)$selected_group_ids, TRUE) ? 'checked' : ''; ?> />
						<span><?php echo htmlspecialchars($group['name'], ENT_QUOTES, 'UTF-8'); ?></span>
					</label>
				<?php } ?>
			</div>
			<div class="actions" style="justify-content:flex-end; margin-top:18px;">
				<button class="btn" type="submit">Guardar grupos</button>
			</div>
		</form>
	<?php } ?>

	<?php if ($current_tab === 'permisos_visor' && $is_enabled) { ?>
		<form method="post" class="panel employee-panel">
			<input type="hidden" name="action_type" value="save_visor_permissions" />
			<input type="hidden" name="employee_tab" value="permisos_visor" />
			<?php foreach ((array)$permission_groups as $group_label => $permission_keys) { ?>
				<div class="employee-permission-block">
					<h3 class="employee-permission-title">-<?php echo htmlspecialchars($group_label, ENT_QUOTES, 'UTF-8'); ?></h3>
					<div class="employee-permission-list">
						<?php foreach ((array)$permission_keys as $permission_key) { ?>
							<label class="employee-permission-item">
								<span class="employee-permission-dash">-</span>
								<input type="checkbox" name="permissions[<?php echo htmlspecialchars(str_replace('.', '__dot__', $permission_key), ENT_QUOTES, 'UTF-8'); ?>]" value="1" <?php echo !empty($permissions[$permission_key]) ? 'checked' : ''; ?> />
								<span><?php echo htmlspecialchars(isset($permission_labels[$permission_key]) ? $permission_labels[$permission_key] : $permission_key, ENT_QUOTES, 'UTF-8'); ?></span>
							</label>
						<?php } ?>
					</div>
				</div>
			<?php } ?>
			<div class="actions" style="justify-content:flex-end; margin-top:18px;">
				<button class="btn" type="submit">Guardar permisos de Visor</button>
			</div>
		</form>
	<?php } ?>

	<?php if ($current_tab === 'permisos_admin' && $is_admin) { ?>
		<form method="post" class="panel employee-panel">
			<input type="hidden" name="action_type" value="save_admin_permissions" />
			<input type="hidden" name="employee_tab" value="permisos_admin" />
			<?php foreach ((array)$admin_permission_groups as $group_label => $permission_keys) { ?>
				<div class="employee-permission-block">
					<h3 class="employee-permission-title">-<?php echo htmlspecialchars($group_label, ENT_QUOTES, 'UTF-8'); ?></h3>
					<div class="employee-permission-list">
						<?php foreach ((array)$permission_keys as $permission_key) { ?>
							<label class="employee-permission-item">
								<span class="employee-permission-dash">-</span>
								<input type="checkbox" name="admin_permissions[<?php echo htmlspecialchars(str_replace('.', '__dot__', $permission_key), ENT_QUOTES, 'UTF-8'); ?>]" value="1" <?php echo !empty($admin_permissions[$permission_key]) ? 'checked' : ''; ?> />
								<span><?php echo htmlspecialchars(isset($admin_permission_labels[$permission_key]) ? $admin_permission_labels[$permission_key] : $permission_key, ENT_QUOTES, 'UTF-8'); ?></span>
							</label>
						<?php } ?>
					</div>
				</div>
			<?php } ?>
			<div class="actions" style="justify-content:flex-end; margin-top:18px;">
				<button class="btn" type="submit">Guardar permisos de Visores</button>
			</div>
		</form>
	<?php } ?>
</div>




