/* ========================================================================== */
/* SECTION CSS GENERAL                                                        */
/* ========================================================================== */

/* NOTE ---------------- Normalisation ---------------- */
html { font-family: 'Arial', sans-serif; }
body { background-color: #f7f6f6; margin: 0 0px; font-size: 18px; font-family: 'Arial', sans-serif; }

/* NOTE ---------------- Font ---------------- */
@font-face {
    src: url('../fonts/DINPro-Bold.otf');
    font-family:'DinBold';
    font-style: normal;
}
@font-face {
    src: url('../fonts/DINPro.otf');
    font-family:'Din';
    font-style: normal;
}

/* NOTE ---------------- Taille + Block ---------------- */
.container { max-width: 1200px; margin: 0 auto; padding: 0 15px !important; }
.container_full { max-width: 1800px; margin: 0 auto; }
.fullw { width: 100%; }
.w80 { width: 80%; }
.w75 { width: 75%; }
.w70 { width: 70%; }
.w69 { width: 69%; }
.w66 { width: 66%; }
.w60 { width: 60%; }
.w50 { width: 50%; }
.w45 { width: 45%; }
.w33 { width: 33%; }
.w30 { width: 30%; }
.w25 { width: 25%; }
.w24 { width: 24%; }
.w20 { width: 20%; }
.w15 {width: 15%;}

.min-w-auto {min-width: auto;}

.h60px {height: 60px;}
.h-50 { height: 50%; }
.h-100 { height: 100%; }
.h-full { height: 100vh; }
.min-h-full { min-height: 100vh; }

.object-fit-cover {object-fit: cover;}

.h-minContent { height: min-content; }    
.heightFixed-scrollY { overflow: auto; overflow-x: none; }

/* NOTE ---------------- Texte ---------------- */
b {font-weight: 700; }
.verySmall-text { font-size: 9px; }
.small-text { font-size: 14px; }
/* h1 { font-size: 30px; font-weight: 800; } */
/* h2 { font-size: 30px; font-weight: 800; }
h3 { font-size: 30px; font-weight: 500; }
h4 { font-size: 26px; font-weight: 500; }
h5 { font-size: 20px; font-weight: 500; } */
.font-14 { font-size: 14px;}
.font-20 { font-size: 20px;}
.font-26 { font-size: 26px;}
.font-30 { font-size: 30px;}

.titre { font-family: 'DinBold'; text-transform: uppercase; font-size: 26px; }
.font-dina { font-family: 'DinBold'; }
.font-upper { text-transform: uppercase;  }
.titre-logo { font-family: 'DinBold'; text-transform: uppercase; font-size: 28px; line-height: 38px; }

.fontWeight-400 { font-weight: 400; }
.fontWeight-500 { font-weight: 500; }
.fontWeight-700 { font-weight: 700; }
.fontWeight-900 { font-weight: 900; }

.textTransform-uppercase { text-transform: uppercase; }

/* NOTE ---------------- Texte decoration ---------------- */
.fontDecoration-barre { text-decoration: line-through; }

/* NOTE ---------------- Texte line height ---------------- */
.lineH-10 { line-height: 10px; }
.lineH-20 { line-height: 20px; }
.lineH-40 { line-height: 40px; }

/* NOTE ---------------- Vertical alignement ---------------- */
.vertAlign-middle { vertical-align: middle !important; }
.vertAlign-top { vertical-align: top; }
.vertAlign-bottom { vertical-align: bottom; }
.vertAlign-right { vertical-align: right; }
.vertAlign-left { vertical-align: left; }

/* NOTE ---------------- Texte alignement ---------------- */
.textAlign-center { text-align: center; }
.textAlign-right { text-align: right; }
.textAlign-left { text-align: left; }

/* NOTE ---------------- Flex option ---------------- */
.flexWrap-inherit { flex-wrap: inherit; }
.flexWrap-wrap { flex-wrap: wrap; }
.flexDirection-column { flex-direction: column; }

/* NOTE ---------------- white-space ---------------- */
.space-nowrap { white-space: nowrap; }

/* NOTE ---------------- Texte color ---------------- */
.text-noir { color: #000000; }
.text-gris { color: #888888; }
.text-grisClair { color: #c0c0c0; }
.text-bleu { color: #029fd5; }
.text-bleuFonce { color: #043847; }
.text-white { color: #FFFFFF; }

/* NOTE ---------------- Icone ---------------- */
.big-icon { width: 60px; height: auto; }
.medium-icon { width: auto; height: 40px; }
.small-icon { width: 15px; height: auto; }
.icon { width: 20px; height: auto; }
.icon-input { width: 20px; height: auto; position: absolute; top: 13px; right: 10px; }

/* NOTE ---------------- SVG color ---------------- */
.svg-noir { fill: #000000; }
.svg-gris { fill: #828585; }
.svg-bleu { fill: #029fd5; }
.svg-bleuFonce { fill: #003a45; }
.svg-white { fill: #FFFFFF; }

/* NOTE ---------------- Border color ---------------- */
.border-noir { border-color: #000000; }
.border-grisClair { border-color: #ededed; }
.border-gris { border-color: #828585; }
.border-bleu { border-color: #029fd5; }
.border-bleuFonce { border-color: #003a45; }
.border-white { border-color: #FFFFFF; }

/* NOTE ---------------- Background color ---------------- */
.block-noir { background-color: #000000; }
.block-blanc { background-color: #ffffff; }
.block-gris { background-color: #f7f7f7; }
.block-bleu { background-color: #029fd5; }
.block-bleuFonce { background-color: #003a45; }
.block-vert { background-color: #67b23c; }
.block-rose { background-color: #e92681; }

/* NOTE ---------------- Display ---------------- */
.disp-flex { display: flex; }
.disp-inline-flex { display: inline-flex; }
.disp-block { display: block; }
.disp-inline-block { display: inline-block; }
.disp-none { display: none; }

/* NOTE ---------------- Position ---------------- */
.pos-absolute { position: absolute; }
.pos-relative { position: relative; }
.pos-fixed { position: fixed; }
.pos-sticky { position: sticky; }

/* NOTE ---------------- Margin ---------------- */
.marg-auto { margin: auto; }
.marg-0-auto { margin: 0 auto; }
.marg-0 { margin: 0; }

.mtop-xxs { margin-top: 5px; }
.mtop-xs { margin-top: 10px; }
.mtop-xss { margin-top: 15px; }
.mtop-s { margin-top: 20px; }
.mtop-ssx { margin-top: 25px; }
.mtop-sx { margin-top: 30px; }
.mtop-m { margin-top: 40px; }
.mtop-l { margin-top: 60px; }
.mtop-ls { margin-top: 80px; }
.mtop-lx { margin-top: 100px; }

.mbot-0 { margin-bottom: 0px; }
.mbot-xxs { margin-bottom: 5px; }
.mbot-xs { margin-bottom: 10px; }
.mbot-xss { margin-bottom: 15px; }
.mbot-s { margin-bottom: 20px; }
.mbot-ssx { margin-bottom: 25px; }
.mbot-sx { margin-bottom: 30px; }
.mbot-sxs { margin-bottom: 35px; }
.mbot-m { margin-bottom: 40px; }
.mbot-l { margin-bottom: 60px; }
.mbot-ls { margin-bottom: 80px; }
.mbot-lx { margin-bottom: 120px; }

.mright-0 { margin-right: 0px; }
.mright-xxs { margin-right: 5px; }
.mright-xs { margin-right: 10px; }
.mright-xss { margin-right: 15px; }
.mright-s { margin-right: 20px; }
.mright-ssx { margin-right: 25px; }
.mright-sx { margin-right: 30px; }
.mright-m { margin-right: 40px; }
.mright-l { margin-right: 60px; }
.mright-l { margin-right: 60px; }
.mright-ls { margin-right: 80px; }

.mleft-0 { margin-left: 0px; }
.mleft-xxs { margin-left: 5px; }
.mleft-xs { margin-left: 10px; }
.mleft-xss { margin-left: 15px; }
.mleft-s { margin-left: 20px; }
.mleft-ssx { margin-left: 25px; }
.mleft-sx { margin-left: 30px; }
.mleft-m { margin-left: 40px; }
.mleft-l { margin-left: 60px; }
.mleft-ls { margin-left: 80px; }
.mleft-25 { margin-left: 25%; }


/* NOTE ---------------- Padding ---------------- */
.p-0 { padding: 0px; }
.p-s { padding: 20px; }
.p-sx { padding: 30px; }
.p-sxs { padding: 35px; }
.p-m { padding: 40px; }

.ptop-0 { padding-top: 0px; }
.ptop-xxs { padding-top: 5px; }
.ptop-xs { padding-top: 10px; }
.ptop-xss { padding-top: 15px; }
.ptop-s { padding-top: 20px; }
.ptop-sx { padding-top: 30px; }
.ptop-m { padding-top: 40px; }
.ptop-l { padding-top: 60px; }

.pbot-0 { padding-bottom: 0px; }
.pbot-xxs { padding-bottom: 5px; }
.pbot-xs { padding-bottom: 10px; }
.pbot-xss { padding-bottom: 15px; }
.pbot-s { padding-bottom: 20px; }
.pbot-sx { padding-bottom: 30px; }
.pbot-m { padding-bottom: 40px; }
.pbot-l { padding-bottom: 60px; }

.pright-0 { padding-right: 0px; }
.pright-xxs { padding-right: 5px; }
.pright-xs { padding-right: 10px; }
.pright-s { padding-right: 20px; }
.pright-sx { padding-right: 30px; }
.pright-m { padding-right: 40px; }
.pright-l { padding-right: 60px; }
.pright-135px { padding-right: 135px; }

.pleft-0 { padding-left: 0px; }
.pleft-xxs { padding-left: 5px; }
.pleft-xs { padding-left: 10px; }
.pleft-xss { padding-left: 15px; }
.pleft-s { padding-left: 20px; }
.pleft-sx { padding-left: 30px; }
.pleft-m { padding-left: 40px; }
.pleft-l { padding-left: 60px; }
.pleft-135px { padding-left: 135px; }

/* NOTE ---------------- Bouton ---------------- */
a { color: inherit; }
a:hover { color: inherit; text-decoration: none; }
.btn { border-radius: 30px; border: 2px #6c757d solid; font-size: 14px; min-width: 190px; font-weight: 200; min-height: 40px; line-height: 30px; }
    .btn:active .btn:focus, .btn.focus, .btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active, .btn:not(:disabled):not(.disabled):active:focus, .btn:not(:disabled):not(.disabled).active:focus { box-shadow: none; }

.btn-bleu-plein { color: white; border-color: #029fd5 !important; background-color: #029fd5; } 
    .btn-bleu-plein:hover { color: white; border-color: #029fd5; background-color: #029fd5; }
    
.btn-rouge-plein { color: white; border-color: #bc1631 !important; background-color: #bc1631; } 
    .btn-rouge-plein:hover { color: white; border-color: #e2273e; background-color: #e2273e; }
    
.btn-bleuFonce-plein { color: white; border-color: #04364e !important; background-color: #04364e; } 
    .btn-bleuFonce-plein:hover { color: white; border-color: #04364e; background-color: #04364e; }
    
/* NOTE ---------------- Input ---------------- */
input { font-size: 16px; }
input:focus { border-color: transparent; }
input.inputBorder-black { border: 1px #000000 solid; }
input[type=number]::-webkit-inner-spin-button,  input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; }
.ui-datepicker {z-index:100 !important;}

.custom-control-input:focus ~ .custom-control-label::before { box-shadow: none; }
.form-control:focus { box-shadow: none; border-color: #04364e; }
.form-control { box-shadow: none; border-color: #04364e; }
textarea.form-control { border-radius: 30px; padding: .8rem .75rem; }
.form-control { font-size: 16px; color: #000000; }
.input
.inputRadius-left { border-top-left-radius: 28px; border-bottom-left-radius: 28px; padding-left: 20px; }  
.inputRound { height: 45px; border: 1px #033846 solid; border-radius: 40px; padding-left: 20px; overflow: hidden;}  
.inputRound:focus { height: 45px; border: 1px #033846 solid; border-radius: 40px; padding-left: 20px; } 
.label-bold label { font-weight: 900; }

.divMultiselect .btn-group { width: 100%; text-align: left; }
    .divMultiselect button { width: 100%; text-align: left; border: 1px #033846 solid ; }
    .divMultiselect .dropdown-toggle::after { position: absolute; right: 15px; top: 50%; z-index: 10;}

textarea.form-control:focus{height:auto;}

/* NOTE ---------------- Icone ---------------- */
.round-icone { padding: 10px; border-radius: 91px; }
.smallRound-icone { padding: 10px; border-radius: 91px; }

/* NOTE ---------------- Cursor ---------------- */
.pointer { cursor: pointer; }

/* NOTE ---------------- Datatable ---------------- */
table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled {
	cursor: pointer;
	*cursor: hand;
	background-repeat: no-repeat;
	background-position: top 15px right 0;
}
table.dataTable thead .sorting:last-of-type {background:none !important;}
table.dataTable thead .sorting {background-image:url('../medias/images/sort_both.png');}
table.dataTable thead .sorting_desc {background-image:url('../medias/images/sort_desc.png');}
table.dataTable thead .sorting_asc {background-image:url('../medias/images/sort_asc.png');}
.dataTables_filter + .filtres {display:none;}

/* !SECTION CLOSE - CSS GENERAL                                               */


/* ========================================================================== */
/* SECTION CSS error-success                                                  */
/* ========================================================================== */

.couleur_error  { background-color: #e74c3c;}
.couleur_success { background-color: #27ae60;}

/* !SECTION CLOSE - CSS error-success                                         */


/* ========================================================================== */
/* SECTION CSS TOPBAR - NAVBAR                                                */
/* ========================================================================== */

#topbar-main-right { min-height: 50px; }

#sidenav-main-logo .logo-responsive {display:none;}
#bouton-deco-responsive {display:none;}
.shadowNavBar { box-shadow: 5px 5px 20px #e7e6e6; z-index: 10; }
.shadowTopBar { box-shadow: 5px 5px 20px #e7e6e6; z-index: 9; }
.plogoNavBar { padding: 40px 70px; }
.block-logo { min-height: 180px; }

/* !SECTION CLOSE - CSS TOPBAR - NAVBAR                                       */


/* ========================================================================== */
/* SECTION CSS PAGE CONNEXION                                                 */
/* ========================================================================== */

.backgroundBlock-connexion { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url('../img/structure/fond_connexion.jpg'); }

/* !SECTION CLOSE - CSS PAGE CONNEXION                                        */


/* ========================================================================== */
/* SECTION CSS PAGE HOME                                                      */
/* ========================================================================== */

.blockLancerDiag { height: 150px; }
    .backgroundBlock-LancerDiag { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url('../img/structure/fond_connexion.jpg'); }

.shadowBlock { box-shadow: 5px 5px 20px #e7e6e6; z-index: 5; }

.tiret-titre { width: 30px; height: 10px; display: inline-flex; }
           
/* !SECTION CLOSE - CSS PAGE HOME                                             */

/* ========================================================================== */
/* SECTION CSS ELEMENT PLANNING                                               */
/* ========================================================================== */
.titreSemaine {width: 445px;}

.tg  {border-collapse:collapse;border-spacing:0;}
.border-0 {border:0px}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;border-color:black;}
.tg .tg-cly1{text-align:left;vertical-align:middle}
.tg .tg-baqh{text-align:center;vertical-align:middle}
.tg .tg-0lax{text-align:center;vertical-align:middle;}
.libre {color:#c0c0c0; font-size: 14px;}
.demiJour-libre:hover { background-color : #F2F2F2; }
.hTdPlanning { height: 84px;}

.posePlanifie { background-color: #67b23c; color: white;}
.posePlanifie:hover { background-color: #67b23c; color: white; }

.indispo { background-color: #d5d8da96; cursor: not-allowed;}

.today {background-color: #74b9f485}

.selectedNewPose { background-color: #3498db81; color: white; }
    .selectedNewPose .libre { color: white; }
.selectedNewPose:hover { background-color: #3498db81; color: white; }

/* !SECTION CLOSE - CSS ELEMENT PLANNING                                      */                                           


/* ========================================================================== */
/* SECTION CSS RESPONSIVE MIN WIDTH 576 PX                                    */
/* ========================================================================== */
@media (min-width: 576px){
    
    /* ---------------------------------------------------------------------- */
    /* SECTION GLOBAL */
    /* ---------------------------------------------------------------------- */
    .modal-dialog {
        max-width: 800px !important;
        margin: 1.75rem auto;
    }
    /* !SECTION FIN - GLOBAL */

}
/* !SECTION CLOSE - SS RESPONSIVE MIN WIDTH 576 PX                            */


/* ========================================================================== */
/* SECTION CSS RESPONSIVE MAX WIDTH 1024 PX                                    */
/* ========================================================================== */
@media screen and (max-width: 1024px) {

    /* ---------------------------------------------------------------------- */
    /* SECTION GLOBAL */
    /* ---------------------------------------------------------------------- */
    .btn {font-size:18px;}
    .bloc-main-content {padding:20px;padding-top:30px;}
    /* !SECTION FIN - GLOBAL */

    /* ---------------------------------------------------------------------- */
    /* SECTION SIDENAV PRINCIPALE */
    /* ---------------------------------------------------------------------- */
    #sidenav-main {width: 10%;}
    #sidenav-main .flexDirection-column {height: 90% !important;}
    #sidenav-main-contenu .nav-element p {display:none;}
    #sidenav-main-logo .logo-default {display:none;}
    #sidenav-main-logo .logo-responsive {display:block;padding:0;padding-top:10px;}
    #bouton-deco-default {display:none;}
    #bouton-deco-responsive {display:block;}
    #bouton-deco-responsive img {transform:scale(0.8);}
    /* !SECTION FIN - SIDENAV PRINCIPALE */

    /* ---------------------------------------------------------------------- */
    /* SECTION TOPBAR PRINCIPALE */
    /* ---------------------------------------------------------------------- */
    #topbar-main-right {margin-right:20px; min-height: 50px;}
    /* !SECTION FIN - TOPBAR PRINCIPALE */
    /*  */

    /* ---------------------------------------------------------------------- */
    /* SECTION PAGE: Connexion */
    /* ---------------------------------------------------------------------- */
    #connexion-col-right {padding-left:30px;padding-right:30px;}
    #connexion-contenu {margin-top:40px;}
    /* !SECTION FIN - PAGE: Connexion */

    /* ---------------------------------------------------------------------- */
    /* SECTION PAGE: Accueil */
    /* ---------------------------------------------------------------------- */
    #home-prochains-diagnostics {margin-top:-10px;padding-right:0;margin-bottom:20px;}
    #home-derniers-diagnostics {padding-left:0;}
    /* !SECTION FIN - PAGE: Accueil */

}
/* !SECTION CLOSE - CSS RESPONSIVE MAX WIDTH 1024 PX                           */