:root {
    --scame-primary: #FF665E;
    --scame-primary-dark: #C95853;
    --scame-primary-light: #FF948F;
    --scame-secondary: #8C9091;
    --scame-secondary-dark: #757878;
    --scame-secondary-light: #ADAFB0;
    --service-case-status-1: #1A73E8; /* Blue */
    --service-case-status-2: #FF5C00; /* Orange */
    --service-case-status-3: #34A853; /* Green */
    --service-case-status-4: #808080; /* Grey */
    --service-case-priority-4: #FF0000; /* Red */
}


@font-face {
    font-family: 'Helvetica Neue';
    src: url('../fonts/HelveticaNeue-Roman.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


body {
    font-family: 'Helvetica Neue';
    /*text-align: center;*/
}

p {
    font-family: 'Helvetica Neue';
    margin-bottom: 0px !important;
}


.btn-sm {
    margin-bottom: 5px;
    margin-top: 5px;
}

a {
    color: rgb(0 0 0) !important;
    text-decoration: underline;
}

.e-pager.sf-pager .e-pagercontainer {
    font-size: 0;
    float: right;
}

.e-pager div.e-parentmsgbar {
    float: right;
    padding-bottom: 0;
    padding-right: 0;
    padding-top: 8px;
    margin-right: 20px;
}

.navbar-scame {
    box-shadow: 0 1px 8px #0003, 0 3px 4px #00000024, 0 3px 3px -2px #0000001f;
    width: 200px !important;
}

.nav-link {
    color: #757878 !important;
}

    .nav-link:hover {
        color: #252525 !important;
        font-weight: 800;
    }

    .nav-link.active {
        font-weight: 800;
        background-color: transparent;
    }


.img_menu {
    width: 130px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.container {
    margin-bottom: 40px;
}

.navbar-collapse {
    justify-content: end;
}

.navbar-nav {
    text-align: end;
}

.nav-link {
    font-family: 'Helvetica Neue';
}


.dropdown-item {
    font-family: 'Helvetica Neue';
}

.img_logo {
    width: 30%;
}

.container-content {
    text-align: center;
    padding-top: 30px;
}

.dropdown-menu[data-bs-popper] {
    top: 100%;
    left: auto !important;
    right: 0px !important;
    margin-top: var(--bs-dropdown-spacer);
}

.accordion-box {
    padding: 0px 20px 20px 20px;
    border: var(--bs-border-width) solid var(--bs-border-color);
}

.accordion {
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgb(255 102 94 / 50%) !important;
}

.accordion-flush .accordion-item .accordion-button, .accordion-flush .accordion-item .accordion-button.collapsed {
    max-height: 40px;
    border-radius: 0;
    color: white;
    background: var(--scame-primary) !important;
}

.accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    /* margin-left: 0;*/
    content: "";
    background-image: url('../images/elements/arrow.svg') !important;
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}

.accordion-button:not(.collapsed)::after {
    background-image: url('../images/elements/arrow.svg') !important;
    transform: rotate(-180deg);
}

h2 {
    font-family: 'Helvetica Neue';
    font-size: 37px !important;
    color: var(--scame-primary) !important;
    font-weight: bold !important;
    padding-top: 15px;
}

h4 {
    font-family: 'Helvetica Neue';
    font-size: 25px !important;
    color: var(--scame-primary) !important;
    font-weight: bold !important;
}

h5 {
    font-family: 'Helvetica Neue';
    font-size: 23px !important;
    color: var(--scame-primary) !important;
    margin-top: 25px !important;
}

.title-section {
    font-family: 'Helvetica Neue';
    font-size: 20px;
    color: var(--scame-primary) !important;
    text-align: left;
    font-weight: 500 !important;
    margin-bottom: 0px;
}

.form-label {
    font-family: 'Helvetica Neue' !important;
    border-radius: 0px !important;
    margin-bottom: 10px !important;
    margin-top: 15px !important;
}

.form-control {
    font-family: 'Helvetica Neue' !important;
    border-radius: 0px !important;
}

.form-select {
    font-family: 'Helvetica Neue' !important;
    border-radius: 0px !important;
}

.btn:hover {
    background-color: var(--scame-secondary-light);
    border-color: var(--scame-secondary-light);
}

.btn-scame {
    background-color: var(--scame-primary) !important;
    font-family: 'Helvetica Neue' !important;
    color: white !important;
    border-radius: 0px !important;
}


.btn-scame-edit {
    background-color: #f90 !important;
    font-family: 'Helvetica Neue' !important;
    color: white !important;
    border-radius: 0px !important;
}

.btn-outline-primary {
    border-radius: 0px !important;
    border: 0px !important;
    color: var(--scame-primary) !important;
    font-family: 'Helvetica Neue' !important;
}

.btn-primary {
    border-radius: 0px !important;
    border: 0px !important;
    background-color: var(--scame-primary) !important;
    font-family: 'Helvetica Neue' !important;
    color: white;
}

.btn-secondary {
    border-radius: 0px !important;
    border: 0px !important;
    font-family: 'Helvetica Neue' !important;
}

.row-button {
    justify-content: end;
    text-align: end;
    margin-top: 15px !important;
}

.row-check {
    padding-left: 10px;
    padding-bottom: 20px;
}

.form-check-label {
    font-family: 'Helvetica Neue' !important;
}

.form-check-input:checked {
    background-color: var(--scame-primary) !important;
    border-color: var(--scame-primary) !important;
}

/*.collapse:not(.show) {
    display: contents !important;
}*/

.img-login {
    padding-bottom: 35px;
}

.form-login {
    padding-top: 15px;
}

.text-link {
    font-family: 'Helvetica Neue';
    font-size: 14px;
    color: #757878;
    text-decoration: underline;
}

    .text-link:hover {
        color: var(--scame-primary);
    }

.btn-login {
    text-align: center;
    padding-left: 20% !important;
    padding-right: 20% !important;
    margin-top: 20px;
}

.login-line {
    width: 60%;
    margin-top: 30px;
    margin-bottom: 30px;
}

.text {
    font-family: 'Helvetica Neue';
    text-align: center;
    font-size: 16px;
    color: #757878;
}

.icon-social {
    color: #757878;
    margin-left: 15px;
}

    .icon-social:hover {
        color: var(--scame-primary);
        margin-left: 15px;
    }

.card {
    border-radius: 0px !important;
    border: none !important;
}

.card-header {
    background-color: var(--scame-primary) !important;
    border-radius: 0px !important;
    color: white !important;
    border: none !important;
    font-family: 'Helvetica Neue';
}

.card-body {
    background-color: #f5f5f5;
    border: none;
}

.card-body-white {
    background: white;
    border: var(--bs-border-width) solid var(--bs-border-color);
}

.label-title {
    font-family: 'Helvetica Neue' !important;
}

.table {
    font-family: 'Helvetica Neue';
}

.table-header {
    background-color: var(--scame-primary) !important;
    color: white !important;
    font-family: 'Helvetica Neue';
    font-weight: 300;
}

.table-scame-secondary {
    font-size: 14px;
}

    .table-scame-secondary th {
        background-color: var(--scame-secondary);
        color: white;
        font-weight: normal;
    }

.bg-registration-warranty {
    background-color: #eeefef !important;
}

.bg-registration-warranty-blocked {
    background-color: #eb9b9b !important;
}

.navbar-expand {
    flex-wrap: nowrap;
    justify-content: flex-end !important;
}

.title-card-dashboard {
    background-color: #f5f5f5 !important;
    color: var(--scame-primary) !important;
    font-size: 18px !important;
}

.dropdown-menu {
    z-index: 10000;
}

@media (min-width: 992px) {
    .navbar-expand-lg {
        flex-wrap: nowrap;
        justify-content: flex-end !important;
    }
}


@media screen and (max-width: 992px) {
    h2 {
        font-size: 23px !important;
    }

    .navbar-expand-lg .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
        justify-content: flex-end;
    }

    .navbar-scame {
        display: none;
    }


    .dropdown-menu {
        background-color: white !important;
        text-align: end !important;
    }

    .navbar-nav .dropdown-menu {
        position: absolute !important;
    }

    .navbar-pc-layout {
        display: none;
    }

    .sidemenu-content {
        text-align: center;
    }
}



@media screen and (max-width: 650px) {
    h2 {
        font-size: 18px !important;
    }

    .img_logo {
        width: 40% !important;
    }

    .login-line {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .img_menu {
        width: 107px;
        padding-top: 15px;
        padding-bottom: 15px;
    }
}


/*DEV CUSTOM*/
.color-primary {
    color: var(--scame-primary);
}

.loading {
    position: fixed;
    display: block;
    z-index: 10000000; /*1031*/
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    color: var(--scame-primary);
}

    .loading:before {
        content: '';
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.15);
    }


.cursor-pointer {
    cursor: pointer;
}


.title-page {
    text-align: center;
    padding-top: 30px;
}

/*** BARCODE READER***/
.zxing-button {
    border: none;
    font-family: 'Helvetica Neue' !important;
    border-radius: 0px !important;
    margin: 5px;
    padding: 8px;
}

    .zxing-button:active {
        border: solid 1px var(--scame-primary) !important;
        color: var(--scame-primary) !important;
        background: none;
    }

video {
    width: 100%;
    height: 100%;
}


/*** MENU + SIDENAV ***/
.navbar-toggler-icon {
    color: var(--scame-primary);
}

.sidenav {
    width: 100%;
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background: white;
    overflow-x: hidden;
    transition: width 0.5s;
}

    .sidenav a {
        padding: 8px;
        text-decoration: none;
        font-size: 1.2rem;
        color: var(--scame-primary);
        display: block;
        transition: 0.3s;
    }

        .sidenav a:hover {
            color: #818181;
        }


@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

        .sidenav a {
            font-size: 18px;
        }
}






/*** SYNCFUSION ***/


/* Inputs*/
.e-input-group {
    font-family: 'Helvetica Neue' !important;
    height: 38px;
}

.e-float-input.e-control-wrapper input[readonly] {
    height: auto;
}

/*Checkbox*/
.e-checkbox-wrapper .e-frame.e-check, .e-css.e-checkbox-wrapper .e-frame.e-check {
    background-color: var(--scame-primary) !important;
    border-color: var(--scame-primary) !important;
    color: #fff;
}
/* Grid */
.e-grid {
    border-radius: 1px;
    border-style: none solid solid;
    border-width: 1px;
    display: block;
    font-family: 'Helvetica Neue' !important;
    font-size: 35px;
    height: auto;
    position: relative;
}

    .e-grid .e-headercelldiv {
        border: 0 none;
        display: block;
        font-size: 35px;
        font-weight: 500 !important;
        height: 18px;
        line-height: 18px;
        margin: -7px -7px -7px -8px;
        overflow: hidden;
        padding: 0 0.4em;
        text-align: left;
        text-transform: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-grid .e-gridheader tr:first-child th {
        border-top: 0 none;
        color: white !important;
        background: var(--scame-primary) !important;
    }


.e-sortfilterdiv {
    color: white !important;
}

/* Highlight the entire selected row */
.e-grid .e-row.e-selectionbackground {
    background-color: #e6eaed !important; 
    color: #333; 
    font-weight: bold; 
    border: 1px solid #d4d4d4; 
}

/* Additional highlight for active cell */
.e-grid td.e-active {
    background-color: #c9cacb !important;
}

.grid-secondary .e-grid .e-gridheader tr:first-child th {
    background: var(--scame-secondary) !important;
}

/*Numeric textbox*/
.numeric-textbox-align-right .e-numerictextbox {
    text-align: right !important;
    padding-right: 0.5rem !important;
}

/*Grid selection*/
/*.e-grid .e-rowcell.e-selectionbackground {
    background-color: aqua !important;
}*/

.e-grid td.e-rowcell.e-focus.e-focused {
    box-shadow: none !important;
}

.e-grid .e-focused:not(.e-menu-item):not(.e-editedbatchcell) {
    box-shadow: 0 0 0 1px white inset;
}

/*Selected sorting columns*/
.e-grid th.e-headercell[aria-sort=ascending] .e-headertext,
.e-grid th.e-headercell[aria-sort=descending] .e-headertext,
.e-grid th.e-headercell[aria-sort=ascending] .e-sortfilterdiv,
.e-grid th.e-headercell[aria-sort=descending] .e-sortfilterdiv {
    color: inherit;
    font-weight: bold;
}


/*WIDGET GRID*/
/*.widget-grid .e-grid .e-gridheader tr:first-child th {
    color: black !important;
    background: white !important;
}

.widget-grid .e-grid .e-headercelldiv, e-headercell, e-headertext, .e-sortfilterdiv {
    color: black !important;
    font-weight: bold !important;
}*/


/*Calendar Today button*/
.e-calendar .e-btn.e-today.e-flat.e-primary, .e-calendar .e-css.e-btn.e-today.e-flat.e-primary {
    border-radius: 0px !important;
    border: 0px !important;
    background-color: var(--scame-primary) !important;
    font-family: 'Helvetica Neue' !important;
    color: white;
}

/*Calendar seleced date cell grid*/
.e-calendar .e-content td.e-selected.e-focused-date span.e-day {
    background-color: var(--scame-primary) !important;
    color: white;
}


/*SF Schedule*/
.e-schedule .e-vertical-view .e-selected-cell {
    background-color: var(--scame-primary) !important;
    color: white;
}

.e-schedule-dialog {
    z-index: 3000 !important;
}

.schedule-event-readonly {
    background: #FF0000 !important;
    opacity: 0.3 !important;
}


.e-pager .e-prevpage,
.e-pager .e-nextpage,
.e-pager .e-firstpage,
.e-pager .e-lastpage,
.e-pager div.e-icons.e-pager-default,
.e-pager .e-pager-default:hover {
    color: var(--scame-primary) !important;
}




/*Switch*/
.e-switch-wrapper .e-switch-inner,
.e-switch-wrapper .e-switch-handle {
    border-radius: 0;
}

    .e-switch-wrapper .e-switch-on,
    .e-switch-wrapper .e-switch-inner.e-switch-active,
    .e-switch-wrapper:hover .e-switch-inner.e-switch-active .e-switch-on {
        background-color: var(--scame-primary) !important;
        border-color: var(--scame-primary) !important;
    }


/*Calendar+Daterangepicker*/
.e-calendar .e-content td.e-selected span.e-day {
    background-color: var(--scame-primary) !important;
}

.e-daterangepicker.e-popup .e-calendar .e-range-hover.e-today:hover span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-focused-date.e-today span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-start-date.e-selected.e-today span.e-day, .e-daterangepicker.e-popup .e-calendar .e-range-hover.e-end-date.e-selected.e-today span.e-day {
    border: 1px solid var(--scame-primary) !important;
}
.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 {
    background-color: var(--scame-primary) !important;
}
.e-calendar .e-content td.e-today span.e-day, .e-calendar .e-content td.e-focused-date.e-today span.e-day {
    box-shadow: inset 2px 0 var(--scame-primary), inset 0 2px var(--scame-primary), inset -2px 0 var(--scame-primary), inset 0 -2px var(--scame-primary) !important;
}

.e-calendar .e-content td.e-today.e-selected span.e-day {
    background-color: var(--scame-primary) !important;
    box-shadow: inset 1px 0 var(--scame-primary), inset 0 1px var(--scame-primary), inset -1px 0 var(--scame-primary), inset 0 -1px var(--scame-primary) !important;
}

.e-daterangepicker.e-popup .e-footer .e-btn.e-apply.e-flat.e-primary, .e-daterangepicker.e-popup .e-footer .e-css.e-btn.e-apply.e-flat.e-primary {
    background-color: var(--scame-primary) !important;
    border-color: var(--scame-primary) !important;
}

/*Multiselect*/
.multiselect-user-colors .e-multi-select-wrapper .e-chips {
    background-color: #fff;
    border: 1px solid #a2a4a5;
}

    .multiselect-user-colors .e-multi-select-wrapper .e-chips > .e-chipcontent {
        -webkit-text-fill-color: inherit;
        color: inherit;
    }

/* Custom tooltip styling */
.custom-tooltip {
    background-color: #f4f6f9 !important; /* Lighter background, Salesforce-like */
    border: 1px solid #d8dde6 !important; /* Light border */
    border-radius: 4px !important; /* Rounded corners */
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1) !important; /* Subtle shadow */
    padding: 10px !important; /* Padding */
    font-size: 0.9rem !important; /* Font size for better readability */
    color: #333 !important; /* Dark text for contrast */
    max-width: 350px !important; /* Limit width */
    min-width: 30px !important; /* Ensure minimum width */
}

/* Ensuring the tooltip arrow matches the new style */
.e-arrow-tip-inner {
    background-color: #f4f6f9 !important; /* Matching the background color */
    border-color: #d8dde6 !important; /* Matching the border */
}


.custom-tooltip {
    background-color: #f4f6f9 !important;
    border: 1px solid #d8dde6 !important;
    border-radius: 4px !important;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1) !important;
    padding: 10px !important;
    font-size: 0.9rem !important;
    color: #333 !important;
    max-width: 350px !important;
    min-width: 30px !important;
}

.e-arrow-tip-inner {
    background-color: #f4f6f9 !important;
    border-color: #d8dde6 !important;
}


/*Tooltip*/
.custom-tooltip .form-label {
    font-weight: bold !important;
    color: #595959 !important;
}

.custom-tooltip .form-control-plaintext {
    font-size: 0.85rem !important;
    color: #4a4a4a !important;
}

.custom-tooltip .e-tooltip-wrap {
    padding: 5px;
    margin: 0; /* Remove all margins */
    margin-top: -5px; /* Adjust this value to reduce top margin */
}

    .custom-tooltip .e-tooltip-wrap .row {
        margin: 0;
    }

    .custom-tooltip .e-tooltip-wrap .col-12 {
        padding: 0;
        margin-bottom: 4px;
    }

    .custom-tooltip .e-tooltip-wrap .form-label {
        margin-bottom: 2px;
    }

    .custom-tooltip .e-tooltip-wrap .form-control-plaintext {
        margin-top: 0;
    }






/*Schedule*/
.e-appointment .e-read-only {
    opacity: 55%;
}

.e-schedule .e-read-only {
    opacity: 55%;
}

.e-schedule .e-month-agenda-view .e-resource-column {
    width: 250px;
}

.form-control-detail-read {
    background: none !important;
    background-color: none !important;
    background-clip: unset !important;
    border: none !important;
    font-size: 16px;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    white-space: initial !important;
}


.grid-row-background-elapsed-time-1 {
    background-color: #A3FFA3;
}

.grid-row-background-elapsed-time-2 {
    background-color: #FFFF99;
}

.grid-row-background-elapsed-time-3 {
    background-color: #FFCCCC;
}



.timer-elapsed-time-1 {
    color: red;
    animation: flash 1s infinite;
}

@keyframes flash {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}


.service-case-status-1 {
    color: var(--service-case-status-1);
}

.service-case-status-2 {
    color: var(--service-case-status-2);
}

.service-case-status-3 {
    color: var(--service-case-status-3);
}

.service-case-status-4 {
    color: var(--service-case-status-4);
}

.service-case-priority-4 {
    color: var(--service-case-priority-4);
}


/*MAPS*/
.map-marker {
    font-size: 35px;
    text-shadow: 0 0 2px #FFFFFF, 0 0 5px #FFFFFF;
    */ /* White border */
}


.map-marker-status-1 {
    color: var(--service-case-status-1);
}

.map-marker-status-2 {
    color: var(--service-case-status-2);
}

.map-marker-status-3 {
    color: var(--service-case-status-3);
}

.map-marker-status-4 {
    color: var(--service-case-status-4);
}

.map-marker-pulsate {
    animation: pulsate 1.5s ease-out infinite; /* Pulsating animation */
    animation-delay: calc(var(--i, 0) * 0.1s);
}

.map-marker-priority-4 {
    color: var(--service-case-priority-4);
}


@keyframes pulsate {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.3); /* Increased scale factor */
        opacity: 0.8;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}


.map-tooltip {
    min-width: 150px;
    border-radius: 4px;
    border: 1px #abb9c6;
    background: #FFFFFF;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.40);
    padding-bottom: 5px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px
}

.map-tooltip-title {
    text-align: center;
    padding: 5px;
}

.map-tooltip-status-1 {
    background: var(--service-case-status-1);
    color: #FFFFFF;
}

.map-tooltip-status-2 {
    background: var(--service-case-status-2);
    color: #FFFFFF;
}

.map-tooltip-status-3 {
    background: var(--service-case-status-3);
    color: #FFFFFF;
}

.map-tooltip-status-4 {
    background: var(--service-case-status-4);
    color: #FFFFFF;
}




/*DEMO POPUP*/
.environment-info {
    padding: 0.3rem 0.3rem;
    border-radius: 0.3rem;
    margin-top: 10px;
}