.ant-layout{
    background: #f0f2f5;
}



.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover > .ant-menu-title-content > a:not(.account)::before{
    border-bottom: 1px solid black !important;
}


.ant-menu-item.submenuItem{
    padding-left:47px !important;
    height:26px !important;
    background: rgba(218,224,233,1);
    background: linear-gradient(90deg, rgba(228,232,239,1) 0%, rgba(218,224,233,1) 20%, rgba(218,224,233,1) 100%);
    margin: 0 !important;
    top: -7px;
}
.ant-menu-vertical .ant-menu-item-group-list .ant-menu-submenu-title, .ant-menu-vertical .ant-menu-submenu-title{
    padding-right:16px !important;
}




.ant-menu{
    font-size: 16px !important;
    font-family: SoleilLight;
    font-weight: 300;
}
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item-selected::after{
    border-bottom: 2px solid black !important;
}
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover::after,
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu:hover::after{
    border-bottom: 1px solid black !important;
}
.ant-menu-horizontal > .ant-menu-item,
.ant-menu-horizontal > .ant-menu-submenu{
    padding: 0 !important;
}

.ant-menu-overflow-item .ant-menu-title-content > a,
.ant-menu-overflow-item .ant-menu-title-content > span{
    margin: 0px 25px;
    display: block;
}
/*
.ant-menu-overflow-item:first-child .ant-menu-title-content > a,
.ant-menu-overflow-item:first-child .ant-menu-title-content > span{
    margin: 0px 25px 0 0;
}
*/
.ant-menu-overflow-item:last-child .ant-menu-title-content > a,
.ant-menu-overflow-item:last-child .ant-menu-title-content > span{
    margin: 0px 0 0 25px;
}
/*
@media only screen and (max-width: 1500px) {
    .ant-menu{
        font-size: 12px !important;
    }
    .ant-menu-horizontal > .ant-menu-item,
    .ant-menu-horizontal > .ant-menu-submenu{
        padding: 0 10px !important;
    }
}
*/

.ant-menu-overflow{
    justify-content: right;
}
.ant-menu-overflowed-submenu{
    margin: auto !important;
}
.ant-menu-overflowed-submenu{
    margin: auto;
    min-width: 100%;
    text-align: center;
}


.ant-list.antList1 .ant-list-header{
    padding: 7px 0px;
    background-color: rgb(255 200 125);;
    text-align: center;
}





.ant-input-affix-wrapper{
    overflow: hidden;
}
.ant-input-affix-wrapper{
    .ant-input-prefix,
    .ant-input-suffix{
        padding: 0 11px;
    }
}
.ant-select{
    &.searchIcon .ant-select-selection-search{
        padding-left:20px;
    }
    &.roundedBorders .ant-select-selector{
        border-radius:10px !important;
    }
    &.noPadding .ant-select-selector{
        padding:0px 4px 0px !important;
    }
}

/* cards */
.ant-card{
    &.red-card.selected{
        webkit-box-shadow: 0 1px 2px -2px rgb(255 0 0 / 16%), 0 3px 6px 0 rgb(255 0 0 / 12%), 0 5px 12px 4px rgb(255 0 0 / 9%);
        box-shadow: 0 1px 2px -2px rgb(255 0 0 / 16%), 0 3px 6px 0 rgb(255 0 0 / 12%), 0 5px 12px 4px rgb(255 0 0 / 9%);
    }
    &:hover.red-card.selected{
        webkit-box-shadow: 0 1px 22px -2px rgb(255 0 0 / 16%), 0 3px 6px 0 rgb(255 0 0 / 12%), 0 5px 12px 4px rgb(255 0 0 / 9%);
        box-shadow: 0 1px 22px -2px rgb(255 0 0 / 16%), 0 3px 6px 0 rgb(255 0 0 / 12%), 0 5px 12px 4px rgb(255 0 0 / 9%);
    }

    &.green-card.selected{
        webkit-box-shadow: 0 1px 2px -2px rgb(0 128 21 / 16%), 0 3px 6px 0 rgb(0 128 21 / 12%), 0 5px 12px 4px rgb(0 128 21 / 9%);
        box-shadow: 0 1px 2px -2px rgb(0 128 21 / 16%), 0 3px 6px 0 rgb(0 128 21 / 12%), 0 5px 12px 4px rgb(0 128 21 / 9%);
        background-color: #f7f7f7;
    }
    &:hover.green-card.selected{
        webkit-box-shadow: 0 1px 22px -2px rgb(0 128 21 / 16%), 0 3px 6px 0 rgb(0 128 21 / 12%), 0 5px 12px 4px rgb(0 128 21 / 9%);
        box-shadow: 0 1px 22px -2px rgb(0 128 21 / 16%), 0 3px 6px 0 rgb(0 128 21 / 12%), 0 5px 12px 4px rgb(0 128 21 / 9%);
    }

    
    &.honey-card{
        background-color: rgb(255 246 231);
        border-color: rgb(255 238 206);

        .ant-card-body{
            position: relative;
        }

        .ant-card-body::before{
            content: "";
            background: url("/images/bg/floral.png");
            background-size: cover;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            opacity: 0.02;
            width: 100%;
            height: 100%;
        }
        &.listPage .ant-card-body::before{
            opacity: 0.03;
        }
        
    }
    
    &.cardFlex{
        display: flex;
        flex-direction: column;
    }
    &.cardFlex > .ant-card-body{
        flex:1;
        display: flex;
        flex-direction: column;
        padding-top:10px !important;
    }

    .ant-card-meta-title p{
        margin:0;
    }

    &.noPadding{
        border:none;
        .ant-card-body{
            padding:0;
        }
    }
}





/* tabs */
.ant-tabs{
    
    &.ant-tabs-box{
        > .ant-tabs-content-holder{
            /*border: 1px solid lightgray;*/
        }
        > .ant-tabs-nav{
            /*margin-bottom: 0px;*/
        }
    }

    > .ant-tabs-nav{
        margin-bottom: 0px;
    }

    @media (min-width: 1000px) {
        &.widePadding .ant-tabs-tab {
            padding: 8px 36px;
        }
    }
    &.widePadding > .ant-tabs-nav > .ant-tabs-nav-wrap > .ant-tabs-nav-list {
        gap: 10px;
    }

    &.shadow1 > .ant-tabs-content-holder{
        box-shadow: rgb(113 113 113 / 30%) 0px 30px 88px;
    }
    &.contentPadding > .ant-tabs-content-holder{
        padding: 0 24px;
        width:auto;
    }
    &.noLeftBorder.ant-tabs-left > .ant-tabs-content-holder{
        border-left:none;
    }
    &.noLeftBorder.ant-tabs-left > .ant-tabs-nav .ant-tabs-tab{
        border-radius: 8px 8px 8px 8px;
    }

    &.flexTabs .ant-tabs-content-holder{
        display:flex;
        flex-direction: column;

        > .ant-tabs-content{
            display:flex;
            flex:1;
            flex-direction: column;  
            height: 1px;

            > div:not(.ant-tabs-tabpane-hidden){
                display:flex;
                flex:1;
                height: 1px;
            }

            &:not(.ant-tabs-content-left) > div:not(.ant-tabs-tabpane-hidden){
                flex-direction: column;    
            }
        }
        
    }

    .ant-tabs-tab{
        /*background-color: #f3f3f3 !important;*/
    }

    &.ant-tabs-card > * > * > * > * > .ant-tabs-tab.ant-tabs-tab-active{
        background-color: #ffffff !important;
    }
}

/* tabs */
.ant-tabs{
    &.ant-tabs-box{
    }
    /*
    &.ant-tabs-box > .ant-tabs-nav{
        margin-bottom: 0px;
    }
    */
    > .ant-tabs-nav{
        margin-bottom: 0px;
    }
    &.ant-tabs-box > .ant-tabs-content-holder{
        /*border: 1px solid lightgray;*/
    }

    @media (min-width:1000px) {
        &.widePadding .ant-tabs-tab{
            padding: 8px 36px;
        }
    }

    &.shadow1 > .ant-tabs-content-holder{
        box-shadow: rgb(113 113 113 / 30%) 0px 30px 88px;
    }
    &.contentPadding > .ant-tabs-content-holder{
        padding: 0 24px;
        width:auto;
    }

    &.flexTabs .ant-tabs-content-holder{
        display:flex;
        flex-direction: column;

        > .ant-tabs-content{
            display:flex;
            flex:1;
            flex-direction: column;
            height: 1px;
        }
        > .ant-tabs-content > div:not(.ant-tabs-tabpane-hidden){
            display:flex;
            flex:1;   
            height: 1px;
        }
        > .ant-tabs-content:not(.ant-tabs-content-left) > div:not(.ant-tabs-tabpane-hidden){
            flex-direction: column;  
        }

        
    }
    .ant-tabs-tab{
        /*background-color: #f3f3f3 !important;*/
    }

    &.hoverShadow > .ant-tabs-nav .ant-tabs-tab:hover{
        box-shadow: rgba(14, 30, 37, 0.06) 0px 2px 4px 0px, rgba(14, 30, 37, 0.16) 0px 2px 16px 0px;
    }
    &.hoverShadow > .ant-tabs-nav > .ant-tabs-nav-wrap{
        overflow: visible;
    }

    > .ant-tabs-nav .ant-tabs-tab:hover{
        background: rgba(0, 0, 0, 0.05);
    }
    

    &.ant-tabs-card > * > * > * > * >  .ant-tabs-tab.ant-tabs-tab-active{
        background-color: #ffffff !important;
    }


    /*Design 2*/
    &.ant-tabs-card.design2 {
        > .ant-tabs-nav .ant-tabs-tab:not(.ant-tabs-tab-active), 
        > div > .ant-tabs-nav .ant-tabs-tab:not(.ant-tabs-tab-active){
            background: #dddddd;
        }

        > .ant-tabs-nav .ant-tabs-tab.ant-tabs-tab-active, 
        > div > .ant-tabs-nav .ant-tabs-tab.ant-tabs-tab-active{
            background-color: #ababab;
        }
        
        > .ant-tabs-nav .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
            color:white;
        }
        .ant-tabs-top > .ant-tabs-nav::before{
            border-bottom:none;
        }
        > * > * > .ant-tabs-nav-list{
            width: 99%;
            display: flex;
        }
        > * > * >  * > .ant-tabs-tab{
            flex:1;
            justify-content: center;

            &.ant-tabs-tab-active .ant-tabs-tab-btn i{
                color: #edefff;
            }
        }
        .ant-tabs-tab-btn i{
            position: absolute;
            right: 2px;
            top: 3px;
            color: #7882ff;
        }
        
    }
    /*Design 3*/
    &.ant-tabs-card.design3{

        > .ant-tabs-nav .ant-tabs-tab,
        > div > .ant-tabs-nav .ant-tabs-tab{
            background: #dddddd !important;
            border-radius: 8px;
        }

        .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{}

        > .ant-tabs-nav .ant-tabs-tab:has(.current),
        > div > .ant-tabs-nav .ant-tabs-tab:has(.current){
            background-color: #c7c7c7 !important;
        }

        > .ant-tabs-nav .ant-tabs-tab{
            margin: 0 0 3px 0;
            flex:1;
            justify-content: center;

            &.ant-tabs-tab-active::after {
                content: "";
                position: absolute;
                left: 0;
                bottom: -4px;
                height: 2px;
                width: 100%;
                background: black;
            }

            &.ant-tabs-tab-active .ant-tabs-tab-btn i{
                /*color: #edefff;*/
            }
        }

        > .ant-tabs-nav .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
            color:black;
        }
        &.ant-tabs-top > .ant-tabs-nav::before{
            /*border-bottom:none;*/
        }
        .ant-tabs-nav-list{
                width: 99%;
                display: flex;
        }

        .ant-tabs-tab-btn i{
            padding-right: 5px;
            color: #757cd3;
            opacity: .5;
        }

        /* tabs - custom */
        > .ant-tabs-nav .ant-tabs-tab[data-node-key=stageTab_core],
        > div > .ant-tabs-nav .ant-tabs-tab[data-node-key=stageTab_core]{
            flex: 0;
            margin-right: 20px;
            background: #f7f7f7 !important;
        }
    }
}




/* tables */
.ant-table-wrapper{
    &.scrollTable{
        display: flex;

        .ant-table-body{
            /*overflow-y: auto !important;*/
        }

        > div{
            display: flex;
            flex: 1;
            width: 100%;

            > div{
                display: flex;
                flex-direction: column;
                width: 100%;
            }
        }

        .ant-table{
            flex: 1;
            display: flex;
            flex-direction: column;
            height: 1px;
        }

        .ant-table-container {
            display: flex;
            flex-direction: column;
            height: 1px;
            flex: 1;
        }

        .ant-table-body {
            overflow-y: auto !important;
            max-height: max-content;
            height: 1px;
            flex: 1;
        }

        .ant-table-body::-webkit-scrollbar {
            width: 4px;
        }
        .ant-table-body::-webkit-scrollbar-track {
            border-radius: 8px;    
            box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
        }
        .ant-table-body::-webkit-scrollbar-thumb {
            border-radius: 8px;
            background-color: #707070;
        }
    }

    &.noPadding .ant-table-tbody td{
        padding:4px 0 0 9px;
    }

    @media only screen and (max-width: 800px) {
        .ant-table-cell,
        .ant-table-thead>tr:not(.ant-table-measure-row)>th,
        .ant-table-tbody>tr:not(.ant-table-measure-row)>th,
        .ant-table-tbody>tr:not(.ant-table-measure-row)>td,
        tfoot>tr:not(.ant-table-measure-row)>th,
        tfoot>tr:not(.ant-table-measure-row)>td{
            padding: 5px 5px !important;
        }
    }

    .ant-table-tbody{
        > tr.ant-table-row:hover{
            > td.totalColumn{
                background-color: #e1e1e1;
            }
            > td.lightGreyColumn{
                background-color: #ececec;
            }
            > td.darkColumn{
                background-color: #ececec;
            }
        }
        > tr.boldRow{
            font-weight: bold;
        }

        .editable-row:hover .editable-cell-value-wrap {
            padding: 4px 11px;
            border: 1px solid #d9d9d9;
            border-radius: 2px;
        }

        .greyRow{
            background-color:#f7f7f7;

            .ant-table-column-sort{
                background-color:#f3f3f3;
            }
        }

        td{
            vertical-align: middle;
        }
    }
    
    .ant-table-row{
        &.inactive{
            background-color: #f5f5f5;
        }
        &.titleRow{
            background-color:#d7f4ed;
            font-weight: bold;
        }
        &:not(.titleRow) > .ant-table-cell.darkColumn{
            background-color: #f5f5f5;
        }
        &.totalRow{
            background-color: #d3d3d3;
        }
        &:not(.totalRow){
            > .totalColumn{
                background-color: #e9e9e9;
            }
            > .lightGreyColumn{
                background-color: #f5f5f5;
            }
        }
        &.dividerRow > td{
            border-top: 1px solid black;
        }
        &.darkRow{
            background-color: #f4f4f4;

            &:hover > .ant-table-cell.darkColumn{
                background-color: #dddddd;
            }

            > .ant-table-cell.darkColumn{
                background-color: #e9e9e9;
            }
        }
    }

    &.noPagination {
        .ant-pagination-prev,
        .ant-pagination-item,
        .ant-pagination-next{
            display: none;
        }
    }
}





/* layout */
.ant-col-xs-21-i {
    display: block;
    -ms-flex: 0 0 87.5% !important;
    flex: 0 0 87.5% !important;;
    max-width: 87.5% !important;;
}



/* Sider menu tooltip */
.ant-menu-inline-collapsed-tooltip.ant-tooltip {
    padding-left: 5px; /* Adjust this value to move the Tooltip horizontally */
}
.ant-tooltip.ant-tooltip-placement-bottom > .ant-tooltip-arrow{
    top:1px !important;
}
.ant-tooltip.blackText .ant-tooltip-inner{
    color:black;
}
.ant-layout-sider .ant-menu-item > img{
    width:50px;
    object-fit: contain;
    margin: -10px;
}

.ant-layout-sider-children .ant-menu > .ant-menu-item  > i,
.ant-layout-sider-children .ant-menu-submenu .ant-menu-item-icon{
    font-size: 1.2em;
    text-align: center;
    justify-content: center;
    margin-right: 20px;
}
.ant-layout-sider .ant-layout-sider-trigger{
    background: #cbcfd5 !important;
}



/* Modal */
.ant-modal-root{
    display: flex;

    .ant-modal-wrap{
        display: flex;
    }

    .ant-modal{
        padding-bottom:0;
        top: 0 !important;
        margin: auto;

        .ant-modal-content{
            max-height: calc(100vh - 40px);
        }
        &.noHorizMargin > .ant-modal-content{
            padding: 20px 0;

            > .ant-modal-footer{
                padding: 0 24px;
            }
        }

        .ant-modal-body{
            overflow-y: auto;

            &::-webkit-scrollbar {
                width: 4px;
            }
            &::-webkit-scrollbar-track {
                border-radius: 8px;
                box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
            }
            &::-webkit-scrollbar-thumb {
                border-radius: 8px;
                background-color: #707070;
            }

            .fade-out,
            .fade-in {
                opacity: 0;
                transform: translateY(20px);
                transition: opacity 0.3s ease, transform 0.3s ease;
            }

            .fade-in {
                opacity: 1;
                transform: translateY(0);
            }
        }

        &.fullHeight{
            .ant-modal-content{
                display: flex;
                flex-direction: column;
                height: calc(100vh - 40px);
            }
            .ant-modal-body{
                flex: 1;
                min-height: 0;
            }
        }
    }
   
    .ant-modal-mask{
        background-color: rgba(0, 0, 0, 0.55);
    }
}