/*File Upload*/

/*.e-upload .e-file-select-wrap .e-btn, .e-upload .e-upload-actions .e-btn, .e-bigger.e-small .e-upload .e-file-select-wrap .e-btn, .e-bigger.e-small .e-upload .e-upload-actions .e-btn {
    color: var(--arc-white);
    background-color: var(--arc-black);
    border-color: var(--arc-black);
    text-decoration: none;
    border-radius: 0.5rem;
    padding: 0.75rem 1.5rem 0.75rem 1.5rem;
    font-size: 1.125rem;
}*/

.e-upload {
    border: 1px dashed #adb5bd;
    border-radius: 0.5rem;
}


/*to match arc-btn-primary css*/
.e-btn, .e-css.e-btn {
    color: var(--arc-white);
    background-color: var(--arc-black);
    border-color: var(--arc-black);
    text-decoration: none;
    border-radius: 0.5rem;
    padding: 0.75rem 1.5rem 0.75rem 1.5rem;
    font-size: 1.125rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

    .e-btn:hover, .e-css.e-btn:hover {
        background-color: var(--arc-mid-grey);
        border-color: var(--arc-mid-grey);
        color: var(--arc-black);
        text-decoration: none;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    }

.e-multiselect.e-input-group .e-multi-select-wrapper {
    background-color: var(--arc-bg);
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem;
}

.e-multiselect.e-control-wrapper {
    background-color: var(--arc-bg);
    border: none !important;
    border-radius: 0.5rem !important;
}

.e-multiselect .e-delim-values {
    background-color: var(--arc-bg);
    border: none;
    border-radius: 0.5rem !important;
}

.e-multi-select-wrapper .e-chips {
    padding: 5px 10px 5px 10px;
}

.e-ddl.e-lib.e-input-group.e-control-container.e-control-wrapper {
    background-color: var(--arc-bg) !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.87rem 1rem !important
}

    .e-ddl.e-lib.e-input-group.e-control-container.e-control-wrapper.bg-slate {
        background-color: #e9ecef !important;
        border: none !important;
        border-radius: 0.25rem !important;
        padding: 0.87rem 1rem !important
    }

.pro.e-input-group.e-error, .e-input-group.e-control-wrapper.e-error, .e-input-group.e-error:not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left) {
    outline: 1px solid red;
}


/*syncfusion OnInvalid  */ 
.e-ddl.e-lib.e-error.e-input-group.e-control-container.e-control-wrapper.required-ddl.e-float-input.invalid {
    background-color: #ffe6e6 !important;
}

/*Syncfusion  mandatory mark */
.required-ddl.e-float-input.e-control-wrapper .e-float-text::after {
    content: " *";
    color: red;
}


/*SfNumericTextBox*/
.e-numeric.e-control-wrapper {
    background-color: var(--arc-bg);
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem;
}

.e-input-group-icon.e-spin-down {
    border: none !important;
    border-radius: 0.5rem !important;
}

.e-input-group-icon.e-spin-up {
    border: none !important;
    border-radius: 0.5rem !important;
}

/*SfDatePicker*/

.e-date-wrapper.e-date-container {
    background-color: var(--arc-bg);
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem;
}

.e-input-group-icon.e-date-icon {
    border: none !important;
    border-radius: 0.5rem !important;
}


/*SfDateRangePicker*/

.e-control-wrapper.e-date-range-wrapper {
    background-color: var(--arc-bg);
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem;
}

.e-input-group-icon.e-range-icon {
    border: none !important;
    border-radius: 0.5rem !important;
}

.e-chip {
    background-color: var(--arc-mid-grey) !important;
    border-color: var(--arc-mid-grey) !important;
    color: var(--arc-black) !important;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
    border-radius: 0.5rem !important;
}

    .e-chip:hover {
        color: var(--arc-white) !important;
        background-color: var(--arc-black) !important;
        border-color: var(--arc-black) !important;
        text-decoration: none !important;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
    }

    .e-chip.e-active {
        color: var(--arc-white) !important;
        background-color: var(--arc-black) !important;
        border-color: var(--arc-black) !important;
    }

.e-chip-text {
    padding: 0.75rem 1.5rem 0.75rem 1.5rem !important;
    font-size: 1.125rem !important;
}

.e-chip-list.e-chip .e-chip-text, .e-chip-list .e-chip .e-chip-text{
    height:auto !important;
}

.e-chip-list.e-chip, .e-chip-list .e-chip {
    height: auto !important;
}

/*carousal css starts here*/
.control-container {
    margin: 0 auto;
}

.control-container .e-carousel .e-carousel-items .e-carousel-item .img-container {
    height: 100%;
}

.control-container .e-carousel .e-carousel-items .e-carousel-item .img-caption {
    bottom: 4em;
    color: #fff;
    font-size: 12pt;
    height: 2em;
    position: relative;
    padding: 0.3em 1em;
    text-align: center;
    width: 100%;
}

.control-container .e-carousel .e-indicator-bars {
    display: none !important;
}

.control-container .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled) .e-btn-icon, .e-carousel .e-carousel-navigators .e-next .e-btn:not(:disabled) .e-btn-icon, .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled) .e-btn-icon {
    color: var(--arc-body) !important;
}


.e-dlg-content{
    background-color: var(--arc-white);
}


/*calender */
.daterangeTooltip .calendar-inside-popup ul {
    list-style: none;
}

.daterangeTooltip.e-popup-open {
    left: 410.525px !important;
}

.daterangeTooltip .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-calendar .e-content td.e-selected span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day, .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-calendar .e-content td.e-selected span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day, .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-end-date.e-selected.e-range-hover span.e-day, .e-bigger.e-small.e-daterangepicker.e-popup .e-calendar .e-start-date.e-selected.e-range-hover span.e-day, .e-calendar .e-content td.e-selected span.e-day, .e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
    background-color: black;
    color: #fff;
    border-radius: 50%;
    width: 100%;
}

.daterangeTooltip .e-daterangepicker.e-popup, .e-bigger.e-small .e-daterangepicker.e-popup {
    width: 700px;
    /*left: 410.525px !important;*/
}

.daterangeTooltip .e-daterangepicker.e-popup .e-calendar-container .e-left-container, .daterangeTooltip .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar-container .e-left-container {
    width: 350px;
    border: none !important;
}

.daterangeTooltip .e-calendar, .e-bigger.e-small .e-calendar {
    max-width: 350px !important;
}

.daterangeTooltip .e-calendar .e-content span.e-day, .daterangeTooltip .e-bigger.e-small .e-calendar .e-content span.e-day {
    border: none;
    font-size: 14px;
    font-weight: normal;
    height: 50px;
    line-height: 32px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.daterangeTooltip .e-daterangepicker.e-popup .e-range-header, .daterangeTooltip .e-bigger.e-small .e-daterangepicker.e-popup .e-range-header, .daterangeTooltip .e-left-calendar .e-header .e-next, .daterangeTooltip .e-right-calendar .e-header .e-prev {
    display: none;
}

.daterangeTooltip .e-daterangepicker.e-popup .e-calendar .e-content table, .daterangeTooltip .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-content table {
    border-spacing: 2px;
}

.daterangeTooltip .e-cell .e-weekend .e-selected .e-end-date {
    background: #dee2e6;
}

.calendar-inside-popup-ul {
    list-style: none
}
.e-dialog .calendar-inside-popup a {
    color: black;
    font-size: 16px;
    padding: 10px;
}

.e-dialog .calendar-inside-popup a:hover {
    text-decoration: none !important;
}

.e-dialog .square-1 {
    color: green;
}

.e-dialog .square-2 {
    color: blue;
}

.e-dialog .square-3 {
    color: red;
}

.e-dialog .calendaR-arrow {
    position: relative;
}

.e-dialog .calendar-inside-popup-ul li a.active {
    background-color: var(--arc-mid-grey);
    border-color: var(--arc-mid-grey);
}

.daterangeTooltip .e-daterangepicker.e-popup .e-calendar .e-other-month.e-selected span, .daterangeTooltip .e-calendar .e-content td.e-other-month > span.e-day {
    display: flex;
}

.daterangeTooltip .e-daterangepicker.e-popup .e-calendar .e-header .e-next, .daterangeTooltip .e-daterangepicker.e-popup .e-calendar .e-header .e-prev, .daterangeTooltip .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-header .e-next, .daterangeTooltip .e-bigger.e-small .e-daterangepicker.e-popup .e-calendar .e-header .e-prev {
    display: none;
}

.calendaR-arrow ul li {
    cursor: pointer;
}

/* this was here for experimenting with sf tabs but interfering with other things :- */
/*.e-input-group, .e-input-group.e-control-wrapper {
    border: none !important;
    padding: 0.75rem 1rem !important;
    border-radius: 0.5rem !important;
    background-color: var(--arc-bg);
}
*/

/*.e-input-group input.e-input, .e-input-group.e-control-wrapper input.e-input, .e-input-group textarea.e-input, .e-input-group.e-control-wrapper textarea.e-input {
    
    border: none !important;
  
   
}*/

.e-tooltip-wrap.e-popup {
    background-color: #D8E0F9 !important;
    border: 0px !important;
}

.e-tooltip-wrap .e-arrow-tip-inner.e-tip-bottom {
    color: #000 !important;
    font-size: 25.9px;
}

/* start Table css override */
div.e-headercontent table.e-table {
    margin-bottom: 1.5rem;
    background-color: transparent !important;
}

div.e-gridheader {
    background-color: transparent !important;
    border: none transparent !important;
}

.e-columnheader {
    background-color: transparent !important;
    border: none transparent !important;
}

th.e-headercell {
    background-color: transparent !important;
    border: none transparent !important;
}

.e-grid {
    border-style: none !important;
}

.e-filterbarcell {
    background-color: transparent !important;
    border: none transparent !important;
}

div.e-content table.e-table {
    border-spacing: 0 0.5rem !important;
    background-color: transparent !important;
}

div.e-content {
    background-color: transparent !important;
    border: none transparent !important;
    border-radius: 20px !important;
}

div.e-gridcontent {
    background-color: transparent !important;
    border: none transparent !important;
}

.e-rowcell {
    background-color: #fff;
    padding: 1.5rem 0 !important;
    border-style: none !important;
    border-width: 0 !important;
    padding-left: 1.5rem !important;
}
.e-row{
    background-color: #fff;
    padding: 1.5rem 0 !important;
    border-style: none !important;
    border-width: 0 !important;
    border-radius: 10px !important;
}

tr.e-row td:first-child {
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
}

tr.e-row td:last-child {
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}

div.e-filterdiv span.e-input-group{
    border: none;
    padding: 0.25rem 0;
    border-radius: 10px !important;
}

.e-toast-container.e-toast-top-right {
    top: 60px !important;
}

.e-float-input input:focus ~ label.e-float-text,
.e-float-input input:valid ~ label.e-float-text,
.e-float-input input ~ label.e-label-top.e-float-text,
.e-float-input input[readonly] ~ label.e-label-top.e-float-text,
.e-float-input input[disabled] ~ label.e-label-top.e-float-text,
.e-float-input input label.e-float-text.e-label-top,
.e-float-input.e-control-wrapper input:focus ~ label.e-float-text,
.e-float-input.e-control-wrapper input:valid ~ label.e-float-text,
.e-float-input.e-control-wrapper input ~ label.e-label-top.e-float-text,
.e-float-input.e-control-wrapper input[readonly] ~ label.e-label-top.e-float-text,
.e-float-input.e-control-wrapper input[disabled] ~ label.e-label-top.e-float-text,
.e-float-input.e-control-wrapper input label.e-float-text.e-label-top,
.e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text,
.e-float-input.e-input-focus input ~ label.e-float-text 
{
    font-size: 12px;
    font-weight: 500;
    padding-right: 0;
    transform: translate3d(1px, -28px, 0) scale(1.3);
}

.e-ddt .e-lib .e-show-dd-icon .e-input-group .e-control-container .e-control-wrapper .e-keyboard .e-input-focus .e-icon-anim {
    background-color: var(--arc-bg) !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.87rem 1rem !important
}

.e-control .e-dropdowntree .e-lib .e-input{
    background-color: var(--arc-bg) !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.87rem 1rem !important
}

.e-input-group:not(.e-success):not(.e-warning):not(.e-error), .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
    background-color: var(--arc-bg) !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.87rem 1rem !important;
    margin-top: 0px !important;
}

.e-input-group .e-input[readonly], .e-input-group.e-control-wrapper .e-input[readonly], .e-float-input input[readonly], .e-float-input.e-control-wrapper input[readonly], .e-float-input textarea[readonly], .e-float-input.e-control-wrapper textarea[readonly] {
    background:transparent!important;
    color: #020202;
}
.e-ddt.e-input-group.e-control-wrapper .e-input[readonly], .e-ddt.e-float-input.e-control-wrapper input[readonly] {
    background: transparent !important;
}

.e-ddt .e-popup-wrapper {
    left: auto !important;
    right: 0px !important;
}

.custom-dropdown .e-dropdownbase .dropdown-item-template {
    display: flex;
    align-items: center;
    padding: 5px 10px;
    white-space: nowrap;
    min-width: 160px; /* Adjust as needed */
}

.dropdown-item-template img {
    width: 22px;
    height: 22px;
    border-radius: 4px;
    flex-shrink: 0;
}

.dropdown-item-template span {
    margin-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.e-popup,
.e-popup-wrapper,
.e-ddl .e-popup-wrapper,
.e-dropdownbase .e-popup-wrapper,
.e-popup-open {
    z-index: 4000 !important;
}

.e-dlg-overlay {
    z-index: 7950 !important; /* overlay behind dialog */
}

.e-dlg-container,
.e-dialog {
    z-index: 8000 !important; /* dialog container above overlay and bootstrap modal */
}

.e-popup-wrapper,
.e-popup {
    z-index: 8100 !important; /* popup wrappers (drop-downs/popups) above dialog */
}
.e-upload input[type="file"] {
    pointer-events: auto !important;
    opacity: 0;
}
    /* END Table css override */