#Collaboration {
    background-color: #f9ecec; /* Very light pink */
}
#Collaboration input, #Collaboration textarea, #Collaboration select {
    background-color: #fdf5f5; /* Even lighter pink */
}

#infoPreliminaire {
    background-color: #fcf5eb; /* Very light orange */
}
#infoPreliminaire input, #infoPreliminaire textarea, #infoPreliminaire select {
    background-color: #fef9f2; /* Even lighter orange */
}

#infoPedagogique {
    background-color: #fefbea; /* Very light yellow */
}
#infoPedagogique input, #infoPedagogique textarea, #infoPedagogique select {
    background-color: #fffdf3; /* Even lighter yellow */
}

#actPrevues {
    background-color: #f3f9f2; /* Very light green */
}
#actPrevues input, #actPrevues textarea, #actPrevues select {
    background-color: #f7fbf6; /* Even lighter green */
}

#Calendrier {
    background-color: #eef4fb; /* Very light blue */
}
#Calendrier input, #Calendrier textarea, #Calendrier select {
    background-color: #f6f9fd; /* Even lighter blue */
}

#infoTechnique {
    background-color: #f5f2fb; /* Very light purple */
}
#infoTechnique input, #infoTechnique textarea, #infoTechnique select {
    background-color: #f9f7fd; /* Even lighter purple */
}

/* 🔹 Ensure both buttons have the same size */
.add-button, .remove-button {
    font-family: monospace;
    display: inline-flex; /* Keep buttons aligned */
    align-items: center;
    justify-content: center;
    width: 24px; /* Ensures both are the same width */
    height: 24px; /* Ensures both are the same height */
    min-width: 24px; /* Prevent shrinking */
    min-height: 24px; /* Prevent shrinking */
    max-width: 24px; /* Prevent expanding */
    max-height: 24px; /* Prevent expanding */
    box-sizing: border-box; /* Include padding in dimensions */
    padding: 0; /* Remove unnecessary padding */
    font-size: 18px; /* Ensures the `+` and `-` are the same size */
    font-weight: bold; /* Make both symbols equally visible */
    text-align: center;
    background-color: var(--navy);
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    transition: background 0.3s ease, transform 0.2s ease;
    flex-shrink: 0; /* Prevent flexbox from shrinking the buttons */
}

/* 🔹 Adjust font spacing to balance `+` and `-` */
.add-button {
    letter-spacing: -1px; /* Helps align the plus symbol */
}

.remove-button {
    letter-spacing: 0px;
}

.S .remove-button {
    margin-top: -11px;
    margin-left: auto;
    margin-right: -17px;
}

/* 🔹 Add hover effect */
.add-button:hover, .remove-button:hover {
    background-color: var(--orange); /* Change color on hover */
    transform: scale(1.1); /* Slight increase for better UX */
}