@font-face {
	font-family: "AvenirNext";
	src: url('AvenirNextLTPro-Regular.otf') format("opentype");
}

@font-face {
	font-family: "AvenirNext";
	font-style: italic;
	src: url('../deco/AvenirNextLTPro-It.otf') format("opentype");
}

@font-face {
	font-family: "AvenirNext";
	font-weight: bold;
	src: url('../deco/AvenirNextLTPro-Bold.otf') format("opentype");
}

:root {
    --primary-color: #ed3341; /* Pantone 185C */
  }
  
  .bg-primary {
    background-color: var(--primary-color) !important;
  }
  
  .text-primary {
    color: #fff !important;
  }
  
  .border-primary {
    border-color: var(--primary-color) !important;
  }
  
  .btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
  }
  
  /* Exemple avec une classe personnalisée */
  .custom-primary-box {
    background-color: var(--primary-color);
    color: #fff;
    border: 1px solid var(--primary-color);
    padding: 10px;
    margin-bottom: 10px;
  }

  .header { 
    position: sticky; 
    top:0; 
} 

body {
    font-family: 'AvenirNext', sans-serif;
    background-color: #ffffff;
    color: rgb(228, 0, 43);
}

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

#search-box {
    position: sticky;
    top: 0;
    background-color: #ffffff; /* Ajoutez une couleur de fond si nécessaire */
    z-index: 1000; /* Assurez-vous que le z-index est supérieur à d'autres éléments sur la page */
  }

.navbar-brand {
    color: #ffffff; /* Texte en blanc */
}

.navbar-nav .nav-link {
    color: #ffffff; /* Texte en blanc */
}


/* Appliquer un style de base au tableau */

.table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
}

/* Alternance de couleurs de ligne */
.table tr:nth-child(even) {
    background-color: #ec9e9e;
}

/* Style des cellules du tableau */
.table td, .table th {
    border: 1px solid #a39d9d;
    padding: 8px;
    text-align: left;
    white-space: nowrap !important; /* Ajout de la propriété no-wrap */
}

/* Centrage dans la colonne */
.table th {
    text-align: center;
}

/* Rendre le tableau responsive pour les petits écrans */
@media (max-width: 768px) {
    .table {
        display: block;
        overflow-x: auto;
    }

    /* Ajouter un style pour la première ligne (peut être personnalisé) */
    .table thead {
        display: none;
    }

    /* Ajuster le style des cellules pour un affichage agréable sur les petits écrans */
    .table td, .table th {
        display: block;
        text-align: center;
    }

    /* Ajouter des espaces entre les cellules sur les petits écrans */
    .table td {
        border-bottom: 1px solid #ddd;
    }

    /* Ajouter des styles spécifiques pour la première cellule de chaque ligne (peut être personnalisé) */
    .table td:first-child {
        border-top: 1px solid #ddd;
    }

}