html {
    height: 100%;
    box-sizing: border-box;
}

body {
    min-height: 100%;
}

a {
    color: green;
}

.dxflRequired,
.dxgv .dxeErrorCell {
    display: none;
}

.dxeReadOnly input {
    color: rgba(0,0,0,.5) !important;
}

.dxpcDropDown .dxlbd {
    overflow-x: hidden !important;
}

/* couleurs */
.headerMenu,
body.login #top {
    background-color: #96BF0D;
}

#HeaderMenu,
body.login #middle {
    background-color: #BDD06B;
}

#ariane,
body.login #flLogin,
body.login #infos {
    background-color: #DCE4AA;
}

/* HEADER */
.headerTop .templateTitle {
    position: relative;
}

    .headerTop,
    .headerTop .templateTitle a,
    .headerTop .loginControl a {
        color: white;
    }

        .headerTop .templateTitle .connected {
            position: absolute;
            white-space: nowrap;
            bottom: -1em;
            font-size: 14px;
            left: 0;
        }

        .headerTop .loginControl {
            margin: 12px 25px 12px;
        }

            .headerTop .loginControl a.logoff {
                border: none;
                font-size: 0;
                color: transparent;
            }

            .headerTop .loginControl a.assistance {
                border: none;
                text-decoration: underline;
            }

            .headerTop .loginControl a.logoff,
            .headerTop .loginControl .info {
                display: inline-block;
                vertical-align: middle;
            }

            .headerTop .loginControl .info {
                border-right: 1px solid rgba(255,255,255,.75);
                padding-right: 10px;
                margin-right: 5px;
                text-align: right;
            }


@media screen and (max-width: 639px) {
    .headerTop .loginControl {
        margin: 18px 25px 18px;
    }

    .loginControl .info {
        display: none !important;
    }
}

#HeaderMenu {
    border: none;
}

    #HeaderMenu .dxm-selected {
        background: rgba(255,255,255,1);
    }

    #HeaderMenu .dxm-hovered {
        background: rgba(0,0,0,.15);
    }

#version {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

/* FIL D'ARIANE */

#ariane {
    padding: 3px 10px;
    font-size: .8em;
}

    #ariane a {
        text-decoration: none;
        color: black;
    }

        #ariane a:hover {
            text-decoration: none;
            color: white;
        }

    #ariane span:not(:last-child):after {
        content: " > ";
        color: black;
    }


/***/
#RootSplitter_0 {
    background: #96BF0D;
    /*box-shadow: 0 0 10px rgba(0,0,0,.5);*/
}

#RootSplitter_1.formulaire {
    background: #F8F8F8;
}

#RootSplitter_0_CC,
#RootSplitter_0_CC > .headerMenu {
    background-image: url("/Content/Images/logo.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    background-size: 70px;
}

    #RootSplitter_0_CC .templateTitle,
    #RootSplitter_0_CC > .headerMenu .templateTitle {
        margin-left: 90px;
    }

/*  */
@media screen and (min-width: 640px) {
    #MainPane {
        padding: 10px;
    }
}

#MainPane .contentPane {
    text-align: center;
}

    #MainPane .contentPane > * {
        text-align: left;
    }

/* Boutons */

.dxbButton,
.dxBB.dxucBrowseButton {
    padding: 0;
    border-width: 1px;
    border-radius: 4px;
    border-color: rgba(0,0,0,.25);
    background: white;
    font-weight: bold !important;
}

    .dxbButton > .dxb,
    .dxucBrowseButton > a {
        padding: .75em 1.25em !important;
        background: linear-gradient(to bottom, transparent, rgba(0,0,0,.05));
        border: none !important;
    }

.dxucBrowseButton > a {
    display: block;
}

.dxbButtonHover > .dxb,
.dxucBrowseButtonHover > a {
    background-color: rgba(0,0,0,.1) !important;
}

.dxbButtonPressed > .dxb,
.dxucBrowseButtonPressed > a {
    background-color: rgba(0,0,0,.2) !important;
}

.dxbButton.dxbDisabled {
    border-color: gray;
    opacity: .33333;
}
/*.dxbButton.dxbDisabled > .dxb {
    background-color: rgba(128,128,128,.75) !important;
}*/

.dxbButton.BtnNouveau,
.BtnNouveau .dxucBrowseButton,
.dxbButton.BtnAction {
    background-color: #35A8D8; /*dodgerblue;*/
}

.dxbButton.BtnPlus {
    background-image: url("/Content/Images/Boutons/plus.svg");
    width: 22px;
    height: 22px;
    background-size: contain;
    border-radius: revert;
    border-style: revert;
    background-color: transparent;
}

.dxbButton.BtnSupprimer {
    background-color: #BD0926; /*orangered;*/
    font-weight: 900;
}

.dxbButton.BtnMoins {
    background-image: url("/Content/Images/Boutons/moins.svg");
    width: 22px;
    height: 22px;
    background-size: contain;
    border-radius: revert;
    border-style: revert;
    background-color: transparent;
}

.dxbButton.BtnEnregistrer,
.dxbButton.BtnValider,
.dxbButton.BtnTransferer {
    background-color: #96BF0D; /*limegreen;*/
}

.dxbButton.BtnSync {
    background-color: #FF9F00;
}

.dxbButton.BtnActionInfo {
    background-color: #FFD400;
}

.dxbButton.BtnBrouillon {
    background-color: #A18D7F;
}

.dxbButton.BtnExcel {
    color: white;
    background-color: #207246 !important;
}

.dxbButton.BtnActionCritique {
    background-color: #C74B13; /*orangered;*/
}

.dxbButton.BtnNouveau, .dxbButton.BtnSupprimer, .dxbButton.BtnEnregistrer, .dxbButton.BtnValider, .dxbButton.BtnTransferer, .dxbButton.BtnAction, .dxbButton.BtnActionInfo, .dxbButton.BtnActionCritique, .dxbButton.BtnBrouillon,
.BtnNouveau .dxucBrowseButton a {
    color: white;
}

    .dxbButton.BtnActionInfo .dx-vam {
        text-shadow: 0 0 1px black;
    }

.dxbButton.BtnSwitch .dxb:before {
    content: " ";
    display: inline-block;
    vertical-align: top;
    height: 1em;
    padding: 2px 6px 2px 0px;
    width: 1em;
    background: url("/Content/Images/Boutons/SwitchOFF.png") center left no-repeat;
    background-size: contain;
}

.dxbButton.BtnSwitch[data-state="on"] {
    background-color: #e0e0e0;
}

    .dxbButton.BtnSwitch[data-state="on"] .dxb:before {
        background-image: url("/Content/Images/Boutons/SwitchON.png");
    }

.dxbButton.BtnDiscret {
    color: green;
    border: 1px solid transparent;
}

    .dxbButton.BtnDiscret,
    .dxbButton.BtnDiscret .dxb {
        background: transparent !important;
    }

.dxbButtonHover.BtnDiscret .dxb .dx-vam {
    text-decoration: underline;
}

.dxbButton.BtnDiscret .dxb .dx-vam:before {
    content: "> ";
    font-weight: normal;
}

/* ButtonEdit buttons */
.dxeButton.BtnDisabled {
    color: #808080 !important;
    cursor: default;
    background: #e6e6e6 url('/DXR.axd?r=1_173-MCVms') repeat-x top !important;
    border: 1px solid #c3c3c3 !important;
}

.dxeButton.BtnDisabled:hover {
    color: #808080 !important;
    cursor: default;
    background: #e6e6e6 url('/DXR.axd?r=1_173-MCVms') repeat-x top !important;
    border: 1px solid #c3c3c3 !important;
}

/* GRIDVIEW DOSSIERS */
#GridViewDossiers .dxgvDataRow.pb,
#FournisseursGridView .dxgvDataRow.pb,
#PlanTVAGridView .dxgvDataRow.pb,
#FacturesGridView .dxgvDataRow.pb {
    background: linear-gradient(to bottom, #CDA6A6, #FFD8D8 25%);
}

.dxgv .dxgvDataRow.enattente {
    background: #FFFFD5;
}

/* GRIDVIEW FOURNISSEURS */

table.ActionBtns {
    width: 100%;
}

    table.ActionBtns td {
        padding: 0 5px;
    }

    table.ActionBtns tr.HeadActionBtns td {
        white-space: nowrap;
        font-weight: bold;
    }

@media screen and (max-width: 949px) {
    table.ActionBtns {
        display: block;
    }

        table.ActionBtns td {
            display: inline-block;
            padding-bottom: 10px;
        }
}
/* PDF */
#PdfIframe[src=""], #PdfIframe[src="about:blank"] {
    display: none;
}

/* FORM LAYOUT */
.formulaire .dxpnlControl > .dxflFormLayout {
    margin: auto;
}

.dxflFormLayout .dxflGroupCell .dxflGroupBox {
    background: white;
    padding: 15px;
}

.dxflFormLayout input.dxeEditArea {
    padding: .25em !important;
}

.dxflFormLayout .dxflCaption {
    padding-top: 0;
    vertical-align: middle;
}

/* LOGIN PAGE */


body.login #middle #flLogin {
    margin: auto;
    padding: 10px 30px;
    border-radius: 4px;
}

body.login #RootSplitter_0 {
    position: relative;
}

@keyframes ApparitionInfos {
    0% {
        max-height: 0;
        overflow: hidden;
    }

    100% {
        max-height: 1500px;
        overflow: auto;
    }
}

body.login .deroul {
    -moz-animation: ApparitionInfos 2s .25s forwards;
    animation: ApparitionInfos 2s .25s forwards;
    max-height: 0;
    overflow: hidden;
}

@media screen and (min-width: 640px) {
    body.login #RootSplitter_0 {
        background-color: white;
    }

    body.login .headerTop,
    body.login .headerTop .templateTitle a,
    body.login .headerTop .loginControl a {
        color: black;
    }

    body.login #top {
        min-height: 250px;
        position: relative;
        color: white;
    }

        body.login #top > div {
            position: absolute;
            bottom: 15%;
            left: 0;
            right: 0;
            text-align: center;
            font-size: 48px;
        }

        body.login #top #sous-titre {
            font-size: .6em;
        }




    body.login #middle {
        padding: 30px 0;
    }

        body.login #middle #flLogin #UserName_I,
        body.login #middle #flLogin #Password_I {
            font-size: 1.5em !important;
        }

    body.login #bottom {
        height: 100px;
    }

    body.login #MainPane {
        padding: 0 !important;
    }

    body.login #RootSplitter_1_CC {
        padding: 0 !important;
    }
}

@media screen and (max-width: 639px) {

    body.login #top,
    body.login .headerTop .loginControl a {
        display: none;
    }

    body.login .deroul {
        margin-bottom: 2px;
        animation: none;
        -moz-animation: none;
        max-height: initial;
        overflow: auto;
    }
}

/* NOTIFICATIONS */


@-moz-keyframes DelaiNotif {
    0% {
        display: block;
        opacity: 1;
        bottom: 0;
    }

    75% {
        display: block;
        opacity: 1;
        bottom: 0;
    }

    99% {
        display: block;
        opacity: 0;
        bottom: 0;
    }

    100% {
        display: none;
        bottom: -999em;
    }
}

@keyframes DelaiNotif {
    0% {
        display: block;
        opacity: 1;
        bottom: 0;
    }
    /*75% {
        display: block;
        opacity: 1;
        bottom: 0;
    }

    99% {
        display: block;
        opacity: 0;
        bottom: 0;
    }

    100% {
        display: none;
        bottom: -999em;
    }*/
    75% {
        display: block;
        opacity: 1;
        bottom: 0;
    }

    99% {
        display: block;
        opacity: 1;
        bottom: -100%;
    }

    100% {
        display: none;
        opacity: 0;
        bottom: -999em;
    }
}

#notif {
    display: block;
    position: fixed;
    bottom: -999em;
    right: 20px;
    z-index: 100000;
    font-size: .9em;
    width: 200px;
    -moz-animation: DelaiNotif 4s .5s forwards;
    animation: DelaiNotif 4s .5s forwards;
}

#notifTitre {
    background: #96BF0D;
    border-radius: 5px 5px 0 0;
    color: white;
    padding: 3px 10px;
}

#notifMessage {
    background: white;
    border-left: 1px solid #96BF0D;
    border-right: 1px solid #96BF0D;
    padding: 10px;
    text-align: center;
}

/* CONFIGURER LE LOGICIEL */
#flParam .dxflGroupBox.collapsed,
#flParam .dxflGroupBox.expanded {
    display: block;
}

#flParam .dxflGroupBox.collapsed {
    max-height: 55px;
    overflow: hidden;
}

#flParam .dxflGroupBox h2 a.expand {
    visibility: hidden;
}


@keyframes ExpandPart {
    0% {
        overflow: hidden;
        max-height: 55px;
        display: block;
    }

    100% {
        max-height: 1000px;
    }

    100% {
        overflow: visible;
        display: table;
    }
}

#flParam .dxflGroupBox.expanded {
    animation: ExpandPart 1s linear 0s 1 forwards;
}

#flParam .dxflGroupBox.collapsed h2 a.expand {
    float: right;
    visibility: visible !important;
    color: black;
    text-decoration: none;
}

#flParam .valigntop {
    vertical-align: top;
}

/* PREVISU */
#Prev {
    border-collapse: collapse;
}

    #Prev .dernierelignefact td {
        border-bottom: 3px solid rgba(0,0,0,.2) !important;
    }

    #Prev .premierelignefact td {
        border-top: 2px solid rgba(0,0,0,.2) !important;
    }

/* ACCUEIL EXPCLIENT */
#AccueilClient h2 {
    font-size: 2em;
}


ul.cartes {
    padding: 0;
    margin: 0;
}

    ul.cartes li {
        display: inline-block;
        width: 270px;
        height: 340px;
        background-color: white;
        border: 1px solid black;
        border-radius: 5px;
        padding: 10px;
        position: relative;
        margin: 10px 8px;
    }

        ul.cartes li:hover {
            box-shadow: rgba(0,0,0,.5) 0 0 20px;
        }

        ul.cartes li > a {
            position: absolute;
            top: 10px;
            right: 10px;
            bottom: 10px;
            left: 10px;
            color: black;
            text-decoration: none;
        }

            ul.cartes li > a > img {
                width: 60%;
                margin: 10%;
            }

            ul.cartes li > a > strong {
                display: block;
                font-size: 1.5em;
                margin-bottom: .5em;
            }

        ul.cartes li .link {
            text-decoration: underline;
        }

            ul.cartes li .link:hover {
                text-decoration: none;
            }

        ul.cartes li a span strong {
            font-style: normal;
            color: green;
        }



@media screen and (max-width: 1280px) {
    ul.cartes {
        width: 640px;
    }
}

@media screen and (max-width: 670px) {
    ul.cartes {
        width: 100%;
    }

        ul.cartes li {
            width: auto;
            height: auto;
            display: block;
        }

            ul.cartes li > a {
                position: static;
            }
}


/* SAISIE MANUELLE */
#ContainerPopupSaisieManuelle {
    display: flex;
    flex-direction: row;
}

#ContainerPdfIframeSaisie {
    width: 50%;
    height: calc(90vh - 50px);
    position: sticky;
    top: 0px;
}

#PdfIframeSaisie {
    height: 100%;
    box-sizing: border-box;
    border: 2px solid black;
    width: 100%;
    background: url(/Content/Images/loading.gif) center center no-repeat;
}

#ContainerSaisieManuelle {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#ContainerPagination {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}

.dxflNestedControlCell.doublon {
    position: relative;
}

    .dxflNestedControlCell.doublon:after {
        content: url("/Content/Images/doublon.png");
        position: absolute;
        top: -4px;
        right: 0px;
    }

.warningSuppressionMessage {
    width: 100%;
    padding: 8px 20px;
    border-radius: 6px;
    background-color: rgba(255, 0, 0, 0.41);
    font-weight: bold;
}

.deleteButton {
    float: right;
    background-color: #BD0926;
    color: white;
}

.centered {
    margin: 0 auto;
    float: none !important;
}

#BtnEclater {
    background-size: 100%;
    border : none;
    background-color : transparent;
}

    #BtnEclater .dxb {
        padding: 0.4em 1em !important;
        background : none;
    }

.PopupSaisieManuelleSection {
    background-color: rgba(127, 191, 63, 0.15) !important;
}

    .PopupSaisieManuelleSection > span{
        background-color : transparent;
    }
    /* Tab */
    .activeTab {
        border-color: rgb(150, 191, 13) !important;
    }

.defaultTab {
    font-size: 15px !important;
    font-weight: bold !important;
}

    .defaultTab.tabHover {
        background: #eee !important;
    }

/* DECOUPAGE */
#PopupDecoupage {
    width: 70%;
}

    #PopupDecoupage div.PopUpContent {
        max-height: none;
        overflow: hidden;
        width: 100%;
    }

#PopupDecoupageContent {
    display: flex;
    flex-wrap: wrap;
}

#DecoupagePageContainer {
    display: inline-flex;
    flex-direction: column;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 84vh;
    padding-right: 5px;
    max-width: 150px;
}

.fade {
    transition-duration: 0.2s;
}

.decoupagePage {
    padding: 6px;
    margin: 5px;
    border-radius: 5px;
    border-style: solid;
    border-width: 3px;
    opacity: 0.5;
    object-fit: contain;
}

    .decoupagePage:hover {
        border-color: #96bf0d;
        opacity: 1;
        box-shadow: 0px 0px 5px #8c8c8c;
    }

.decoupagePageSelected {
    opacity: 1;
}

.coupureInactif {
    opacity: 0.3;
}

    .coupureInactif:hover {
        opacity: 1;
    }

.coupureActif {
    opacity: 1;
}

#DecoupagePageViewerContainer {
    background: rgba(0,0,0,.75);
    text-align: center;
    width: 50%;
    flex: 3;
}

.DecoupagePageViewer {
    height: 84vh;
    object-fit: contain;
}

#DecoupageInfosContainer {
    flex: 2;
    padding-left: 15px;
    display: flex;
    flex-direction: column;
}

#RecapitulatifContainer {
    overflow-y: auto;
    height: 70vh;
}

    #RecapitulatifContainer > table {
        border-collapse: collapse;
        border: 1px solid rgb(200,200,200);
        letter-spacing: 1px;
        font-size: 0.8rem;
        width: 100%;
    }

        #RecapitulatifContainer > table td,
        #RecapitulatifContainer > table th {
            border: 1px solid rgb(190,190,190);
            padding: 10px 20px;
            width: 50%;
        }

#DecoupageBoutonValidationContainer {
    margin-top: auto;
    display: flex;
    width: 100%;
    flex-direction: row-reverse;
}

.infosCouleur {
    float: left;
    height: 15px;
    width: 15px;
    margin-right: 5%;
}

/* FIN DECOUPAGE */

.NbPageIndicator {
    vertical-align: middle;
    font-size: 0.9em;
    margin-left: 5px;
    padding-left: 4px;
    padding-right: 4px;
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 70px;
    background: #96bf0d;
    color: white;
}

/* Logiciel saas indicator */

.LogicielSaasIndicator {
    margin-bottom: 1px;
    width: 12px;
    height: 12px;
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: center;
}

.LogicielSaasIndicator.NotOk {
    background-image: url("/Content/Images/Saas/red.png");
}

.LogicielSaasIndicator.Pending {
    background-image: url("/Content/Images/Saas/orange.png");
}

.LogicielSaasIndicator.Ok {
    background-image: url("/Content/Images/Saas/green.png");
}

.dxm-hovered.LogicielSaasIndicatorItem .LogicielSaasIndicator {
    background-image: url("/Content/Images/Saas/update.png");
}

.dxm-disabled.LogicielSaasIndicatorItem div {
    color: black;
}

/* Fin Logiciel saas indicator */

/* Invitation client */

#invitationClientContainer {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

#infosInvitationClient {
    width: 73%;
}

#logosApplication {
    align-content: center;
    display: grid;
}

/* Fin Invitation client */

/* Modification d'un dossier */

#PlanTVAPanel_EB {
    padding: 0px;
    padding-top: 8px;
}

#BtnModifierCompositionLibelleImg {
    background-color: white;
}

/* Fin Modification d'un dossier */

.btn-close {
    background-color: transparent !important;
    border: none;
    box-shadow: none;
    filter: invert(14%) sepia(98%) saturate(3315%) hue-rotate(343deg) brightness(104%) contrast(85%);
    font-size: 10px;
    background: none;
    background-image: url("/Content/Images/xmark.svg");
    background-repeat: no-repeat;
    margin-inline-start: 10px;
    background-position: center;
}

.btn-close .dxb{
    background: none;
}


.important{
    color: #de0707;
    font-weight: 700;
}

.on-left{
    margin-left: 0 !important;
}

#PPContact {
    width: 775px;
    font-size: 1em;
}

    #PPContact #ContactContainer {
        display: flex;
        flex-flow: row nowrap;
        margin-bottom: 1em;
    }

        #PPContact #ContactContainer > div {
            display: flex;
            flex-flow : column nowrap;
            align-items: center;
            justify-content: space-between;
            width: 33.333%;
            padding: 1em;
            vertical-align: top;
        }

            #PPContact #ContactContainer > div + div {
                border-left: 1px solid silver;
            }

            #PPContact #ContactContainer > div h3 {
                margin: 0;
                margin-bottom: 1em;
            }

            #PPContact #ContactContainer > div #PPContact #ContactContainer > div button + div,
            #PPContact #ContactContainer > div button + button,
            #PPContact #ContactContainer > div button + form,
            #PPContact #ContactContainer > div form + button {
                margin-top: 1em;
            }

    #PPContact #ContactTutos button {
        display: block;
        margin: auto;
    }

        #PPContact #ContactTutos button.teamviewer-button,
        #PPContact #ContactTutos button.anydesk-button {
            display: inline-block !important;
        }

.priority-action > * {
    font-size: 1.0em;
    color: #6a8a00 !important;
    /*color: #1414e6 !important;*/
}

#CallbackPanelSelectCompany {
    display: flex !important;
    flex-flow: row nowrap;
    justify-content: center;
    align-content: center;
    margin-block-end: 30px;
    padding: 15px;
    border: 1px Solid #9F9F9F;
    border-radius: 3px;
    background-color: white;
    width: fit-content;
}
    #CallbackPanelSelectCompany * {
        font-size: 18px;
        vertical-align: middle;
        padding-top: 0;
    }
#AccueilClient .container {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
}

#FormModifierCommentairePopupModifierCommentaire_0 div{
    display: flex !important;
    flex-flow: row wrap;
    justify-content: space-evenly;
    gap: 10px 0;
}

/* Combobox comptes */

table:has(tr.dxeListBoxItemRow) {
    overflow-anchor: none;
}

.centered-row{
    display: flex !important;
    align-items: center;
    gap: 0 5px;
}

.help{
    cursor: help;
}