/* styles.css */

/* Corps de la page */
body {
    background-color: #0d1117;
    /* Couleur de fond sombre */
    color: #c9d1d9;
    /* Couleur du texte */
    font-family: Arial, sans-serif;
    /* Police de la page */
}

/* Styles pour la navbar */
.navbar {
    background-color: #161b22;
    /* Couleur de fond de la navbar */
}

.nav-link {
    color: #c9d1d9 !important;
    /* Couleur du texte des liens */
}

.nav-link:hover {
    color: #58a6ff !important;
    /* Couleur au survol des liens */
}

.navbar-brand {
    font-size: 1.5rem;
    /* Taille de police pour le nom de la marque */
}

/* Styles pour les notifications */
.flash {
    background-color: #21262d;
    /* Couleur de fond pour les messages flash */
    color: #c9d1d9;
    /* Couleur du texte des messages flash */
    border-radius: 0.375rem;
    /* Arrondi des coins */
    padding: 10px;
    /* Padding autour du texte */
    margin-bottom: 20px;
    /* Marge inférieure */
}

/* Styles pour le conteneur principal */
.cover-container {
    padding: 20px;
    /* Padding autour du contenu */
    border-radius: 0.375rem;
    /* Arrondi des coins */
    background-color: #161b22;
    /* Couleur de fond du conteneur principal */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    /* Ombre autour du conteneur */
}

/* Styles pour les titres */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #ffffff;
    /* Couleur blanche pour les titres */
}

h4 {
    margin: 0;
    /* Supprime les marges par défaut pour les titres */
}

/* Boutons */
.btn {
    transition: background-color 0.3s, transform 0.2s;
    /* Animation au survol */
}

.btn-primary {
    background-color: #238636;
    /* Couleur de fond pour le bouton principal */
    border: none;
    /* Supprime la bordure */
}

.btn-primary:hover {
    background-color: #1c7c29;
    /* Couleur de fond du bouton au survol, plus sombre */
}

.btn-danger {
    background-color: #cf222e;
    /* Couleur de fond pour le bouton supprimer */
    border: none;
    /* Supprime la bordure */
}

.btn-danger:hover {
    background-color: #a61e27;
    /* Couleur de fond du bouton supprimer au survol, plus sombre */
}

/* Style pour les formulaires */
.form-control {
    background-color: #21262d;
    /* Fond sombre pour les champs de formulaire */
    color: #c9d1d9;
    /* Couleur du texte */
    border: 1px solid #6c757d;
    /* Bordure grise */
}

.form-control::placeholder {
    color: #586069;
    /* Couleur du placeholder */
    opacity: 1;
    /* Visibilité du placeholder */
}

/* Arrondi des coins des éléments */
.rounded {
    border-radius: 0.375rem;
    /* Arrondi des coins */
}

/* Styles de la table */
.table {
    border-collapse: collapse;
    /* Supprime les espaces entre les bordures */
    width: 100%;
    /* Largeur de la table */
}

.table th,
.table td {
    padding: 12px;
    /* Padding dans les cellules */
    text-align: center;
    /* Centrer le texte */
}

.table th {
    background-color: #21262d;
    /* Couleur de fond pour les en-têtes */
    color: #c9d1d9;
    /* Couleur du texte des en-têtes */
}

.table tr:nth-child(even) {
    background-color: #21262d;
    /* Fond des lignes paires */
}

.table tr:hover {
    background-color: #30363d;
    /* Fond au survol des lignes */
}

/* Style pour le placeholder */
#filterInput::placeholder {
    color: #adb5bd;
    /* Couleur du texte du placeholder */
    opacity: 1;
    /* Assure que le placeholder est visible */
}

#productTable,#categoryTable {
    border-radius: 0.375rem;
    /* Arrondi les coins de la table */
    overflow: hidden
}