/* = Module pointage — styles propres aux gabarits de templates/pointage/.
   Un block utilisé par un second module remonte dans components.css.
   Issu du découpage de main.css (15/09/2026), chargé sur toutes les pages
   dans l'ordre fixé par templates/partials/feuilles_de_style.html.  */

.pointage-timer {
  border-left: 3px solid var(--color-primary-light);
}

.pointage-timer__display {
  min-width: 140px;
  text-align: center;
  font-size: var(--text-28);
  font-weight: var(--weight-bold);
  letter-spacing: 2px;
}

.pointage-refact-toggle {
  background: none;
  border: 1px solid transparent;
  border-radius: var(--radius-xl);
  padding: var(--space-0-5) var(--space-2);
  font-size: var(--text-11);
  font-weight: var(--weight-medium);
  cursor: pointer;
  transition: all var(--transition-fast);
}

.pointage-refact-toggle--on {
  background: color-mix(in srgb, var(--color-success) 10%, transparent);
  color: var(--color-success);
  border-color: color-mix(in srgb, var(--color-success) 20%, transparent);
}

.pointage-refact-toggle--on:hover {
  background: color-mix(in srgb, var(--color-success) 20%, transparent);
}

.pointage-refact-toggle--off {
  background: color-mix(in srgb, var(--color-text-muted) 10%, transparent);
  color: var(--color-text-secondary);
  border-color: color-mix(in srgb, var(--color-text-muted) 20%, transparent);
}

.pointage-refact-toggle--off:hover {
  background: color-mix(in srgb, var(--color-text-muted) 20%, transparent);
}

.summary-total {
  font-size: var(--text-24);
  font-weight: var(--weight-semibold);
}

.capacity-bar {
  flex: 1;
  max-width: 300px;
}

.capacity-bar__label {
  display: flex;
  justify-content: space-between;
  font-size: var(--text-12);
  margin-bottom: var(--space-1);
}

.js-toggle--hidden {
  display: none;
}

.entry-duree {
  width: 60px;
  text-align: right;
  font-weight: var(--weight-semibold);
}

.entry-refact-cell {
  width: 90px;
  text-align: center;
}

.entry-statut-cell {
  width: 50px;
  text-align: center;
}

.entry-delete-cell {
  width: 40px;
  text-align: right;
}

.entry-project-cell {
  width: 100px;
}