.comments-container {
    font-family: Arial, sans-serif;
    padding: 20px;
}

.comments-container .comment {
    background: #FAFAFA;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 4px rgba(153, 153, 153, 0.5);
    border-radius: 5px;
}

.container {
    max-width: 1000px;
    margin: 0 auto;
}

h2 {
    text-align: center;
    color: #db4f0a;
    margin-top: 30px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 5px;
}

h2.h2-title {
    background-color: #a70b4e;
    color: #fff;
    padding: 8px 0;
    border-radius: 5px;
}

h3 {
    text-align: left;
    color: #22648d;
    margin-top: 30px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 5px;
}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
    margin: 20px 0;
}

.comment {
    background: #fff;
    border-radius: 5px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(153, 153, 153, 0.5);
}

input[type="text"].author {
    margin-bottom:10px;
    padding: 5px;
    border:1px solid #ccc;
}

        .author-container {
            border-bottom: 1px solid #ccc;
        }

        .author-label {
            margin-right: 5px;
        }

        .author-name {
            color: #db4f0a;
        }

        .date {
            float: right;
            font-size: 14px;
        }

        .comment p {
            color: #555;
            font-size: 14px;
        }

        .reply {
            background-color: #4272835e;
            padding: 10px;
            margin-left: 20px;
        }

        .reply .author {
            font-weight: bold;
            color: #dd4e15;
            border-bottom: 1px solid #777;
        }

        .reply .date {
            font-size: 12px;
            color: #777;
        }

        .reply .content {
            margin-top: 5px;
            color: #333;
        }

        form {
            margin-top: 20px;
        }

        textarea {
            width: 100%;
            height: 100px;
            border: 1px solid #ccc;
            border-radius: 5px;
            margin-bottom: 10px;
            padding: 10px;
            font-family: Arial, sans-serif;
            box-sizing: border-box;
            font-size: 16px;
        }

        button.btn {
            background-color: #5cb85c;
            color: white;
            border: none;
            padding: 3px 10px;
            border-radius: inherit;
            cursor: pointer;
            font-size: 14px;
        }

        button {
            background-color: #5cb85c;
            color: white;
            border: none;
            padding: 8px 20px;
            border-radius: 3px;
            cursor: pointer;
            font-size: 16px;
        }

        button:hover {
            background-color: #317f31;
        }

        .success-message, .error-message {
            color: #fff;
            padding: 10px;
            margin-bottom: 20px;
            border-radius: 5px;
            text-align: center;
        }

        .success-message {
            background-color: #4CAF50; /* Green */
        }

        .error-message {
            background-color: #f44336; /* Red */
        }

        .logout-form {
            margin-top: 20px;
        }

        .logout-form input[type="submit"] {
            background-color: #f44336;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-size: 16px;
        }

        .logout-form input[type="submit"]:hover {
            background-color: #d32f2f;
        }

        input[type="text"]::placeholder {
            color: #999;
        }

        /* Style pour le menu des catégories */
        .category-menu {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }

        .category-menu li {
            display: inline-block;
            margin-right: 10px;
        }

        .category-menu li a {
            background-color: #379BCD;
            text-decoration: none;
            color: #dbdbdb;
            padding: 5px 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
            transition: background-color 0.3s;
        }

        .category-menu li a:hover {
            background-color: #fb4926;
            color: #fff;
        }
        /* Styles pour les boutons "Éditer" et "Supprimer" */
        .edit-button,
        .delete-button {
            background-color: #a4004d;
            color: #fff;
            border: none;
            padding: 4px 12px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
            transition: background-color 0.3s;
            text-decoration:none;
        }

        /* Style au survol des boutons */
        .edit-button:hover,
        .delete-button:hover {
            background-color: #bf1e69;
        }

        /* Ajouter de l'espace entre les boutons */
        .edit-button + .delete-button {
            margin-left: 10px;
        }
        form.menu-cat select {
            border: 1px solid #ccc;
            padding: 8px;
        }
        form.menu-cat select option {
            background-color: #fff;
            color: #333;
            font-size: 14px;
            border: 1px solid #ccc;
            padding: 10px;
        }
        form.menu-cat select option:hover {
            background-color: #f0f0f0;
        }
        .pagination {
            display: flex;
            justify-content: center;
            margin: 20px 0;
        }

        .pagination a {
            margin: 0 5px;
            padding: 5px 10px;
            border: 1px solid #ddd;
            color: #337ab7;
            text-decoration: none;
            border-radius: 4px;
            transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
        }

        .pagination a:hover {
            background-color: #337ab7;
            color: #fff;
        }
        .pagination a.active {
            background-color: #337ab7;
            color: white;
            border-radius: 5px;
        }