body {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
            margin: 0;
            padding: 0;
            background: #f5f5f5;
        }

        header {
            background: #1f2937;
            color: #fff;
            padding: 8px 16px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        header h1 {
            margin: 0;
            font-size: 1.1rem;
        }

        nav a {
            color: #e5e7eb;
            text-decoration: none;
            margin-right: 10px;
            font-size: 0.9rem;
            padding: 4px 8px;
            border-radius: 4px;
        }

        nav a.active,
        nav a:hover {
            background: #374151;
        }

        .user-info {
            font-size: 0.8rem;
        }

        main {
            padding: 12px 16px 32px;
        }

        .filters {
            margin-bottom: 10px;
        }

        .filters form {
            display: inline-flex;
            flex-wrap: wrap;
            gap: 8px 12px;
            align-items: flex-end;
        }

        .filters label {
            font-size: 0.85rem;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .filters input[type="number"],
        .filters select {
            padding: 4px 6px;
            font-size: 0.9rem;
        }

        .flash-container {
            margin-bottom: 10px;
        }

        .flash {
            padding: 8px 10px;
            border-radius: 4px;
            margin-bottom: 6px;
            font-size: 0.9rem;
        }

        .flash-success {
            background: #dcfce7;
            color: #166534;
        }

        .flash-error {
            background: #fee2e2;
            color: #991b1b;
        }

        .layout {
            display: flex;
            gap: 20px;
            align-items: flex-start;
        }

        .panel {
            background: #fff;
            border-radius: 6px;
            padding: 10px 12px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
            margin-bottom: 14px;
        }

        .panel h2, .panel h3 {
            margin: 0 0 8px;
            font-size: 1rem;
        }

        label {
            font-size: 0.85rem;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        input[type="text"],
        input[type="number"],
        input[type="password"],
        input[type="date"],
        select {
            padding: 4px 6px;
            font-size: 0.9rem;
        }

        button {
            padding: 6px 10px;
            font-size: 0.9rem;
            border-radius: 4px;
            border: none;
            cursor: pointer;
            background: #2563eb;
            color: #fff;
        }

        button.secondary {
            background: #e5e7eb;
            color: #111827;
        }

        button:disabled {
            opacity: 0.5;
            cursor: default;
        }

        .annual-container {
            overflow-x: auto;
        }

        table.annual {
            border-collapse: collapse;
            font-size: 0.78rem;
            background: #fff;
            border-radius: 6px;
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        }

        table.annual th,
        table.annual td {
            border: 1px solid #e5e7eb;
            padding: 4px 6px;
            text-align: center;
            white-space: nowrap;
        }

        table.annual th.person-col,
        .week-link {
            color: #111827;
            text-decoration: none;
        }
        .week-link:hover {
            text-decoration: underline;
        }

        .annual th.person-col,
        table.annual td.person-col {
            position: sticky;
            left: 0;
            background: #f9fafb;
            z-index: 2;
            text-align: left;
        }

        table.annual thead th {
            position: sticky;
            top: 0;
            background: #f3f4f6;
            z-index: 1;
        }

        td.assignment-cell {
            min-width: 60px;
            cursor: pointer;
            user-select: none;
        }

        td.assignment-cell.selected {
            outline: 2px solid #2563eb;
            outline-offset: -2px;
        }

        td.assignment-cell .label {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        td.assignment-cell.empty {
            color: #9ca3af;
            background: #ffffff;
        }

        td.assignment-cell.abs {
            background: #fee2e2;
            color: #991b1b;
        }

        .bottom-bar {
            margin-top: 10px;
            display: flex;
            justify-content: flex-end;
        }

        .side-panel {
            width: 260px;
            flex-shrink: 0;
        }

        .side-panel .panel {
            margin-bottom: 12px;
        }

        .side-panel select[multiple] {
            min-height: 90px;
            min-width: 100%;
        }

        .small-text {
            font-size: 0.8rem;
            color: #6b7280;
        }

        #context-menu {
            position: fixed;
            display: none;
            z-index: 9999;
            background: #fff;
            border: 1px solid #e5e7eb;
            border-radius: 4px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
            font-size: 0.85rem;
            min-width: 160px;
        }

        #context-menu ul {
            list-style: none;
            margin: 0;
            padding: 4px 0;
        }

        #context-menu li {
            padding: 4px 10px;
            cursor: pointer;
        }

        #context-menu li:hover {
            background: #e5e7eb;
        }

        #context-menu li.separator {
            border-top: 1px solid #e5e7eb;
            margin: 4px 0;
            padding: 0;
        }

        .login-container {
            max-width: 400px;
            margin: 40px auto;
        }

        .login-container h2 {
            margin-top: 0;
            margin-bottom: 8px;
            font-size: 1.1rem;
        }

        .person-actions {
            display: inline-flex;
            gap: 4px;
            margin-left: 6px;
        }

        .person-actions form {
            display: inline;
        }

        .users-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.85rem;
            margin-top: 8px;
        }

        .users-table th,
        .users-table td {
            border: 1px solid #e5e7eb;
            padding: 4px 6px;
            text-align: left;
        }

        .users-table th {
            background: #f3f4f6;
        }
    

/* === Capacité annuelle + Vue jour (capacity.html) === */

        body {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
            margin: 0;
            padding: 0;
            background: #f5f5f5;
        }

        header {
            background: #1f2937;
            color: #fff;
            padding: 8px 16px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        header h1 {
            margin: 0;
            font-size: 1.1rem;
        }

        nav a {
            color: #e5e7eb;
            text-decoration: none;
            margin-right: 10px;
            font-size: 0.9rem;
            padding: 4px 8px;
            border-radius: 4px;
        }

        nav a.active,
        nav a:hover {
            background: #374151;
        }

        .user-info {
            font-size: 0.8rem;
        }

        main {
            padding: 12px 16px 32px;
        }

        .filters {
            margin-bottom: 10px;
        }

        .filters form {
            display: inline-flex;
            flex-wrap: wrap;
            gap: 8px 12px;
            align-items: flex-end;
        }

        .filters label {
            font-size: 0.85rem;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .filters input[type="number"],
        .filters select {
            padding: 4px 6px;
            font-size: 0.9rem;
        }

        .flash-container {
            margin-bottom: 10px;
        }

        .flash {
            padding: 8px 10px;
            border-radius: 4px;
            margin-bottom: 6px;
            font-size: 0.9rem;
        }

        .flash-success {
            background: #dcfce7;
            color: #166534;
        }

        .flash-error {
            background: #fee2e2;
            color: #991b1b;
        }

        .panel {
            background: #fff;
            border-radius: 6px;
            padding: 10px 12px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
            margin-bottom: 14px;
        }

        .panel h2, .panel h3 {
            margin: 0 0 8px;
            font-size: 1rem;
        }

        .capacity-container {
            overflow-x: auto;
        }

        table.capacity {
            border-collapse: collapse;
            font-size: 0.78rem;
            background: #fff;
            border-radius: 6px;
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        }

        table.capacity th,
        table.capacity td {
            border: 1px solid #e5e7eb;
            padding: 4px 6px;
            text-align: center;
            white-space: nowrap;
        }

        table.capacity th.person-col,
        table.capacity td.person-col {
            position: sticky;
            left: 0;
            background: #f9fafb;
            z-index: 2;
            text-align: left;
        }

        table.capacity thead th {
            position: sticky;
            top: 0;
            background: #f3f4f6;
            z-index: 1;
        }

        .capacity-summary {
            margin-top: 16px;
        }

        .small-text {
            font-size: 0.8rem;
            color: #6b7280;
        }

        .charts {
            display: flex;
            flex-wrap: wrap;
            gap: 16px;
        }

        .chart-box {
            flex: 1 1 360px;
            min-width: 320px;
        }

        .layout {
            display: flex;
            gap: 20px;
            align-items: flex-start;
        }

        .main-panel {
            flex: 1 1 auto;
            min-width: 0;
        }

        .side-panel {
            width: 280px;
            flex-shrink: 0;
        }

        .side-panel form label {
            font-size: 0.8rem;
        }

        .side-panel input[type="date"],
        .side-panel select,
        .side-panel textarea {
            width: 100%;
            padding: 4px 6px;
            font-size: 0.85rem;
        }

        textarea {
            resize: vertical;
        }

        button {
            padding: 6px 10px;
            font-size: 0.9rem;
            border-radius: 4px;
            border: none;
            cursor: pointer;
            background: #2563eb;
            color: #fff;
        }

        button.secondary {
            background: #e5e7eb;
            color: #111827;
        }

        .abs-status-pending {
            color: #b45309;
        }

        .abs-status-approved {
            color: #16a34a;
        }

        .abs-status-rejected {
            color: #b91c1c;
        }

        table.daily {
            border-collapse: collapse;
            font-size: 0.78rem;
            background: #fff;
            border-radius: 6px;
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        }

        table.daily th,
        table.daily td {
            border: 1px solid #e5e7eb;
            padding: 4px 6px;
            text-align: center;
            white-space: nowrap;
        }

        table.daily th.person-col,
        table.daily td.person-col {
            position: sticky;
            left: 0;
            background: #f9fafb;
            z-index: 2;
            text-align: left;
        }

        table.daily thead th {
            position: sticky;
            top: 0;
            background: #f3f4f6;
            z-index: 1;
        }

        .daily-out {
            background: #f9fafb;
            color: #9ca3af;
        }

        .daily-holiday {
            background: #fef3c7;
            color: #92400e;
        }

        .daily-abs {
            background: #fee2e2;
            color: #991b1b;
        }

        .daily-free {
            background: #ffffff;
        }

        .daily-project {
            color: #000000;
        }
    

/* === Affectation semaine (affectation_week.html) === */

        body {
            font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
            margin: 0;
            padding: 0;
            background: #f5f5f5;
        }

        header {
            background: #1f2937;
            color: #fff;
            padding: 12px 24px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        header h1 {
            font-size: 1.1rem;
            margin: 0;
        }

        nav a {
            color: #e5e7eb;
            margin-right: 16px;
            text-decoration: none;
            font-size: 0.9rem;
        }

        nav a.active {
            font-weight: 600;
            border-bottom: 2px solid #facc15;
            padding-bottom: 2px;
        }

        nav a:hover {
            text-decoration: underline;
        }

        .user-info {
            font-size: 0.8rem;
            color: #e5e7eb;
        }

        main {
            padding: 16px 24px 32px 24px;
        }

        .flash-container {
            margin-bottom: 12px;
        }

        .flash {
            padding: 8px 10px;
            border-radius: 4px;
            font-size: 0.85rem;
            margin-bottom: 6px;
        }

        .flash-success {
            background: #ecfdf5;
            color: #166534;
            border: 1px solid #bbf7d0;
        }

        .flash-warning {
            background: #fffbeb;
            color: #92400e;
            border: 1px solid #fed7aa;
        }

        .flash-error, .flash-danger {
            background: #fef2f2;
            color: #b91c1c;
            border: 1px solid #fecaca;
        }

        .filters {
            margin-bottom: 12px;
            display: flex;
            justify-content: space-between;
            gap: 12px;
            flex-wrap: wrap;
        }

        .filters form {
            display: inline-flex;
            flex-wrap: wrap;
            gap: 8px 12px;
            align-items: flex-end;
        }

        .filters label {
            font-size: 0.85rem;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .filters input[type="number"],
        .filters select {
            padding: 4px 6px;
            font-size: 0.85rem;
        }

        .filters button {
            padding: 5px 10px;
            font-size: 0.85rem;
            border-radius: 4px;
            border: 1px solid #d1d5db;
            background: #f3f4f6;
            cursor: pointer;
        }

        .filters button.secondary {
            background: #e5e7eb;
        }

        .panel {
            margin-bottom: 10px;
            padding: 10px 12px;
            background: #fff;
            border-radius: 6px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.06);
        }

        .panel h2 {
            margin: 0 0 4px 0;
            font-size: 1rem;
        }

        .panel h3 {
            margin: 0 0 4px 0;
            font-size: 0.95rem;
        }

        .small-text {
            font-size: 0.78rem;
            color: #6b7280;
        }

        .quick-tools {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
            margin-top: 4px;
        }

        .qt-btn {
            padding: 4px 8px;
            font-size: 0.8rem;
            border-radius: 4px;
            border: 1px solid #d1d5db;
            background: #f9fafb;
            cursor: pointer;
        }

        .qt-btn:hover {
            background: #e5e7eb;
        }

        #qt-project-select {
            padding: 4px 6px;
            font-size: 0.8rem;
        }

        .capacity-container {
            margin-top: 8px;
            overflow: auto;
            max-height: calc(100vh - 260px);
            border-radius: 6px;
        }

        table.daily {
            border-collapse: collapse;
            font-size: 0.78rem;
            background: #fff;
            border-radius: 6px;
            overflow: hidden;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
            min-width: 100%;
        }

        table.daily th,
        table.daily td {
            border: 1px solid #e5e7eb;
            padding: 4px 6px;
            text-align: center;
            white-space: nowrap;
        }

        table.daily th.person-col,
        table.daily td.person-col {
            position: sticky;
            left: 0;
            background: #f9fafb;
            z-index: 2;
            text-align: left;
        }

        table.daily thead th {
            position: sticky;
            top: 0;
            background: #f3f4f6;
            z-index: 1;
        }

        table.daily select {
            font-size: 0.75rem;
            max-width: 140px;
        }

        .daily-free {
            background: #f9fafb;
        }

        .daily-abs {
            background: #fee2e2;
        }

        .daily-project {
            background: #e0f2fe;
        }

        .person-quick-actions {
            margin-top: 4px;
            display: flex;
            flex-wrap: wrap;
            gap: 4px;
        }

        .person-quick-actions button {
            padding: 3px 6px;
            font-size: 0.72rem;
            border-radius: 4px;
            border: 1px solid #d1d5db;
            background: #f9fafb;
            cursor: pointer;
            color: #000;
            font-weight: 500;
        }

        .person-quick-actions button:hover {
            background: #e5e7eb;
        }

        .bottom-bar {
            margin-top: 8px;
            display: flex;
            justify-content: flex-end;
        }

        .bottom-bar button {
            padding: 6px 12px;
            font-size: 0.85rem;
            border-radius: 4px;
            border: 1px solid #16a34a;
            background: #22c55e;
            color: #fff;
            cursor: pointer;
        }

        .bottom-bar button:hover {
            background: #16a34a;
        }
    



/* Branding header for Vue jour */
.branding {
    display: flex;
    align-items: center;
    gap: 10px;
}
.logo-circle {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: #facc15;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: #111827;
    font-size: 0.85rem;
}
.app-title {
    font-weight: 600;
    font-size: 0.95rem;
}
.app-subtitle {
    font-size: 0.75rem;
    color: #9ca3af;
}

/* Projets page specific */
.color-palette {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}
.color-option {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}
.color-box {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.2);
}
.projects-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    margin-top: 6px;
}
.projects-table th,
.projects-table td {
    border: 1px solid #e5e7eb;
    padding: 4px 6px;
    text-align: left;
}
.projects-table th {
    background: #f3f4f6;
}
.color-cell {
    text-align: center;
}
.color-dot {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    display: inline-block;
    border: 1px solid rgba(0,0,0,0.2);
}
.project-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
form.inline-form {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}
form.inline-form input[type="text"] {
    max-width: 140px;
}
form.inline-form select {
    max-width: 120px;
}



/* Amélioration visuelle vue Affectation semaine */
.quick-tools {
    background: #f9fafb;
    border-radius: 6px;
    padding: 8px 10px;
}

.qt-btn {
    background: #ffffff;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}
.qt-btn:hover {
    background: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

#qt-project-select {
    min-width: 220px;
}

.person-quick-actions {
    margin-top: 4px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.person-quick-actions button {
    padding: 3px 6px;
    font-size: 0.72rem;
    border-radius: 4px;
    border: 1px solid #d1d5db;
    background: #f9fafb;
    cursor: pointer;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}

.person-quick-actions button:hover {
    background: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

table.daily {
    border-radius: 8px;
    overflow: hidden;
}

table.daily thead th {
    background: #f3f4f6;
    font-weight: 600;
}

table.daily tbody tr:nth-child(even) td:not(.person-col) {
    background: #fcfcfc;
}

/* ===== Colonne de la semaine en cours (vue Affectation annuelle) ===== */

/* En-tête : bien coloré, sticky, c'est ton repère visuel */
.annual th.current-week-col {
    background: rgba(249, 115, 22, 0.3); /* orange léger */
    color: #1f2933;
    position: sticky;
    top: 0;
    z-index: 2;
}

/* Cellules : on ne touche PAS au background (qui vient des projets),
   on dessine juste un cadre orange autour pour que la colonne saute aux yeux */
.annual td.current-week-col {
    box-shadow: inset 0 0 0 2px rgba(249, 115, 22, 0.9);
}

/* ===== Heatmap sur "Capacité annuelle (jours disponibles / semaine)" ===== */

/* 0 jours utilisés (donc 5 jours dispo) => vert doux */
.capacity td.cap-days-zero {
    background: rgba(22, 163, 74, 0.16);  /* vert clair */
    color: #166534;                        /* vert foncé pour le texte */
    font-weight: 600;
}

/* ≥ 1 jour utilisé => jaune/orange léger */
.capacity td.cap-days-nonzero {
    background: rgba(250, 204, 21, 0.20);  /* jaune clair */
    color: #92400e;                        /* brun/orange pour le texte */
}
/* ===== Heatmap sur "Taux de remplissage (global & par groupe)" ===== */

/* >= 80% : vert (remplissage élevé, OK) */
.capacity-summary td.fill-high {
    background: rgba(22, 163, 74, 0.18); /* vert clair */
    color: #166534;
    font-weight: 600;
}

/* 40–79% : jaune (zone intermédiaire) */
.capacity-summary td.fill-mid {
    background: rgba(250, 204, 21, 0.22); /* jaune clair */
    color: #92400e;
}

/* < 40% : orange (sous-utilisation visible) */
.capacity-summary td.fill-low {
    background: rgba(249, 115, 22, 0.22); /* orange clair */
    color: #7c2d12;
}
/* ===== Tableau Liste des comptes ===== */

.users-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    table-layout: fixed;
}

.users-table th,
.users-table td {
    padding: 6px 8px;
    border-bottom: 1px solid #e5e7eb;
}

.users-table thead th {
    background: #f3f4f6;
    font-weight: 600;
}

.users-table tbody tr:nth-child(even) td {
    background: #f9fafb;
}

/* Largeurs par colonne */
.users-table .col-login   { width: 14%; }
.users-table .col-role    { width: 10%; }
.users-table .col-active  { width: 8%; }
.users-table .col-person  { width: 24%; }
.users-table .col-perm    { width: 30%; }
.users-table .col-actions { width: 14%; }

.text-center {
    text-align: center;
}

.text-muted {
    color: #9ca3af;
}

/* Login & rôles */
.user-login {
    font-weight: 600;
}

.role-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.78rem;
    text-transform: capitalize;
}

/* Couleurs selon le rôle */
.role-admin {
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
}
.role-manager {
    background: rgba(16, 185, 129, 0.12);
    color: #047857;
}
.role-tester {
    background: rgba(234, 179, 8, 0.12);
    color: #92400e;
}

/* Statut actif / inactif */
.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    margin-right: 4px;
}
.status-active {
    background: #22c55e;
}
.status-inactive {
    background: #9ca3af;
}

/* Permissions sous forme de grille compacte */
.permissions-cell {
    vertical-align: top;
}

.permissions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 8px;
}

.permissions-grid label {
    display: flex;
    align-items: center;
    gap: 4px;
}

.btn-perms-save {
    margin-top: 6px;
    padding: 2px 8px;
    font-size: 0.75rem;
}
.users-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    table-layout: auto;
}

.users-table th,
.users-table td {
    padding: 6px 8px;
    border-bottom: 1px solid #e5e7eb;
    vertical-align: top;
}

.users-table thead th {
    background: #f3f4f6;
    font-weight: 600;
}

.users-table tbody tr:nth-child(even) td {
    background: #f9fafb;
}

.users-table .col-login   { width: 14%; }
.users-table .col-role    { width: 10%; }
.users-table .col-active  { width: 8%; }
.users-table .col-person  { width: 22%; }
.users-table .col-perm    { width: 30%; }
.users-table .col-actions { width: 16%; }

.text-center { text-align: center; }
.text-muted  { color: #9ca3af; }

.user-login { font-weight: 600; }

/* Badges de rôle */
.role-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.78rem;
}

.role-admin   { background: #dbeafe; color: #1d4ed8; }
.role-manager { background: #dcfce7; color: #047857; }
.role-tester  { background: #fef3c7; color: #92400e; }

/* Statut actif / inactif */
.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    margin-right: 4px;
}
.status-active   { background: #22c55e; }
.status-inactive { background: #9ca3af; }

/* Permissions en grille */
.permissions-cell { vertical-align: top; }

.permissions-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 12px;
}

.permissions-grid label {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 48%; /* 2 colonnes */
}

.btn-perms-save {
    margin-top: 6px;
    padding: 2px 8px;
    font-size: 0.75rem;
}

/* Amélioration lisibilité vue semaine (daily) */
table.daily td select {
  background: rgba(255,255,255,0.96);
  color: #111827;
  border-radius: 4px;
  border: 1px solid #d1d5db;
  padding: 2px 4px;
  font-size: 0.78rem;
}
table.daily td.daily-project select {
  background: rgba(255,255,255,0.96); /* garder le texte lisible même sur fond jaune */
}