/* all */
*{
    box-sizing: border-box;
}
@font-face {
    font-family: 'FuturaPTDHeavy';
    src: url('./fonts/FuturaPTHeavy.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaPTDemi';
    src: url('./fonts/FuturaPTDemi.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaPTBook';
    src: url('./fonts/FuturaPTBook.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'FuturaPTBook', sans-serif;
    align-items: center;
    margin: 0;
    background-color: white;
    color:  #424242;}
p{
    font-size: 16px!important;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'FuturaPTDHeavy', sans-serif;
    color:#144466;
}
ul{
    list-style-type: none;
    padding: 0;
}
i{
    color: #2096d7;
}
i:hover{
    color: #1278b7;
}
a{
    text-decoration: none;
    color: #2096d7;
}
a:hover{
    text-decoration: underline;
    color: #2096d7;
}
/* colors */
.textMainLabeur{
    color: #424242 !important;
}
.textTitle{
   color: #144466;
}
.textError{
    color: #d42a5b;
}
.textLink{
    color: #2096d7;
}
.mainColorIcon{
    color: #2096d7 ;
}
.secondaryColorIcon{
    color: #fb8c00;
}
/* custom components */
.icon-size {
    font-size: 20px;
    width: 20px;
    height: 20px;
}
.big-icon-size {
    font-size: 30px;
    width: 30px;
    height: 30px;
}
.small-icon-size {
    font-size: 15px;
    width: 15px;
    height: 15px;
}

.mainButton{
    border: solid 1px #46AFE8;
    /* background: linear-gradient(to bottom, #76C0F7, #2096d7); */
    /* background: linear-gradient(90deg, #2096d7, #1278b7); */
    /* color: black; */
    color: #192d52;
    font-weight: bold;
}
.mainButton:hover{
    background: linear-gradient(90deg, #2096d7, #2096d7);
    color: white;
}
.dangerButton{
    background: linear-gradient(90deg, #b21e4b, #7f1436);
    color: white;
}
.dangerButton:hover{
    background: linear-gradient(90deg, #b21e4b, #f2a2a2);
    color: black;
}
/* checkbox */
/* Cacher la checkbox native */
.form-check-input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Styliser le label pour simuler la checkbox */
.custom-checkbox {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-size: 16px;
}

/* Ajouter un carré personnalisé avant le label */
.custom-checkbox::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border: 2px solid rgb(32, 150, 215)!important;
    border-radius: 4px;
    background-color: white;
}

/* Ajouter une coche lorsque la checkbox est cochée */
.form-check-input:checked + .custom-checkbox::before {
    background-color: #2096d7!important;
    border-color: #2096d7!important;
}

.form-check-input:checked + .custom-checkbox::after {
    content: '\2713'; /* Symbole de coche */
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: white;
}

.popupInfo{
    background-color: #f1f8fe;
    border: 1px solid #87caf2;
    color: #11517b;
    border-radius: 5px;
    padding: 10px;
    margin: 10px;
}

/* Components */
footer{
    color: #424242;
}
.footer p, 
        .footer a, 
        .footer ul, 
        .footer li, 
        .footer span {
            font-size: 0.85rem; /* Ajustez selon vos besoins */
        }
.footer-social-links{
    display: flex;
    flex-direction: column;
    align-items: center ;
}
/*  */
 .navbar-brand span {
        font-size: 1.2rem;
    }

    .navbar-nav .nav-item {
        height: 100%;
    }

    .nav-link {
        font-family: 'FuturaPTDHeavy', sans-serif;
font-size: 18px;
        color: #2096d7 !important;
        transition: color 0.2s ease;
        display: flex;
        align-items: center;
        height: 100%;
        padding-left: 1rem;
        padding-right: 1rem;
        position: relative;
    }

    .nav-link:hover {
        color: #2096d7 !important;
    }

    .nav-link.active {
        font-weight: bold;
        color: #2096d7 !important;
        height: 100%;
        border-radius: 0;
        position: relative;
    }

    .nav-link.active::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 20px;
        height: 114px;
        background: url('http://numtech.fr/dad/formulaire/img/underline.png') no-repeat center;
        background-size: contain;
    }

    @media (max-width: 992px) {
        .nav-link.active::after {
            display: none;
        }
    }

    .navbar-toggler {
        border: none;
        color: #2096d7 !important;
    }

    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28209, 150, 215, 1%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    }

    .dropdown-menu {
        border-radius: 0.5rem;
    }

/* dashoboard user */
.filters{
    border: 1px solid #e0e0e0;
    padding: 10px;
    font-size: 12px;
    border-radius: 8px;
}
/* new request */
.text_info{

        font-size: 14px;

        font-style: italic;

}
.request_label{
    font-size: 10px;
}
.label_contrat{
    font-size: 12px;
    color: #144466;
}
.label_title {
    font-size: 11px;
    color: #144466;
}

.popover-header {
    background-color: #007bff;
    color: white;
    font-weight: bold;
}

.popover-body {
    font-size: 0.9rem;
}

.custom-switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.custom-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    background-color: #ccc;
    border-radius: 34px;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    border-radius: 50%;
    transition: .4s;
}

input:checked+.slider {
    background-color: #2196F3;
}

input:checked+.slider:before {
    transform: translateX(26px);
}

.label-text {
    margin-left: 10px;
}

.info-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #fb8c00;
    color: white;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    margin-left: 10px;
    cursor: pointer;

}

.switch-info {
    display: block;
    margin-top: 10px;
    font-size: 14px;
    font-style: italic;
    color: #666;
}
/* autocompletion */
/* Styles pour les suggestions d'autocomplétion */
.autocomplete-items {
    position: absolute;

    z-index: 99;

    left: 0;
    right: 0;
    background-color: #ffffff; /* Fond blanc pour correspondre au champ */
    max-height: 300px; /* Limiter la hauteur si beaucoup de résultats */
    overflow-y: auto; /* Activer la barre de défilement si nécessaire */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Ajouter un peu d'ombre */
}

/* Style de chaque suggestion */
.autocomplete-items div {
    padding: 10px;
    cursor: pointer;
    font-size: 16px;
    border-bottom: 1px solid #f1f1f1;
    color: #144466;
}

/* Dernière suggestion sans bordure inférieure */
.autocomplete-items div:last-child {
    border-bottom: none;
}

/* Ajouter un effet sur le survol */
.autocomplete-items div:hover {
    background-color: #f1f8fe; /* Changer le fond au survol */
    color: #007bff; /* Texte bleu sur le survol */
}

/* Style de l'élément actif */
.autocomplete-active {
    background-color: #2096d7 !important; /* Couleur d'arrière-plan sur la sélection */
    color: white !important; /* Couleur de texte pour correspondre */
}
/* badge */
.badge {
    font-size: 0.85rem;
    padding: 0.3em 0.6em;
}
.bg-contract{
    background-color: #F2C36B;
    color: #032340;
    font-weight: 400;
}
.bg-out-contract{
    background-color: #F2865E;
    color: #032340;
    font-weight: 400;
}
.bg-status{
    background-color: #CAD959;
    color: #032340; 
    font-weight: 400;
}
.badge.bg-primary { background-color: #007bff; color: white; }
.badge.bg-success { background-color: #28a745; color: white; }
.badge.bg-danger{ background-color: #dc3545; color: white; }
.hr_card{
    border: #007bff;
}
/* user dashboard filtres  */
/* Uniformité des largeurs */
.uniform-width {
    width: 100%; /* Prend toute la largeur disponible */
    max-width: 300px; /* Limite maximale commune pour tous les champs */
    min-width: 300px; /* Assure une taille minimale identique */
}

/* Espacement et alignement */
.filter-form .row .col-lg-3 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.filter-form .row .col-12 {
    text-align: center; /* Centre le bouton */
}

/* Améliorations visuelles */
.filter-form .form-label {
    font-weight: bold;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.filter-form .form-select,
.filter-form .form-control {
    border-radius: 6px;
    border: 1px solid #ddd;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Focus esthétique */
.filter-form .form-select:focus,
.filter-form .form-control:focus {
    border-color: #44b1e9;
    box-shadow: 0 0 5px rgba(68, 177, 233, 0.5);
}

/* Style du bouton */
.filter-form .btn-primary {
    background-color: white;
    border-color: #44b1e9;
    color: #44b1e9;
    font-weight: bold;
    padding: 10px 20px;
    transition: background-color 0.3s ease, transform 0.2s ease;
    width: 200px; /* Ajoute une largeur pour que le bouton soit bien visible */
}

.filter-form .btn-primary:hover {
    background-color: #3590c4;
    color: white;
    transform: translateY(-2px);
}

/* Responsivité */
@media (max-width: 768px) {
    .uniform-width {
        max-width: 100%;
    }
}

.transition-card:hover {
    transform: scale(1.02);
    transition: all 0.3s ease-in-out;
}

.bg-gradient-primary {
    background: linear-gradient(45deg, #C94378, #A13260);
}

.bg-gradient-secondary {
    background: linear-gradient(45deg, #61C9A8, #4FA68A);
}

.bg-gradient-accent {
    background: linear-gradient(45deg, #2D4A8A, #1E3366);
}

.bg-gradient-warning {
    background: linear-gradient(45deg, #E3B23C, #C7922E);
}
