:root{
  --color-primary:#3498db;
  --color-success:#27ae60;
  --color-dark:#2c3e50;
  --color-muted:#7f8c8d;
  --color-light-grey:#f4f7f6;
  --color-border:#e0e0e0;
  --border-radius:8px;
  --box-shadow:0 4px 12px rgba(0,0,0,.08)
}
.chantier-container{
  max-width:900px;
  margin:20px auto;
  padding:20px;
  font-family:'Roboto',sans-serif
}
.page-header{text-align:center;margin-bottom:30px}
.page-header h1{color:var(--color-dark);margin-bottom:5px}
.page-header p{color:var(--color-muted);font-size:1.1em}
.work-item{
  background-color:#fff;border:1px solid var(--color-border);
  border-left:4px solid var(--color-muted);
  padding:20px;margin-bottom:15px;border-radius:var(--border-radius);
  box-shadow:var(--box-shadow);transition:transform .2s ease,box-shadow .2s ease
}
.work-item:hover{transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.1)}
.work-item h3{
  margin-top:0;margin-bottom:10px;font-size:1.2em;font-weight:500;color:var(--color-dark);
  display:flex;align-items:center;flex-wrap:wrap
}
.work-item .date{margin:5px 0 0;font-size:.9em;color:var(--color-muted);font-style:italic}
.status-badge{font-size:.8em;font-weight:700;padding:4px 10px;border-radius:12px;color:#fff;margin-left:12px;white-space:nowrap}
.status-encours{background-color:var(--color-success)}
.status-termine{background-color:var(--color-muted)}
.work-item.status-encours-border{border-left-color:var(--color-success)}
.work-item.status-termine-border{border-left-color:var(--color-muted)}
.work-item.status-termine-border h3{text-decoration:line-through;color:var(--color-muted)}
.info-message{text-align:center;padding:40px;background-color:#fff;border-radius:var(--border-radius);box-shadow:var(--box-shadow);font-size:1.1em;color:var(--color-muted)}
.info-message.error{color:#e74c3c}

/* Légende */
.chantier-legend{margin-top:20px}
.chantier-legend-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--color-border);border-radius:8px;overflow:hidden;box-shadow:var(--box-shadow)}
.chantier-legend-table th,.chantier-legend-table td{padding:10px;border-bottom:1px solid var(--color-border);text-align:left}
.chantier-legend-table thead th{background:#f9f9f9;font-weight:700;color:#333}
.chantier-legend-table tbody tr:last-child td{border-bottom:none}

@media (max-width:768px){
  .chantier-container{padding:10px}
  .page-header h1{font-size:1.8em}
  .work-item h3{font-size:1.1em}
}






.chantier-legend { margin-top: 16px; }
.chantier-legend-row { display: flex; align-items: center; gap: 16px; }
.legend-badge {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 9999px;
  vertical-align: middle;
}
/* couleurs déjà définies par tes classes existantes */
.status-encours { background-color: var(--color-success); }
.status-termine { background-color: var(--color-muted); }

.legend-label { font-size: 0.95em; color: #333; margin-right: 8px; }