/* === USER MODAL BEIGE FIELDS === */

#user-modal .modal-content,
#user-modal .modal-header,
#user-modal .modal-body,
#user-modal .modal-footer {
    background-color: var(--surface) !important;
}

#user-modal .modal-content {
    border: 1px solid #ded1c0 !important;
}

/* Champs Bootstrap */
#user-modal .form-control,
#user-modal .form-select {
    background-color: var(--surface-2) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
}

/* Champs désactivés : beige légèrement plus soutenu */
#user-modal .form-control:disabled,
#user-modal .form-control[readonly],
#user-modal .form-select:disabled {
    background-color: #eee5d9 !important;
    border-color: #ddd0c0 !important;
    color: #68717c !important;
    opacity: 1 !important;
}

/* Dropdowns Dash */
#user-modal .Select-control,
#user-modal .Select-menu-outer,
#user-modal .Select-menu {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
}

#user-modal .Select-placeholder,
#user-modal .Select-value-label,
#user-modal .Select-input,
#user-modal .Select-input > input {
    color: var(--text) !important;
}

/* Étiquettes sélectionnées dans les listes multiples */
#user-modal .Select--multi .Select-value {
    background-color: #eee4d6 !important;
    border-color: #d7c5ad !important;
    color: #263649 !important;
}

/* Focus propre et discret */
#user-modal .form-control:focus,
#user-modal .form-select:focus,
#user-modal .is-focused:not(.is-open) > .Select-control {
    background-color: var(--surface) !important;
    border-color: #bca78e !important;
    box-shadow: 0 0 0 2px rgba(188, 167, 142, 0.15) !important;
}

/* === END USER MODAL BEIGE FIELDS === */

/* Profils : mêmes surfaces beige pour les accès, y compris désactivés. */
#role-modal .modal-content {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}
#role-modal .form-control,
#role-modal .dash-dropdown,
#role-modal .dash-dropdown-trigger,
#role-modal .dash-dropdown-content,
#role-modal .Select-control,
#role-modal .Select-menu-outer {
    background: var(--input-surface) !important;
    border-color: var(--border) !important;
    border-radius: var(--radius-md) !important;
    color: var(--text);
}
#role-pages-checklist {
    background: var(--filter-surface);
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}
#role-modal .form-check-input:disabled {
    background-color: var(--input-surface);
    opacity: 1;
}
#role-modal .form-check-input:disabled ~ .form-check-label {
    color: var(--text-muted);
    opacity: 1;
}