/*EBCTheme Start-CSS overrides*/
:root {
    /*EBCTheme Colors Constants*/

    --EbcColorBlancNordique: #ffffff;
    --EbcColorBleuPuissant: #002855;
    --EbcColorGrisAcier: #7c878e;
    --EbcColorGrisSterling: #d0d3d4;
    --EbcColorNoirBrut: #101820;
    --EbcColorOrangeChantier: #fa4616;
    --EbcColorGrisAzure: #eaeaea;
    --EbcColorGrisDark: #313638;
    --EbcColorWhite: rgb(253,253,253);
    --EbcColorMedium: rgb(90,90,90);
    --EbcColorDark: rgb(100,100,100);
    --EbcColorDarkDark: #323232;
    --EbcColorLight: #c8c8c8;
    --EbcColorLightLight: #f0f0f0;
    --EbcColorOutPeriod: #b4b4b4;
    --EbcColorDisable: rgb(230,230,230);
    --EbcColorBorderControle: rgb(210,210,210);
    --EbcColorBorderDarkControle: rgb(190,190,190);
    --EbcColorAccent: #115eca;
    --EbcColorAccentLight: rgb(218, 227, 238);
    --EbcColorEnService: rgba(0, 146, 24, .7);
    --EbcColorHorsService: rgba(255, 0, 0, .7);
    --EbcColorEnServiceInfoFilter: #009218;
    --EbcColorHorsServiceInfoFilter: #ff0000;
    --EbcColorGreen: rgb(3, 180, 3);
    --EbcColorRedLight: rgba(240, 3, 3, .1);
    --EbcColorWarning: rgb(230, 0, 0);
    --EbcColorWarningLight: rgba(230, 0, 0, .4);
    --EbcColorWarningLightLight: rgba(230, 0, 0, .1);
    --EbcColorYellow: #dfd124;
    --EbcColorOrange: #ffa500;
    --EbcColorRowAlternate: #f2f0dbff;
    --EbcColorHeaderGrid: #d3cfa7ff;
    --EbcOrangeColor: #FA4616;
    --EbcDarkBlueShadeColor: #343a40;
    --EbcPantone430CColor: #7C878E;
    --EbcPayneGrayBlueColor: #405e80;
    --EbcLightGreyColor: #939aa1;
    --EbcColorSuccess: rgba(0, 146, 24, .7);

    /*EBCTheme Overrides Radzen Constants*/
    --rz-series-1: var(--EbcColorBleuPuissant);
    --rz-series-2: var(--EbcOrangeColor);
    --rz-series-3: var(--EbcLightGreyColor);
    --rz-grid-header-font-size: 15.4px;
    --rz-grid-cell-font-size: 15.4px;
    --rz-primary: var(--EbcColorGrisAzure);
    --rz-sidebar-background-color: var(--EbcColorGrisAzure);
    --rz-panel-menu-background-color: var(--EbcColorGrisAzure);
    --rz-panel-menu-item-2nd-level-background-color: var(--EbcColorGrisAzure);
    --rz-panel-menu-item-background-color: var(--EbcColorGrisAzure);
    --rz-primary-light: var(--EbcColorGrisAzure);
    --rz-panel-menu-font-size: var(--rz-body-font-size);
    --rz-panel-menu-icon-font-size: 2rem !important;
    --rz-panel-menu-2nd-level-vertical-offset: 0;
    --rz-panel-menu-item-2nd-level-padding: 0.5rem 0 0.5rem 1rem !important;
    --rz-panel-menu-item-2nd-level-offset: 5rem;
    --rz-panel-menu-item-2nd-level-hover-background-color: var(--EbcColorGrisAcier);
    --rz-panel-menu-item-3rd-level-hover-background-color: var(--EbcColorGrisAcier);
    --rz-panel-menu-hover-background-color: var(--EbcColorGrisAcier);
    --rz-panel-menu-icon-color: #313638;
    --rz-panel-menu-item-active-color: #313638;
    --rz-panel-menu-item-2nd-level-hover-color: #313638;
    --rz-panel-menu-item-3nd-level-hover-color: #313638;
    --rz-panel-menu-font-weight: 0;
    --rz-panel-menu-hover-color: #313638;
    --rz-paginator-numeric-button-color: var(--EbcColorGrisDark);
    --rz-paginator-numeric-button-selected-color: var(--EbcColorGrisDark); /* var(--rz-primary-dark); */
    --rz-grid-selected-color: var(--EbcColorGrisDark);
}

@font-face {
    font-family: 'materialsymbolsoutlined';
    font-style: normal;
    font-weight: 100 700;
    src: url('../../css/fonts/materialsymbolsoutlined.woff2') format('woff2');
}

.table > :not(caption) > * > * {
    box-shadow: none;
}

.alert-dismissible .btn-close {
    z-index: 1;
}

div.app-moduleactions a.dropdown-toggle, div.app-moduleactions div.dropdown-menu {
    color: white;
}

.control-panel-pad {
    padding-right: 1em;
}

.login {
    padding: 0 8px 0;
    background-color: #002855;
    margin: 0 5px 0;
    border-radius: 20px;
}

    .no-menu-for-catalog {
        margin: 18px 12px 18px;
    }

body {
    background: white;
}

/*==================================================================================================*/
/* DEBUT - EBC */

.ebc-main-button-menu {
    border: none;
    background-color: transparent;
}

.ebc-main-sidebar {
    top: 44px !important;
    width: max-content !important;
    background-color: var(--EbcColorGrisAzure);
    padding: 0 8px 0 8px;
}

/* FIN - EBC */
/*==================================================================================================*/

/*==================================================================================================*/
/* DEBUT - OVERRIDES - RADZEN */



    .rz-navigation-item-text {
        flex: auto;
        max-width: fit-content;
    }

    .rz-panel-menu {
        margin-top: 20px;
    }

    .rz-panel-menu .rz-navigation-item-active,
    .rz-panel-menu .rz-navigation-item-wrapper-active {
        background-color: var(--EbcColorGrisAzure);
    }

    .rz-panel-menu .rz-navigation-menu .rz-navigation-item-active, .rz-panel-menu .rz-navigation-menu .rz-navigation-item-wrapper-active {
        background-color: transparent;
        color: var(--rz-panel-menu-item-2nd-level-active-color);
        font-weight: var(--rz-panel-menu-item-2nd-level-active-font-weight);
    }

    .rz-panel-menu .rz-navigation-menu .rz-navigation-item-wrapper:hover {
        background-color: var(--EbcColorLight);
        border-radius: 18px;
        overflow: hidden;
    }

    .rz-panel-menu .rz-navigation-item-link {
        padding: 5px 20px 5px 0;
    }

    .rz-panel-menu .rz-navigation-item-icon {
        color: var(--EbcColorAccent) !important;
        margin: 2px 10px 2px 10px !important;
        font-size: 24px;
    }

    .rz-panel-menu .rz-navigation-item-wrapper:hover {
        background-color: var(--EbcColorLight);
        border-radius: 18px;
    }

    .rz-panel-menu .rz-navigation-menu .rz-navigation-item-icon {
        font-size: 20px;
    }

    .rz-panel-menu .rz-navigation-menu .rz-navigation-item .rz-navigation-item-link {
        padding: 2px 18px 8px 22px;
    }

    .rz-cell-data {
        color: var(--EbcColorGrisDark) !important;
    }

    select option:hover {
        box-shadow: 0 0 10px 100px var(--EbcColorBleuPuissant) inset;
    }

    select:focus > option:hover {
        background: var(--EbcColorBleuPuissant) !important;
    }

    .page-link {
        color: var(--EbcColorBleuPuissant);
        background-color: white;
    }

    .page-item.active .page-link {
        color: white;
        background-color: var(--EbcColorBleuPuissant);
        border-color: var(--EbcColorBleuPuissant);
    }

    .app-admin-modal .modal-content {
        margin: 5% auto; /* 5% from the top and centered */
        width: 99%; /* Could be more or less, depending on screen size */
    }

    div.app-moduleactions a.dropdown-toggle, div.app-moduleactions div.dropdown-menu {
        color: black;
    }

    /*fix issue : the last column does't show it with width=100%, in mobile format*/
    /*.rz-grid-table {
    width: -webkit-fill-available;
}*/

    .bubble {
        background: var(--EbcColorBleuPuissant);
        color: white;
        padding: 4px 4px;
        position: absolute;
        border-radius: 4px;
        top: 30px;
        left: 50%;
        transform: translateX(-50%);
    }

        .bubble::after {
            content: "";
            position: absolute;
            width: 2px;
            height: 2px;
            background: var(--EbcColorBleuPuissant);
            top: 30px;
            left: 50%;
        }


.ebc-icon-for-item-menu-oqtane {
    margin: 0 8px 0 0;
}

.ebc-item-menu-div-oqtane {
    padding: 0 0 0 10px;
    display: flex;
}

.ebc-item-menu-check-oqtane {
    color: var(--EbcColorLightLight);
}

.ebc-item-menu-link-oqtane {
    color: var(--EbcColorLightLight);
    text-decoration: none;
}



@media (max-width: 274px) {

    .ebc-main-sidebar {
        top: 54px !important;
        width: max-content !important;
        background-color: var(--EbcColorGrisAzure);
        padding: 0 8px 0 8px;
    }
}

@media (max-width: 767px) {

    .app-menu {
        width: 100%
    }

    .navbar {
        position: fixed;
        top: 0px;
        width: 100%;
    }

    .navbar-title {
        font-weight: bold;
        font-size: 4vmin;
        overflow: hidden;
        white-space: nowrap; /* Don't forget this one */
        text-overflow: ellipsis;
    }

    .controls {
        height: 60px;
        top: 15px;
        position: fixed;
        top: 0px;
        width: 100%;
        background-color: rgb(0, 0, 0);
    }

    .controls-group {
        float: right;
        margin-right: 2px;
    }

    .control-panel-pad {
        padding-right: 0.5em;
        padding-bottom: 0.2em;
        align-self: end;
    }



    .content {
        position: relative;
        top: 0px;
    }

    .rz-p-4 {
        padding: 0rem !important;
    }

    .px-4 {
        padding-right: 0rem !important;
        padding-left: 0rem !important;
    }

    .sidebar-width {
        width: max-content;
        border-right-color: var(--EbcColorGrisAzure);
    }
}

    @media (max-width: 767px) {
        .login {
            padding: 0;
        }
    }

    @media (max-width: 767px) {
        .app-admin-modal .modal-content {
            margin: 5% auto; /* 5% from the top and centered */
            width: 96%; /* Could be more or less, depending on screen size */
            margin-left: 0;
        }
    }

    @media (max-width: 767px) {
        .rz-dialog:not(.rz-dialog-confirm):not(.rz-dialog-alert) {
            position: absolute;
            width: 100% !important;
            top: 140px !important;
            height: calc(100% - 180px) !important;
            border-radius: 0;
        }
    }

    /*EBCTheme End-CSS overrides*/