/* Styles globaux pour la réactivité et l'esthétique */
@media (max-width: 576px) {
    .navbar-brand {
        font-size: 1.5rem; /* Taille de la police pour les petits écrans */
    }
    .navbar-nav .nav-link {
        font-size: 0.9rem; /* Taille de la police pour les petits écrans */
    }
    footer h5 {
        font-size: 1.2rem; /* Taille de la police pour les titres du footer */
    }
}

a{
	text-decoration: none;
}
.ntech-navbar{
	font-size: 20px;
	font-family: serif, tahoma, arial; 
	z-index: 99;
	margin-top: -10px;
}

.ntech-navbar .nav-link{
	border-bottom: 1px solid transparent;
	transition: padding-bottom .4s ease-in-out, border-color .3s ease;

}

.ntech-navbar .nav-link:hover{
	padding-bottom: 20px;
	border-bottom-color: var(--bs-teal);
}

.banner{
	background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/store.jpg') center center fixed no-repeat;
	background-size: cover;
	height: 250px;
	margin-top: -20;
	}

.banner .banner-desc{
	font-size: 35px;
	font-family:'century' ;
	font-weight: 600;
	color: #fff;
	align-items: center;
	margin-top: 10px;
}

.insconnect{
	color: #FFFF00;
	font-weight: 700;
	font-size: 13px; 
	float: right; 
	margin-right: 20px; 
	text-decoration: none; 
}

.insconnect:hover{
	color: maroon;

}

.lucfooter a{
	text-decoration: none;
	color: #fff;
}

.lucfooter a:hover{
	color: red;
	font-weight: 600;
}

.lucfooter li{
	text-decoration: none;
	color: maroon;
}

.lucnous{
	text-align: justify;	
}

.lucnous h5{
	color: #00FFFF;
	font-weight: 700;
}

.lucnous p{
	font-family: "Arial Narrow", Arial, sans-serif;
	text-align: justify;

}

.conditions{
	text-align: justify;
}

.conditions li{
	color: #00FFFF;
	font-weight: 700;
}

.conditions p{
	font-family: "Arial Narrow", Arial, sans-serif;
}

body {
    background-color: #f8f9fa;
    font-family: Arial, sans-serif; /* Choix d'une police plus moderne */
}

.container {
    margin-top: 20px;
}

h1 {
    color: #007bff; /* Couleur du titre */
    font-size: 2.5em; /* Taille du titre */
    margin-bottom: 20px; /* Espace sous le titre */
}

.card {
    margin-bottom: 20px;
    border: 1px solid #007bff;
}

.card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px; /* Plus d'espace à l'intérieur des cartes */
}

.card-title {
    font-size: 1.5em; /* Taille du titre du produit */
    margin-bottom: 10px;
}

.promo-price {
    color: #dc3545; /* Couleur du prix normal */
    text-decoration: line-through; /* Souligner le prix normal */
}

.normal-price {
    color: #28a745; /* Couleur du prix promotionnel */
}

.quantity-controls {
    margin: 10px 0; /* Espacement autour des contrôles de quantité */
}

.total {
    margin-top: 20px;
    font-size: 1.2em; /* Taille de la section total */
}

.total-red {
    color: red;
    text-decoration: line-through;
    font-size: 1.5em; /* Changement de taille pour le total */
}

.total-blue {
    color: blue;
    font-size: 1.25em; /* Taille pour l'économie */
}

.net-payable {
    font-weight: bold;
    font-size: 1.5em; /* Taille du montant net à payer */
    color: #28a745; /* Couleur du montant net */
}

/* Amélioration de la réactivité pour les petits écrans */
@media (max-width: 768px) {
    .card {
        margin-bottom: 10px; /* Réduire l'espace entre les cartes */
    }

    h1 {
        font-size: 2em; /* Réduire la taille du titre sur mobile */
    }

    .total {
        font-size: 1em; /* Réduction de la taille de la section total sur mobile */
    }
}