/* Planning du service */

/* Planning du service */
:root { --k-conge: var(--primary); --k-rtt: var(--night); --k-recup: var(--success); --k-formation: var(--sunday); --k-absent: #94a3b8; }
.pl {
  --k: transparent;
  display: grid; place-items: center; height: 26px; min-width: 20px; border-radius: 6px; position: relative;
  font-weight: 700; font-size: 10px; color: #fff; white-space: nowrap; letter-spacing: -.02em;
  background: var(--k); cursor: default;
}
.pl.k-conge { --k: var(--k-conge); }
.pl.k-rtt { --k: var(--k-rtt); }
.pl.k-recup { --k: var(--k-recup); }
.pl.k-formation { --k: var(--k-formation); }
.pl.k-absent { --k: var(--k-absent); }
.pl.half { background: linear-gradient(135deg, var(--k) 50%, color-mix(in srgb, var(--k) 30%, transparent) 50%); }
.pl.partial { background: transparent; }
.pl.partial::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--k); }
.pl.pending { background: color-mix(in srgb, var(--k) 18%, transparent); color: var(--k); box-shadow: inset 0 0 0 1.5px var(--k); border: 0; }
.pl.half.pending { background: linear-gradient(135deg, color-mix(in srgb, var(--k) 18%, transparent) 50%, transparent 50%); }
.pl.off {
  color: var(--partiel); font-size: 9px;
  background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--partiel) 26%, transparent) 0 4px, color-mix(in srgb, var(--partiel) 10%, transparent) 4px 8px);
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--partiel) 60%, transparent);
}
.pl.ast::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: 2px; height: 4px; border-radius: 2px; background: var(--danger); }
.plan tfoot th, .plan tfoot td { padding-top: 6px; }
.pl-count { display: block; text-align: center; font-weight: 650; font-size: 11px; color: var(--muted); }
.pl-count.low { color: var(--danger); }
.legend .pl { display: inline-grid; min-width: 26px; height: 18px; font-size: 9.5px; }
.today-card { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 16px 20px; margin-bottom: 16px; }
.today-card h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; }
.today-card .chip.k-conge, .today-card .chip.k-rtt, .today-card .chip.k-recup, .today-card .chip.k-formation, .today-card .chip.k-absent { background: color-mix(in srgb, var(--k) 15%, transparent); color: var(--k); }
.today-card .chip.k-conge { --k: var(--k-conge); }
.today-card .chip.k-rtt { --k: var(--k-rtt); }
.today-card .chip.k-recup { --k: var(--k-recup); }
.today-card .chip.k-formation { --k: var(--k-formation); }
.today-card .chip.k-absent { --k: var(--k-absent); }
.today-card .chip.ast { background: var(--danger-soft); color: var(--danger); }
@media (max-width: 700px) { .today-card { grid-template-columns: 1fr; } }