:root {
    --black: #333333;
    --orange: #F35729;
    --white: #FFFFFF;
    --blue: #001A70;
    --light-blue: #006DFF;
    --grey: #F6F6F6;
    --dark-grey: #8f8886;
    --red: #FF0000;
}
body {
    background-color: var(--grey) !important;
}
/* color */
.fc-black{ 
    color:var(--black)!important;
}
.fc-orange {
    color: var(--orange) !important;
}
.fc-white {color: var(--white) !important;
}
.fc-blue {
    color: var(--blue) !important;
}
.fc-light-blue {
    color: var(--light-blue) !important;
}
.fc-red {
    color: var(--red) !important;
}
.fc-grey {
    color: var(--grey);
}
.fc-dark-grey {
    color: var(--dark-grey);
}

.fw-bold {
    font-weight: bold;
}
/* bg */
.bg-black {
    background-color: var(--black) !important;
}
.bg-blue {
    background-color: var(--blue) !important;
}
.bg-light-blue {
    background-color: var(--light-blue) !important;
}
.bg-white {
    background-color: var(--white) !important;
}
.bg-grey {
    background-color: var(--grey) !important;
} 

/* Bouton  */
.so-btn {
    background-color: var(--light-blue);
    color: var(--white);
    min-width: 150px;
    width: auto;
    padding: 5px 50px;
    border-radius: 0;
    border: solid 1px var(--light-blue);
}

    .so-btn:hover, .so-btn:focus, .so-btn:active {
        background-color: var(--blue);
        color: var(--white);
    }

.btn-default {
    min-width: 150px;
    width: auto;
    padding: 5px 50px;
    border-radius: 0 !important;
    border: solid 1px #000000;
}
/* Form */

.form-select {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.form-label {
    margin-bottom: .5rem;
}
.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

/* Table */
.table {
    border-collapse: collapse;
    width: 100%;
    font-size: 0.875rem;
    table-layout: fixed;
}
    .table.table-bordered {
        border: solid 1px #dee2e6 !important;
    }
        .table.table-bordered tr.thead.thead-bg-white {
            border-bottom: solid 1px #dee2e6 !important;
        }
        .table tr.thead {
            border: 0;
            border-bottom: solid 1px #000000;
            background-color: #C0C0C0;
            text-align: center;
        }
    .table tr.thead td {
        width: auto;
        padding: 8px;
        border: 0;
        border-right: solid 1px #000000;
        color: #000000;
        font-weight: bold;
    }
    .table.table-bordered tr.thead.thead-bg-white td {
        border-right: solid 1px #dee2e6;
    }
    .table tr.thead.thead-bg-white {
        background-color: #FFFFFF !important;
    }
    .table tr.tbody {
        border: 0;
        border-bottom: solid 1px #dee2e6;
        text-align: left;
    }
    .table tr.tbody.tbody-center td {
        text-align: center!important;
    }
        .table.table-bordered tr.tbody {
            border-bottom: solid 1px #dee2e6;
        }
    .table.table-striped tr.tbody:nth-child(2n+1) {
        background-color: #DDEBF7;
    }    
    .table.table-hover tr.tbody:hover {
        background-color: var(--grey);
        color: var(--black);
        font-weight: bold;
    }
    .table.table-striped.table-hover tr.tbody:nth-child(2n+1):hover {
        background-color: #cde4f8;
    }
    .table tr.tbody td {
        width: auto;
        padding: 8px 15px;
        border: 0;
        border-right: solid 1px #dee2e6;
        color: #000000;
    }
.table .link{
    color: var(--light-blue);
    text-decoration: underline;
}

.tbody td .mud-input>input.mud-input-root-outlined{
    padding: 5px 14px 5px 14px!important;
}
/* Generiques */
.w-auto {
    width: auto!important;
}
.w-25 {
    width: 25% !important;
}
.w-50 {
    width: 50%!important;
}
.w-100 {
    width: 100%!important;
}
.text-left{
    text-align: left;
}
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
.link {
    color: var(--light-blue);
    text-decoration: underline;
}

/* temporaire a supp a terme(attendre*/
.blocmaster input, .varSelectStyle {
    border: 1px dotted #5a5a9d;
    display: inline-block;
    cursor: pointer;
}



.varSelectStyle {
    height:27px;
}


[contenteditable="true"] [data-component] {
    display: inline-block;
}

[contenteditable="true"]:active,
[contenteditable="true"]:focus {
    border: none;
    outline: none;
}

.drag-handle {
    cursor: move; /* Show a move cursor to indicate drag area */
    user-select: none; /* Prevent text selection */
    padding: 5px;
}

.content {
    margin-top: 0px;
}

.mud-drop-item {
    transform: none !important;
}

.confirmChoice:hover {
    background-color: yellow
}

.disableRelativeAndOverflow {
    position: initial;
    overflow: initial;
}

    .disableRelativeAndOverflow::after {
        width: initial !important;
    }

blockquote {
    /* border:2px blue solid; */
    padding: 5px;
}

.blocmaster {
    position: relative;
    border: none;
    width: 100%;
}

.extracted__text {
    border: 2px dashed #cacaca;
    padding: 5px;
    font-size: 11px;
}

.reset {
    position: absolute;
    right: -19px;
    top: -20px;
}

.feedbackSend {
    position: absolute;
    right: -18px;
    top: 0;
}

.blocmaster blockquote {

    margin-right:8px;
    min-height:80px;
}
/*.feedbackSend svg,.reset svg {

    font-size: 1.05rem;
}*/
.instruction {
    position: absolute;
    right: 0;
    top: 0;
    /* transform-origin: center right; */
    background-color: #ffffff;
    /* rotate: 180deg; */
    /* transform: scale(-1, 1); */
    /* transform: scale(1, -1); */
    transform: translate(105%, -15px);
    width: 250px;
    max-height: 70px;
    overflow: auto;
    margin-right: -18px;
    box-shadow: 7px 9px 4px 0px #001a70;
    filter: drop-shadow(2px 2px 2px #001a70);
    padding: 4px;
    font-size: 12px;
}

.instruction__title {
    display: block;
    font-weight: bold;
    position: sticky;
    top: -4px;
    background-color: #fff;
}
.motif .instruction {
    transform: translate(105%, 0);
}
@media (max-width: 1450px) {
    .instruction {
        width: 200px
    }
}



@media (max-width: 1340px) {
    .instruction {
        width: 150px
    }
}

@media (max-width: 1230px) {
    .instruction {
        width: 100px
    }
}

@media (max-width: 1170px) {
    .instruction {
        display:none;
    }
}

#DragableContainer .reset {
    right: -23px;
    top: -7px;
}


#DragableContainer .feedbackSend {
    right: -23px;
    top: 13px;
}

#deleteItem {
    position: absolute;
    bottom: -5px;
    right: -22px;
}




.small {

}

.fileRequired {
    font-size: .75rem;
    color: var(--mud-palette-error) !important;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        -webkit-transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-15px);
    }

    60% {
        -webkit-transform: translateY(-10px);
    }
}