/* Reset et base */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background: #f4f4f4;
}

/* Conteneur principal */
    .dashboard-container {
        width: 90%; /* Largeur à 90% */
        max-width: 1200px; /* Largeur maximale de 1200px */
        margin: 0 auto; /* Centré horizontalement */
        padding: 20px;
    }
.modal { display: none; position: fixed; z-index: 2000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }
        .modal-content { background-color: #fefefe; padding: 15px; border-radius: 5px; width: 90%; max-width: 500px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); margin: auto; }
        .close { color: #aaa; float: right; font-size: 24px; font-weight: bold; cursor: pointer; }
        .close:hover { color: #000; }
        .form-group { margin-bottom: 10px; }
        .form-group label { display: block; margin-bottom: 3px; font-weight: bold; }
        .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 6px; border: 1px solid #ddd; border-radius: 4px; }
        .form-group textarea { height: 80px; }
        .btn { background: #007BFF; color: white; padding: 8px 15px; border: none; border-radius: 4px; cursor: pointer; width: 100%; }
        .btn:hover { background: #0056b3; }
        .info-card { background: white; border-radius: 5px; padding: 15px; margin-bottom: 8px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); border-left: 4px solid #007BFF; }
        .info-card h2 { color: #007BFF; margin-bottom: 8px; font-size: 16px; }
        .info-card p { margin-bottom: 6px; line-height: 1.4; }
        .warning { background: #fff3cd; border-left: 4px solid #ffc107; }
        .warning p { color: #856404; }
        .contact-btn { display: inline-block; margin-top: 8px; }
        .alert-success { background: #d4edda; color: #155724; padding: 12px; border-radius: 5px; margin-bottom: 10px; border: 1px solid #c3e6cb; }
        .alert-error { background: #f8d7da; color: #721c24; padding: 12px; border-radius: 5px; margin-bottom: 10px; border: 1px solid #f5c6cb; }
        .profil-info { background: #f8f9fa; padding: 12px; border-radius: 5px; margin-bottom: 10px; border-left: 4px solid #007BFF; }
        .profil-info p { margin-bottom: 5px; font-size: 15px; line-height: 1.4; }
        .profil-info strong { color: #333; }
        .statut-badge, .etat-badge { display: inline-block; padding: 2px 6px; border-radius: 10px; font-size: 11px; font-weight: bold; margin-left: 8px; text-transform: uppercase; }
        .statut-badge.standard { background: #d4edda; color: #155724; }
        .statut-badge.vip { background: #fff3cd; color: #856404; }
        .etat-badge.actif { background: #d4edda; color: #155724; }
        .etat-badge.desactive { background: #f8d7da; color: #721c24; }
        .jours-restants { color: #28a745; font-weight: bold; margin-top: 5px; }