﻿#pageContent {
    background-color: rgb(241, 241, 241)
}

#templateTable tr {
    cursor: pointer;
}

.dt-buttons button {
    background-color: white;
}

#templateTable {
    background-color: white;
}

table.dataTable tbody tr {
    color: #004346
}

    table.dataTable tbody tr:hover {
        background-color: rgba(44, 133, 181, 0.19);
        color: #004346;
        cursor: pointer;
    }

        table.dataTable tbody tr:hover td i {
            visibility: visible !important;
        }

#templateTablePartial {
    background-color: white;
    border-top: 0;
    margin-top: 0 !important;
}

#templateTable_wrapper_partial {
    /*margin-top: 44px;*/
    margin-left: 5px;
}

div.dataTables_scrollHead table.dataTable {
    margin-top: 0 !important;
}



.table td, .table th {
    padding: 0.5rem;
}


.table th {
    border-right-width: 0;
    text-align: center;
    padding: 0.75rem;
    border-bottom-width: 0 !important;
}

.table {
    font-size: 14px;
}

.formFooter {
    background-color: white;
    position: relative;
}

.formFooterConfirmation {
    height: 100%;
    width: 100%;
    transition: 1s;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    visibility: collapse;
}

.formFooterBtn {
    position: relative;
    opacity: 1;
    transition: 1s;
}

.formFooter.confirm > .formFooterConfirmation {
    visibility: visible;
    opacity: 1;
}

.formFooter.confirm > .formFooterBtn {
    opacity: 0;
}


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
    display: block;
    max-width: 450px;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000 !important;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

#templateTable {
    border-top-width: 0px !important;
}

#card-form {
    margin-left: 25px;
    margin-top: 6px;
}

.containerTemplate {
    display: flex;
    padding-top: 0;
}

.containerTable {
    transition: flex-grow 0.350s;
}

#headerTemplateTable {
    transition: width 0.150s;
}

.dataTables_scrollHeadInner {
    transition: width 0.150s;
}

#dataTables_scrollHeadInner {
    transition: width 0.150s;
}

.containerForm {
    /*  width: 0px;*/ /* Vous pouvez modifier cette valeur en fonction de vos besoins */
    /*transition: width 0.350s;*/
    margin-top: 2.7rem;
    margin-left: 10px
}

table.dataTable tbody tr.selected {
    color: #004346 !important;
    background-color: rgba(44, 133, 181, 0.19) !important;
}

    table.dataTable tbody tr.selected td i {
        visibility: visible !important;
    }



/*tbody {
    display: block;
    height: 500px;
    overflow-y: auto;
}

    thead, tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed;*/ /* even columns width , fix width of table too*/
/*}*/

.dataTables_scrollHeadInner th {
    background-color: white;
    /*    border-top-left-radius: 6px;
    border-top-right-radius: 6px;*/
    /*border: 1px solid #dee2e6 !important;*/
    
    border: none;
}

.dataTables_scrollHeadInner table {
    border: none;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6 !important;
    border-bottom: 1px solid #dee2e6 !important;
}


.titreSection {
    border-bottom: 1px solid #bbb;
    margin-bottom: 8px;
    margin-top: 8px
}


/* Definition de style bouton */
.btn-one {
    color: #fff;
    background-color: #004346;
    border-color: #004346;
    box-shadow: none;
}

    .btn-one:hover {
        color: #fff;
        background-color: rgba(44, 133, 181, 0.9);
        border-color: rgba(44, 133, 181, 0.9);
    }

    .btn-one:focus, .btn-one.focus {
        color: #fff;
        background-color: #2C85B5;
        border-color: #2C85B5;
        box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
    }

    .btn-one.disabled, .btn-one:disabled {
        color: #fff;
        background-color: #2C85B5;
        border-color: #2C85B5;
    }

    .btn-one:not(:disabled):not(.disabled):active, .btn-one:not(:disabled):not(.disabled).active,
    .show > .btn-one.dropdown-toggle {
        color: #fff;
        background-color: #0062cc;
        border-color: #005cbf;
    }

        .btn-one:not(:disabled):not(.disabled):active:focus, .btn-one:not(:disabled):not(.disabled).active:focus,
        .show > .btn-one.dropdown-toggle:focus {
            box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
        }


@font-face {
    font-family: 'SourceSansProRegular';
    src: url('/Content/fonts/SourceSansPro-Regular.ttf');
}

.btn-two {
    border-radius: 18px;
    color: #FFEEDD;
    background-color: #172a3a;
    border-color: #172a3a;
    box-shadow: none;
}

    .btn-two:hover {
        color: #FFEEDD;
        background-color: #2C85B5;
        border-color: #2C85B5;
    }

    .btn-two:focus, .btn-two.focus {
        background-color: #172a3a;
        border-color: #172a3a;
        box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
    }

    .btn-two.disabled, .btn-two:disabled {
        background-color: #004346;
        border-color: #004346;
    }

    .btn-two:not(:disabled):not(.disabled):active, .btn-two:not(:disabled):not(.disabled).active,
    .show > .btn-two.dropdown-toggle {
        background-color: #172a3a;
        border-color: #172a3a;
    }

        .btn-two:not(:disabled):not(.disabled):active:focus, .btn-two:not(:disabled):not(.disabled).active:focus,
        .show > .btn-two.dropdown-toggle:focus {
            box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
        }

.btn-two-inverse {
    border-radius: 18px;
    color: #FFEEDD;
    background-color: #2C85B5;
    border-color: #2C85B5;
    box-shadow: none;
}

    .btn-two-inverse:hover {
        color: #FFEEDD;
        background-color: #172a3a;
        border-color: #172a3a;
    }

    .btn-two-inverse:focus, .btn-two-inverse.focus {
        background-color: #172a3a;
        border-color: #172a3a;
        box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
    }

    .btn-two-inverse.disabled, .btn-two-inverse:disabled {
        background-color: #004346;
        border-color: #004346;
    }

    .btn-two-inverse:not(:disabled):not(.disabled):active, .btn-two-inverse:not(:disabled):not(.disabled).active,
    .show > .btn-two-inverse.dropdown-toggle {
        background-color: #172a3a;
        border-color: #172a3a;
    }

        .btn-two-inverse:not(:disabled):not(.disabled):active:focus, .btn-two-inverse:not(:disabled):not(.disabled).active:focus,
        .show > .btn-two-inverse.dropdown-toggle:focus {
            box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
        }


.btn-external-link {
    color: #004346;
    background: rgba(0,0,0,0);
    border: none;
    box-shadow: none;
    font-weight: bold
}

    .btn-external-link:hover {
        color: #004346;
        background-color: #f5f6f8;
        /*border-color: rgba(0, 67, 70, 0.9);*/
    }

    .btn-external-link:focus, .btn-external-link.focus {
        color: #505f79;
        background-color: #f5f6f8;
        box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
    }

    .btn-external-link.disabled, .btn-external-link:disabled {
        background-color: #004346;
        border-color: #004346;
    }

    .btn-external-link:not(:disabled):not(.disabled):active, .btn-external-link:not(:disabled):not(.disabled).active,
    .show > .btn-external-link.dropdown-toggle {
        color: #505f79;
        background-color: #f5f6f8;
    }

        .btn-external-link:not(:disabled):not(.disabled):active:focus, .btn-external-link:not(:disabled):not(.disabled).active:focus,
        .show > .btn-external-link.dropdown-toggle:focus {
            box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5);
        }

.btn-outline-one {
    border-radius: 18px;
    color: #004346;
    border-color: #172a3a;
}

    .btn-outline-one:hover {
        color: #FFEEDD;
        background-color: #2C85B5;
        border-color: #2C85B5;
    }

    .btn-outline-one:focus, .btn-outline-one.focus {
        box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.5);
    }

    .btn-outline-one.disabled, .btn-outline-one:disabled {
        color: #004346;
        background-color: transparent;
    }

    .btn-outline-one:not(:disabled):not(.disabled):active, .btn-outline-one:not(:disabled):not(.disabled).active,
    .show > .btn-outline-one.dropdown-toggle {
        color: #fff;
        background-color: #004346;
        border-color: #004346;
    }

        .btn-outline-one:not(:disabled):not(.disabled):active:focus, .btn-outline-one:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-one.dropdown-toggle:focus {
            box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.5);
        }


.save-button {
    padding-top:2px;
    color: #172a3a;
    background-color: transparent;
    border: none;
    border-radius: 18px;
    font-size: 1rem;
    display: flex;
    transition: all 0.3s;
    position: absolute;
    height: 26px;
}

    .save-button i {
        align-self: center;
    }

    .save-button .content {
        flex-grow: 1;
        width: 0;
        transition: all 0.3s;
        display: none;
       
        font-size: 0.9rem;
    }

    .save-button:hover .content {
        width: 100%;
        display: flex;
        color: #FFEEDD;
        /*font-size:1rem;*/
        /*padding-left:12px;
        padding-right:12px;*/
    }

    .save-button:hover {
        background-color: #2C85B5;
        padding-left: 12px;
        padding-right: 12px;
        height: 26px;
    }

        .save-button:hover i {
            display: none;
        }

.add-button {
    background-color: #fed;
    color: #004346;
    border: none;
    border-radius: 12px;
    font-size: 0.8rem;
    display: flex;
    transition: all 0.3s;
    position: absolute;
    height: 23px;
}

    .add-button i {
        align-self: center;
    }

    .add-button .content {
        flex-grow: 1;
        width: 0;
        transition: all 0.3s;
        display: none;
       /* font-weight: 600;*/
        font-size: 0.9rem;
    }

    .add-button:hover .content {
        width: 100%;
        display: flex;
        /*font-size:1rem;*/
        /*padding-left:12px;
        padding-right:12px;*/
    }

    .add-button:hover {
        padding-left: 12px;
        padding-right: 12px;
        height: 25px;
    }

        .add-button:hover i {
            display: none;
        }

.close-button {
    background-color: #004346;
    color: #fed;
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    display: flex;
    transition: all 0.3s;
    position: absolute;
    height: 23px;
    right: 14px;
    top: 7px;
}

    .close-button i {
        align-self: center;
    }

    .close-button .content {
        flex-grow: 1;
        width: 0;
        transition: all 0.3s;
        display: none;
        font-weight: 600;
        font-size: 0.9rem;
    }

    .close-button:hover .content {
        width: 100%;
        display: flex;
        /*font-size:1rem;*/
        /*padding-left:12px;
        padding-right:12px;*/
    }

    .close-button:hover {
        padding-left: 12px;
        padding-right: 12px;
        height: 25px;
        background-color: #fed;
        color: #004346;
    }

        .close-button:hover i {
            display: none;
        }

input[type="checkbox"] {
    accent-color: #004346
}

.dropdown-item:hover {
    cursor: pointer
}

.iconChampRecherche {
    color: grey;
    font-size: 1rem;
    right: auto;
    left: 22px;
    position: absolute;
    top: 0.75em;
    pointer-events: none;
}

.toolbar-search {
    padding-left: 32px !important;
    font-size: .95rem !important;
    padding-top: 7px;
    width: 15rem;
    margin-top: -5px;
    margin-left: 10px;
}

.dataTables_filter > label{
    margin-top: 5px;
    display: inline-flex;
}




/** gestion des medias */
@media (max-width: 768px) {
    #templateTable_wrapper {
        position:absolute;
        width:95% !important;
    }
}

@media (min-width: 768px) {
    .toolbar-search {
        min-width: 15rem;
        border-radius: 18px
    }
}