﻿:root {
    /* Shell sarısı */
    --clr-primary: hsl(49deg 97% 51%);
    /* açık gri */
    --clr-secondary: #EFEFEF;
    /* gri */
    --clr-gray: hsl(0 0% 56%);
    /* Shell Kırmızı Renk */
    /* rgb: (221 29 33) */
    --clr-shell-secondary: #DD1D21;
    /* Shell Gri Renk */
    --clr-shell-gray: #404040;
    /* Shell Koyu Mavi */
    --clr-shell-bold-blue: #005696;
    /* Tablo satırı aktif rengi */
    --active-row-bg: hsla(225, 25%, 81%);
    /* Tablo satırı invalid rengi */
    --invalid-row-bg: hsl(0deg 64% 82%);
}

:root,
html,
body {
    font-size: 14px !important
}

a {
    color: var(--clr-shell-bold-blue);
}

.dropdown-item {
    cursor: pointer;
}

input[type="checkbox"] {
    accent-color: var(--clr-primary);
}

.checkbox.checkbox-shell-primary > input:checked ~ span {
    background-color: var(--clr-primary);
}

.symbol.symbol-light-warning .symbol-label {
    background-color: var(--clr-primary);
    color: #ffffff;
}

.bg-shell-warning {
    background-color: #f3eef2;
}

.alert.alert-custom.alert-outline-danger {
    border-color: #f0c2c1;
}

.btn-light-dark,
.shell-primary,
.shell-cancel,
.btn-secondary {
    font-weight: 600;
}

.shell-primary {
    color: var(--clr-shell-gray);
    background-color: var(--clr-primary);
    border-color: hsl(49deg 97% 43%);
}

    .shell-primary:hover,
    .shell-primary:active,
    .shell-primary.active,
    .open .dropdown-toggle.shell-primary {
        background-color: hsl(49deg 97% 45%);
        border-color: hsl(49deg 97% 43%);
    }

    .shell-primary:active,
    .shell-primary.active,
    .open .dropdown-toggle.shell-primary {
        background-image: none;
    }

    .shell-primary.disabled,
    .shell-primary[disabled],
    fieldset[disabled] .shell-primary,
    .shell-primary.disabled:hover,
    .shell-primary[disabled]:hover,
    fieldset[disabled] .shell-primary:hover,
    .shell-primary.disabled:focus,
    .shell-primary[disabled]:focus,
    fieldset[disabled] .shell-primary:focus,
    .shell-primary.disabled:active,
    .shell-primary[disabled]:active,
    fieldset[disabled] .shell-primary:active,
    .shell-primary.disabled.active,
    .shell-primary[disabled].active,
    fieldset[disabled] .shell-primary.active {
        background-color: var(--clr-primary);
        border-color: #8C9B1D;
    }

    .shell-primary .badge {
        color: var(--clr-primary);
        background-color: var(--clr-shell-gray);
    }

.shell-danger {
    color: #FEFEFE;
    background-color: #DE1D22;
    border-color: #BF191E;
}

    .shell-danger:hover,
    .shell-danger:active,
    .shell-danger.active,
    .open .dropdown-toggle.shell-danger {
        color: #FEFEFE;
        background-color: #A83438;
        border-color: #BF191E;
    }

    .shell-danger:active,
    .shell-danger.active,
    .open .dropdown-toggle.shell-danger {
        background-image: none;
    }

    .shell-danger.disabled,
    .shell-danger[disabled],
    fieldset[disabled] .shell-danger,
    .shell-danger.disabled:hover,
    .shell-danger[disabled]:hover,
    fieldset[disabled] .shell-danger:hover,
    .shell-danger.disabled:focus,
    .shell-danger[disabled]:focus,
    fieldset[disabled] .shell-danger:focus,
    .shell-danger.disabled:active,
    .shell-danger[disabled]:active,
    fieldset[disabled] .shell-danger:active,
    .shell-danger.disabled.active,
    .shell-danger[disabled].active,
    fieldset[disabled] .shell-danger.active {
        background-color: #DE1D22;
        border-color: #BF191E;
    }

    .shell-danger .badge {
        color: #DE1D22;
        background-color: #FEFEFE;
    }

.shell-cancel {
    color: #666666;
    background-color: var(--clr-secondary);
    border-color: #999999;
}

    .shell-cancel:hover,
    .shell-cancel:active,
    .shell-cancel.active,
    .open .dropdown-toggle.shell-cancel {
        color: #000000;
        background-color: #bebebe;
        border-color: #999999;
    }

        .shell-cancel:hover i {
            color: #ffffff;
        }

    .shell-cancel:active,
    .shell-cancel.active,
    .open .dropdown-toggle.shell-cancel {
        background-image: none;
    }

    .shell-cancel.disabled,
    .shell-cancel[disabled],
    fieldset[disabled] .shell-cancel,
    .shell-cancel.disabled:hover,
    .shell-cancel[disabled]:hover,
    fieldset[disabled] .shell-cancel:hover,
    .shell-cancel.disabled:focus,
    .shell-cancel[disabled]:focus,
    fieldset[disabled] .shell-cancel:focus,
    .shell-cancel.disabled:active,
    .shell-cancel[disabled]:active,
    fieldset[disabled] .shell-cancel:active,
    .shell-cancel.disabled.active,
    .shell-cancel[disabled].active,
    fieldset[disabled] .shell-cancel.active {
        background-color: var(--clr-secondary);
        border-color: #999999;
    }

    .shell-cancel .badge {
        color: var(--clr-secondary);
        background-color: #666666;
    }

    .shell-primary[disabled],
    .shell-primary.disabled,
    .shell-cancel[disabled],
    .shell-cancel[disabled] {
        color: unset !important
    }

.form-control.form-control-solid {
    background-color: #F3F6F9;
    border-color: #F3F6F9;
    color: #3F4254;
    -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    -o-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
}

    .form-control.form-control-solid::-moz-placeholder {
        color: #B5B5C3;
        opacity: 1;
    }

    .form-control.form-control-solid:-ms-input-placeholder {
        color: #B5B5C3;
    }

    .form-control.form-control-solid::-webkit-input-placeholder {
        color: #B5B5C3;
    }

    .form-control.form-control-solid:active, .form-control.form-control-solid.active, .form-control.form-control-solid:focus, .form-control.form-control-solid.focus {
        background-color: #EBEDF3;
        border-color: #EBEDF3;
        color: #3F4254;
        -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
        -o-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
        transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
    }



.dropdown-item.active, .dropdown-item:active {
    color: #181C32;
    font-weight: 600;
    text-decoration: none;
    background-color: var(--clr-primary);
}

    .dropdown-item.active, .dropdown-item.active::before {
        content: '✓ ';
    }

.dataTables_wrapper .dataTable th.sorting_asc, .dataTables_wrapper .dataTable td.sorting_asc {
    color: #EB8705 !important;
}

.dataTables_wrapper .dataTable th.sorting_desc, .dataTables_wrapper .dataTable td.sorting_desc {
    color: #EB8705 !important;
}

.dataTables_wrapper .dataTables_paginate .pagination .page-item.active > .page-link {
    background-color: var(--clr-primary) !important;
    color: #fff;
    border-radius: 0 !important;
}


.nav.nav-pills .show > .nav-link > a.active, .nav.nav-pills .nav-link.active {
    color: #444;
    background-color: var(--clr-primary) !important;
    border-color: #93a31d;
    font-weight: bold;
}


.nav.nav-pills .nav-link:hover {
    color: #444;
    border-color: #93a31d;
    font-weight: bold;
}

.aside-menu .menu-nav > .menu-section {
    margin: 10px 0 0 0;
    height: 30px;
}

.ps__rail-y {
    width: 15px !important;
}

.scroll.ps > .ps__rail-y > .ps__thumb-y {
    width: 15px !important;
}

.card-checkbox, .card-checkbox-all, .card-checkbox-excel, .card-checkbox-form {
    width: 18px;
    height: 18px;
}

.select2-container {
    max-width: 100% !important;
    /*    width:100% !important;*/
}

@media (min-width:576px) and (max-width:991.98px) {
    .login-link-box {
        height: auto !important
    }

    .login.login-1 .login-content .login-form {
        width: 70vw;
        max-width: 70vw;
    }

    .aside-left.aside-on,
    .offcanvas.offcanvas-on {
        width: 50% !important
    }
}

.rect_location {
    display: none;
}

@media (min-width:576px) {
    .scale-form {
        -webkit-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        margin-top: -30px
    }

    .filo.align-self-center {
        font-size: 30px;
        height: 56px
    }
}

#link-boxes-row {
    padding-left: 10px;
}

.ki-close:before {
    font-size: 12px;
}

@media (max-width:575.98px) {
    .prev,
    .next:not(.paginate_button) {
        padding: 10px !important;
        font-size: 16px !important
    }

    #shell-img-sfs {
        -webkit-transform: scale(0.6) !important;
        -ms-transform: scale(0.6) !important;
        transform: scale(0.6) !important;
    }

    .ki-close:before {
        font-size: 10px;
    }

    .daterangepicker {
        width: -webkit-min-content !important;
        width: -moz-min-content !important;
        width: min-content !important
    }

    .drp-selected {
        margin-bottom: 1rem
    }

    .daterangepicker .ranges ul {
        width: 300px !important
    }

    #balanceform-wrapper {
        width: 100%;
        max-width: 100%;
        margin-top: 40px;
        min-height: 100vh;
    }

    #kt_footer {
        display: block !important;
    }

    .filo.align-self-center {
        font-size: 19px;
    }
}

@media (min-width:575.98px) and (max-width:1198.98px) {

    .modal-dialog.modal-xl {
        max-width: 675px;
    }
}

@media (min-width:992px) {
    #kt_aside_menu {
        padding-bottom: 40px;
    }
}

@media (max-width:991.98px) {
    .daterangepicker .ranges li {
        -ms-flex: 0 0 50%;
        -webkit-box-flex: 0;
        flex: 0 0 50%;
        max-width: 50%;
    }

    #kt_aside,
    #kt_quick_user {
        margin-top: 105px;
    }

    #kt_aside_menu {
        padding-bottom: 145px;
    }

    .login-aside-sfs {
        width: 100vw !important;
        aspect-ratio: 1.55 / 1;
        background-color: hsl(0 0% 80%);
    }
}

@media (min-width:992px) {
    .shell-logo-size {
        height: 45px
    }

    .daterangepicker .ranges li {
        -ms-flex: 0 0 100%;
        -webkit-box-flex: 0;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .h-100vh {
        height: 100vh !important
    }

    .form-group.col-12.col-sm-6.col-lg-3.col-xl-2 {
        max-width: 150px !important
    }

    #frm-search .form-group {
        padding-left: 6px !important;
        padding-right: 6px !important
    }

    .position-lg-sticky,
    .position-lg-sticky-noWidth {
        position: sticky !important;
        left: 0 !important;
        z-index: 1 !important
    }

    .position-lg-sticky-scd {
        left: 67px !important
    }

    .login-aside {
        height: 100vh !important;
        aspect-ratio: 1 / 1.43;
        background-color: hsl(0 0% 80%);
    }

    .position-lg-sticky,
    .position-lg-sticky-noWidth {
        position: relative;
    }

        .position-lg-sticky:not([aria-label^='İşlemler']) {
            min-width: 40px !important;
            width: 40px !important;
            max-width: 40px !important
        }

        .position-lg-sticky[aria-label^='İşlemler'] {
            min-width: 56px !important;
            width: 56px !important;
            max-width: 56px !important
        }

        .position-lg-sticky input,
        .position-lg-sticky div {
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%)
        }

    #form-container {
        margin-left: 5%
    }
}

.login-link-box:not(:last-child) {
    border-right: 0.5px solid
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

#login-footer {
    position: absolute;
    left: 50%;
    bottom: 1px;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

.login-forgot {
    margin: 4rem 0
}

.alert {
    font-size: 13px
}

.truncate-nowidth {
    white-space: nowrap !important;
    overflow: hidden !important;
    -o-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
}

.truncate-sm {
    min-width: 100px !important;
    max-width: 100px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    -o-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
}

.truncate {
    min-width: 150px !important;
    max-width: 150px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    -o-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
}

.truncate-lg {
    min-width: 225px !important;
    max-width: 225px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    -o-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
}

.body-with-scroll {
    max-height: 60vh !important;
}

.column-narrow-30 {
    max-width: 30px;
}

.column-narrow-35 {
    max-width: 35px;
}

.column-narrow-40 {
    max-width: 40px;
}

.column-narrow-45 {
    max-width: 45px;
}

.column-narrow-50 {
    max-width: 50px;
}

.modal-body-no-padding {
    padding: 0px !important;
}

.dropdown-menu {
    -webkit-box-shadow: rgba(82, 63, 105, 0.25) 0px 0px 30px 0px !important;
    box-shadow: rgba(82, 63, 105, 0.25) 0px 0px 30px 0px !important;
}

.request {
    cursor: pointer !important;
}

.alert-close {
    position: absolute;
    right: 16px;
    top: 16px;
}

.createCardOrderSummaryHeaders {
    padding: 20px 20px 10px 20px !important;
    font-size: 21px;
    font-weight: 600;
}

    .createCardOrderSummaryHeaders span {
        border-bottom: 1px solid !important;
    }

.select2-container--default .select2-selection--single .select2-selection__rendered .select2-selection__clear {
    right: -12px;
    z-index: 1;
    background-color: white;
    padding: 7px;
}

.card-title[data-toggle='collapse'] {
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important
}

.collapse .alert:not(:last-child) {
    margin-bottom: 1rem
}

/*#frm-search .form-group:not(:last-child) {
    padding:0 0.5rem !important
}*/

.form-control#PlateCode,
.form-control#RequestNumber {
    min-width: unset !important
}

.form-control.editable-cell,
.form-control.editable-cell-excel {
    border: 2px solid var(--clr-primary);
}


.summary-header {
    font-weight: 700 !important
}

.massUpdateNumbers {
    display: -ms-grid;
    display: grid;
    place-items: center;
    background-color: var(--clr-secondary);
    width: 46px;
    height: 46px;
    border-radius: 12px;
    font-weight: 600;
    color: #3F4254;
    font-size: 1.35rem;
    margin-right: 1rem
}

    .massUpdateNumbers + .alert {
        margin-bottom: 0 !important
    }

/*#select2-CustomerCode-container,
#select2-SubCustomerCode-container,
#select2-ResellerCode-container,
input#customerCode {
    font-size: 12px !important
}*/

input#PlateCode,
input#RequestNumber,
input#PlateNoGlobal,
input#VehiclePlateCode,
input#PlateNo,
input#VknOrTckn,
input#SelectedYear,
input#SelectedMonth,
input#Plate {
    font-size: 1rem !important;
}

#kt_quick_user .offcanvas-content .shell-primary {
    margin-top: 2rem
}

a[href='/hesabim/sifremi-degistir'] {
    margin-top: 2rem
}

/*#select-count {
     z-index: 1060 !important;
}*/

/*
    Grid Test
*/

div.dataTables_wrapper div.dataTables_filter input {
    /* Tabloda ara inputu */
    margin-left: 0 !important
}

span.drp-selected {
    font-weight: bold;
    border: 2px solid #2084EB;
    padding: 5px 5px 5px 112px !important;
    font-size: 1rem !important;
    -webkit-box-shadow: 0 0 3px #2084EB;
    box-shadow: 0 0 3px #2084EB;
    position: relative
}

    span.drp-selected::before {
        content: 'Seçilen periyot:';
        position: absolute;
        left: 0;
        padding-left: 3px
    }

.card.card-custom > .card-header {
    min-height: unset
}

.navi .label.label-xl {
    height: 100%;
}

.excel-btn {
    width: 100%
}

.user-settings-icon {
    font-size: 19px;
}

.aside-menu .menu-nav > .menu-item.menu-item-open > .menu-heading .menu-icon, .aside-menu .menu-nav > .menu-item.menu-item-open > .menu-link .menu-icon i,
.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-heading .menu-icon, .aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-icon i {
    color: #DD1D21 !important
}

div#customer-history-body {
    overflow-y: revert;
}

#kt_aside_menu i[class^="flaticon"] {
    font-size: 23px
}

#kt_aside_menu img {
    border-radius: 2px;
}

.cardInfoText {
    font-weight: 600;
    font-size: small;
    color: indianred;
}

@media (min-width:992px) {
    .col-lg-2p5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20.825%;
        flex: 0 0 20.825%;
        max-width: 20.825%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }
}

@media (min-width:1200px) {
    .col-xl-1p5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.495%;
        flex: 0 0 12.495%;
        max-width: 12.495%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xl-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xl-2p25 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 18.7425%;
        flex: 0 0 18.7425%;
        max-width: 18.7425%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xl-2p5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20.825%;
        flex: 0 0 20.825%;
        max-width: 20.825%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xl-2p75 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 22.9075%;
        flex: 0 0 22.9075%;
        max-width: 22.9075%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xl-3p25 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 27.08225%;
        flex: 0 0 27.08225%;
        max-width: 27.08225%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .goToPage-btn {
        right: 6.5px
    }

    .add-vehicle-wizard {
        margin-left: 11%;
        margin-right: 11%;
    }
}

@media (min-width:1400px) {
    .col-xxl-1p25 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 10.41625%;
        flex: 0 0 10.41625%;
        max-width: 10.41625%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xxl-1p5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.495%;
        flex: 0 0 12.495%;
        max-width: 12.495%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xxl-1p75 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 14.58275%;
        flex: 0 0 14.58275%;
        max-width: 14.58275%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xxl-2p5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20.825%;
        flex: 0 0 20.825%;
        max-width: 20.825%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .col-xxl-2p75 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 22.9075%;
        flex: 0 0 22.9075%;
        max-width: 22.9075%;
        position: relative;
        width: 100%;
        padding-right: 12.5px;
        padding-left: 12.5px;
    }

    .goToPage-btn {
        right: 29.25px
    }
}

.img-responsive {
    max-width: 100%;
    height: auto
}

.alert-outline-danger,
.alert-outline-warning {
    padding-right: 30px !important
}

.modal-body {
    padding: 0 1.75rem !important;
}

#ReqNo {
    border-radius: 0.42rem !important
}

@media (min-width:768px) {
    #card-multi-actions-wrapper,
    #multi-action-menu {
        max-width: 450px
    }

    .w-md-75 {
        width: 75% !important;
    }

    .w-md-80 {
        width: 80% !important;
    }

    .w-md-95 {
        width: 95% !important;
    }

    .add-vehicle-wizard {
        margin-left: 8%;
        margin-right: 8%;
    }
}

#shell-process-menu {
    margin: 0;
}

#select-count {
    font-size: 1rem
}

    #select-count span#select-count-text {
        color: #EB8705;
        font-weight: 600;
    }

    #select-count a#clear-selection {
        color: hsl(0deg 97% 50%);
    }

#card-multi-actions-list button,
#multi-action-menu button {
    margin: 0.5rem;
}

i.col-search-mg {
    font-size: smaller;
    color: #726666;
    padding: 0.5rem;
    cursor: pointer;
    /*    color: #726666;
    position: absolute;
    right: 1.7rem;
    font-size: smaller;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.6;*/
}

/* Gridler custom scrollbar */

.dashboard-card::-webkit-scrollbar {
    width: 7px;
    height: 12px;
}

.dataTables_scrollBody::-webkit-scrollbar,
.dashboard-timeline-sfs::-webkit-scrollbar,
#paramlist .card::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

.dataTables_scrollBody::-webkit-scrollbar-thumb,
.dashboard-timeline-sfs::-webkit-scrollbar-thumb,
.dashboard-card::-webkit-scrollbar-thumb,
#paramlist .card::-webkit-scrollbar-thumb {
    background: hsl(0 0% 75%);
    border-radius: 0.42rem;
    -webkit-transition: background 0.2s ease;
    transition: background 0.2s ease;
}

    .dataTables_scrollBody::-webkit-scrollbar-thumb:hover,
    .dashboard-timeline-sfs::-webkit-scrollbar-thumb:hover,
    .dashboard-card::-webkit-scrollbar-thumb:hover,
    #paramlist .card::-webkit-scrollbar-thumb:hover {
        background: hsl(0 0% 65%);
        border-radius: 0.42rem;
    }

.dtfc-fixed-right {
    border-left: 1px solid #EBEDF3 !important
}

.daterangepicker .ranges ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.daterangepicker .ranges li {
    position: relative;
    width: 100%;
    -webkit-box-flex: 0;
}

@media (max-width: 767.98px) {
    .daterangepicker.show-calendar .ranges {
        height: 245px;
    }

    #summary-container.summary-container-request-item tr:not(:first-child):not(:nth-child(6)) td {
        width: 50%;
    }

    #summary-container.summary-container-request-item tr:not(:first-child) {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 75vw;
    }
}

@media (min-width: 768px) {
    .daterangepicker.show-calendar .ranges {
        height: 377px !important;
        border-right: 1px solid #EBEDF3;
    }
}

@media (min-width:576px) and (max-width:767.98px) {
    .daterangepicker .ranges ul {
        width: 515px;
    }
}

.pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -12.5px;
    margin-left: -12.5px;
    margin-bottom: 1rem !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.dt-buttons .btn-group,
input[placeholder='Tablo içinde ara'] {
    height: 43px;
}

.h-43 {
    height: 43px !important
}

.w-150 {
    width: 150px !important
}

i.ki-bold-more-hor {
    color: var(--clr-gray);
}

.dataTables_wrapper .dataTable tbody tr.active, .dataTables_wrapper .dataTable tbody tr.selected td {
    background-color: var(--active-row-bg) !important
}

    .dataTables_wrapper .dataTable tbody tr.active,
    .dataTables_wrapper .dataTable tbody tr.selected {
        background-color: var(--active-row-bg) !important;
    }

    .dataTables_wrapper .dataTable tbody tr.active th, .dataTables_wrapper .dataTable tbody tr.active td,
    .dataTables_wrapper .dataTable tbody tr.selected th,
    .dataTables_wrapper .dataTable tbody tr.selected td {
        background-color: var(--active-row-bg) !important;
        border-left-color: var(--active-row-bg) !important;
        border-right-color: var(--active-row-bg) !important;
        color: #3F4254;
        border-right: 0.5px solid #ffffff !important;
    }

.dataTables_wrapper .dataTable tbody tr:not(.child).active i.ki-bold-more-hor,
.dataTables_wrapper .dataTable tbody tr:not(.child).active i.ki-bold-more-hor,
.dataTables_wrapper .dataTable tbody tr:not(.child).selected i.ki-bold-more-hor,
.dataTables_wrapper .dataTable tbody tr:not(.child).selected i.ki-bold-more-hor {
    color: #000000 !important;
}


table.dataTable tr.even td {
    background-color: hsl(0,6%,93%) !important;
}

table.dataTable:not(.no-stripe) tr.even td {
    border-color: #ffffff;
}

table.no-stripe tr.even td {
    background-color: #ffffff !important;
}

.dataTables_wrapper .dataTable tbody tr:hover.active,
.dataTables_wrapper .dataTable tbody tr:hover.selected {
    background-color: var(--active-row-bg) !important;
}

    .dataTables_wrapper .dataTable tbody tr:hover.active th, .dataTables_wrapper .dataTable tbody tr:hover.active td,
    .dataTables_wrapper .dataTable tbody tr:hover.selected th,
    .dataTables_wrapper .dataTable tbody tr:hover.selected td {
        background-color: var(--active-row-bg) !important;
        border-right-color: #ffffff;
        color: #3F4254;
    }

table.dataTable tr:hover td:not([aria-label^="İşlemler"]):not(.dataTables_empty):not(.child):not(.all) {
    background-color: var(--active-row-bg) !important;
}

table.no-stripe tr:hover td {
    background-color: #ffffff !important;
}

.dataTables_wrapper .dataTable tbody tr:not(.child):hover i.ki-bold-more-hor {
    color: #000000 !important;
}

.object-fit-cover {
    -o-object-fit: cover;
    object-fit: cover;
}

@media (max-width:575.98px) {
    .bay-portal {
        font-size: 35px
    }

    .aside-left.aside-on,
    .offcanvas.offcanvas-on {
        width: 100% !important
    }
}

.invalid-sotr-detail:not(.active) {
    background-color: var(--invalid-row-bg) !important;
}

    .invalid-sotr-detail:not(.active) td,
    .invalid-sotr-detail:not(.active) td:last-child i {
        color: black !important
    }

    .invalid-sotr-detail:not(.active) i {
        color: #000000 !important
    }

table.dataTable tr.invalid-sotr-detail.even:not(.active) td {
    background-color: var(--invalid-row-bg) !important;
}

@media (min-width:1500px) {
    .quickDatePicker {
        max-width: 240px !important
    }
}

.table-min-height {
    min-height: 370px;
}

.header-fixed.subheader-fixed .subheader {
    position: fixed;
    z-index: 95;
    width: 100%;
}

@media (max-width:991.98px) {
    .header-fixed.subheader-fixed .subheader + div {
        margin-top: 5rem;
    }

    .tooltip-inner {
        display: none
    }
}

.datepicker.datepicker-dropdown {
    z-index: 1060 !important;
}

.max-h50-of {
    max-height: 50vh;
    overflow: auto;
}

.max-h75-of {
    max-height: 75vh;
    overflow: auto;
}

.dataTables_length select {
    padding-right: 3rem !important;
}

span.menu-text::before {
    content: '';
    width: 100%;
    opacity: 0;
    position: absolute;
    background-color: #DD1D21;
    left: 0;
    bottom: 0;
    height: 1.7px;
    -webkit-transition: opacity .4s;
    -o-transition: opacity .4s;
    transition: opacity .4s;
}

li.menu-item span.menu-text:hover::before {
    opacity: 1
}

.dtfc-fixed-left {
    z-index: 1;
}

thead .dtfc-fixed-left,
thead .dtfc-fixed-right {
    background-color: inherit !important;
}

.line-height-2 {
    line-height: 2
}

.text-end {
    text-align: end
}

#update-vehicle-body,
#update-vehicle-limit-body,
#invoice-detail-body {
    height: auto !important;
    max-height: 95vh !important;
}

.subheader.subheader-solid {
    border-bottom: 1px solid #EBEDF3;
}

.dataTables_wrapper table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
.dataTables_wrapper table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before {
    font-size: 1rem;
    color: var(--clr-gray);
    left: 5px
}

.accordion.accordion-toggle-arrow .card .card-header .card-title:after,
.accordion.accordion-toggle-arrow .card .card-header .card-title.collapsed:after {
    color: var(--clr-gray);
}

.thin-border {
    -webkit-box-shadow: 0 0 6px 3px #e4e6ef;
    box-shadow: 0 0 6px 3px #e4e6ef;
}

@media (max-width: 424px) {
    .w-100 .buttons-colvis {
        width: 126px;
    }
}

@media (max-width: 499px) {
    .pcard-img-text {
        right: 10%;
    }
}

@media (min-width: 500px) {
    .pcard-img-text {
        right: 20%;
    }
}

.pcard-img-text {
    position: absolute;
    bottom: 35%;
    font-weight: bold;
}

.wizard-provision #RetailCode + span {
    width: 100% !important
}

.w-50vw {
    width: 50vw !important
}

#summary-container:not(.summary-container-request-item) td {
    width: 50%
}

#rptGiftCardSalesID .switch input:empty ~ span {
    height: 25px;
}

    #rptGiftCardSalesID .switch input:empty ~ span:before,
    #rptGiftCardSalesID .switch input:empty ~ span:after {
        width: 45px;
    }

#rptGiftCardSalesID .switch input:checked ~ span:after {
    margin-left: 22px;
}

#rptGiftCardSalesID .switch input:empty ~ span:after {
    height: 19px;
    width: 19px;
    top: 3px;
    bottom: 3px;
}

.top-panel {
    -webkit-box-shadow: 0px 10px 6px -3px #e4e6ef;
    box-shadow: 0px 10px 6px -3px #e4e6ef;
    padding: 0.5rem 1rem;
    margin-bottom: 1rem;
}

.bootstrap-switch-wrapper {
    width: 112px !important;
    height: 28px !important;
}

.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-container {
    margin-left: -100% !important;
}

.bootstrap-switch .bootstrap-switch-container {
    width: 200% !important;
}

.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-label {
    line-height: 1.1 !important;
}

#add-vehicle-body .limit-field {
    border: none !important;
}

.card-custom.bg-danger tr,
.card-custom.bg-primary tr {
    color: #ffffff
}

.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container {
    -webkit-transition-duration: 0.3s !important;
    -o-transition-duration: 0.3s !important;
    transition-duration: 0.3s !important
}

.accordion .card,
#popupReportContainer .card-body,
#reportContainer .card-body {
    -webkit-box-shadow: 0 0.1rem 1rem 0 rgb(0 0 0 / 5%) !important;
    box-shadow: 0 0.1rem 1rem 0 rgb(0 0 0 / 5%) !important
}

#card-multi-actions-list,
#multi-action-menu {
    padding: 0.5rem 0;
}

    #card-multi-actions-list li,
    #multi-action-menu li {
        cursor: pointer !important
    }

        #card-multi-actions-list li:hover,
        #multi-action-menu li:hover,
        .dropdown-item:hover {
            background-color: var(--clr-primary) !important
        }

    #card-multi-actions-list button,
    #card-multi-actions-list a,
    #multi-action-menu button,
    #multi-action-menu a,
    .dropdown-item {
        color: #3F4254 !important
    }

    #card-multi-actions-list .navi-item:hover span,
    #multi-action-menu .navi-item:hover span{
        color: #3F4254 !important
    }

    #card-multi-actions-list .navi-item:hover .navi-link,
    #multi-action-menu .navi-item:hover .navi-link{
        background-color: inherit !important
    }

    #card-multi-actions-list button,
    #multi-action-menu button{
        border: 0;
        background: none;
        cursor: pointer !important
    }

.dataTables_wrapper .child .dtr-details > li .dtr-title:after {
    display: inline
}

.w-90 {
    width: 90% !important;
}

.border-invalid {
    border: 1px solid #F64E60 !important
}

.border-valid {
    border: 1px solid #1BC5BD !important
}

tfoot th {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important
}

.fa-search {
    color: var(--clr-gray) !important;
}

thead td {
    background-color: #E4E6EF
}

/*#kt_excel_vehicles_datatable .dtfc-fixed-left:not(.all),
#kt_datatable_request_items tr:not(.invalid-sotr-detail) td:first-child {
    background-color: #ffffff !important
}*/

.invalid-sotr-detail td,
.table.no-stripe tr.invalid-sotr-detail.even td,
.table.no-stripe tr.invalid-sotr-detail.odd td {
    background-color: inherit !important
}

.swal-wide {
}

.swal-content-wide {
}

@media (min-width: 1000px) {
    .swal-wide {
        width: 600px !important;
    }

    .swal-content-wide {
        max-height: 300px !important;
        height: 300px !important;
    }
}

.clr-indianred {
    color: indianred;
}

.clr-boldblue {
    color: var(--clr-shell-bold-blue);
}

.add-vehicle-wizard {
    max-width: 105%;
}

[data-scrolltop=on] .scrolltop {
    opacity: 0.6
}

.processButton {
    width: 100%;
}

.flaticon-interface-7,
.flaticon2-chart {
    color: var(--clr-gray) !important
}

.alert-text {
    font-size: 0.85rem;
    padding: 0.75rem 0;
}

.wizard-icon {
    background-color: var(--clr-secondary)
}

#kt_excel_vehicles_datatable tr td:first-child,
#kt_excel_vehicles_datatable tr td:nth-child(2) {
    background: #ffffff !important
}

.form-control.is-valid,
.form-control.is-invalid {
    background-image: none !important;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    display: none;
}

.dataTables_scrollHeadInner {
    padding-right: 17px !important
}

#customer-setting-body {
    max-height: 50vh;
    overflow: auto
}


.bg-primary-shell-yellow {
    background-color: var(--clr-primary) !important
}

.bg-primary-shell-yellow-2 {
    background-color: hsla(49deg, 97%, 51%, 0.5) !important
}

.bg-primary-shell-yellow-3 {
    background-color: hsla(49deg, 97%, 51%, 0.3) !important
}

.bg-primary-shell-yellow-4 {
    background-color: hsla(49deg, 97%, 51%, 0.1) !important
}

.bg-primary-shell-midgray {
    background-color: #7F7F7F !important
}

.change-password:not(.notIncluded) {
    background: hsl(0 0% 85%);
    border-radius: 1rem;
    padding: 1.25rem;
}

#kt_excel_vehicles_datatable tr:hover td {
    background-color: var(--active-row-bg) !important
}

td.w-40px {
    position: relative
}

.w-40px i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.table-bordered {
    border: 2px solid #EBEDF3;
}

.disabled-icon {
    color: rgba(63, 66, 84, 0.6) !important;
}

    .disabled-icon:hover {
        color: rgba(63, 66, 84, 0.6) !important;
        background-color: transparent !important;
        cursor: not-allowed !important
    }

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {
    padding-left: 30px !important
}

.phone-number-wrapper {
    position: relative;
}

    .phone-number-wrapper::before {
        content: '+90';
        position: absolute;
        background-color: var(--clr-secondary);
        height: 100%;
        width: 3rem;
        left: 0;
        top: 0;
        font-weight: 600;
        display: -ms-grid;
        display: grid;
        place-content: center;
        border: 1px solid #E4E6EF
    }

    .phone-number-wrapper input[type='tel'] {
        margin-left: 3rem !important;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: calc(100% - 3rem);
    }

.navi.navi-hover .navi-item .navi-link:hover,
.select2-container--default .select2-results__option.select2-results__option--highlighted,
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: var(--clr-primary) !important;
}

.navi .navi-item .navi-link:hover .navi-text {
    color: #3F4254 !important
}

.turkey-map-chart {
    height: 500px;
    min-width: 310px;
    max-width: 800px;
    margin: 0 auto;
}

.dashboard-card {
    max-height: calc(100% - 39px);
    overflow-y: auto;
    overflow-x: hidden;
    zoom: 88%;
    -moz-transform: scale(0.88);
    -moz-transform-origin: top left;
}

.card.card-custom > .card-body {
    padding: 1.5rem 2.25rem 0 2.25rem;
}

.goToPage-btn {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    bottom: 0.25rem;
    right: 3px;
    font-weight: 600;
    padding: 0.5rem 1rem;
    color: #000000;
    border-radius: 5px;
    cursor: pointer;
    -webkit-transition: background-color 0.25s ease;
    -o-transition: background-color 0.25s ease;
    transition: background-color 0.25s ease
}

    .goToPage-btn:hover {
        background-color: hsl(206deg 100% 30%);
        color: #ffffff !important;
    }

    .goToPage-btn span {
        display: none;
    }

    .goToPage-btn:hover span {
        margin-left: 0.5rem;
        display: block;
    }

.bg-primary-shell-midgray .goToPage-btn {
    color: #ffffff !important;
}

.dashboard-carousel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    max-width: 100%;
    position: relative;
}

    .dashboard-carousel > div:first-child {
        -webkit-transition: margin 0.5s;
        -o-transition: margin 0.5s;
        transition: margin 0.5s;
    }

    .dashboard-carousel .prev,
    .dashboard-carousel .next,
    .piechart-btn.prev,
    .piechart-btn.next {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        padding: 0 0.5rem;
        font-size: 1.75rem;
        border-radius: 5px;
        border: 2px solid hsl(206deg 100% 56%);
        color: hsl(206deg 100% 56%);
        -webkit-transition: background 0.1s;
        -o-transition: background 0.1s;
        transition: background 0.1s;
        font-family: Arial,Roboto,Helvetica,sans-serif;
        z-index: 93
    }

        .dashboard-carousel .prev:hover,
        .dashboard-carousel .next:hover {
            background: hsl(206deg 100% 88%);
        }

    .dashboard-carousel .prev {
        position: absolute;
        left: 0%;
    }

    .dashboard-carousel .next {
        position: absolute;
        right: 0%;
    }

.daterangepicker .ranges li:hover,
.daterangepicker .ranges li.active {
    background-color: var(--clr-primary);
    color: #7E8299
}

.select2-results__options {
    max-width: 100%;
    overflow-x: hidden;
    overflow-wrap: break-word;
}

#card-multi-actions-list button:disabled,
#multi-action-menu button:disabled {
    color: #B5B5C3 !important
}

.dashboard-container #dashboard-content > div:not(:last-child),
.vehicle-report-dashboard > div,
.vehicle-report-dashboard main > div {
    margin-bottom: 25px
}

.dashboard-card table a {
    font-weight: 600
}

input.validation-select:not(.is-invalid),
select.is-valid + span .selection > span,
.validation-select:not(.is-invalid) + span .selection > span {
    border-color: #1BC5BD !important
}

select.is-invalid + span .selection > span {
    border-color: #F64E60 !important
}

.dashboard-timeline-sfs {
    height: 100%;
    padding: 1.25rem;
}

@media (min-width:1200px) {
    .dashboard-top-panel-sc {
        height: 600px !important;
        max-height: 750px !important;
    }
}

@media (min-width:2000px) {
    .col-uxl-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

.dashboard-carousel {
    margin-bottom: 25px
}

@media (max-width: 575.98px) {
    .dashboard-top-panel-2 > div {
        margin-bottom: 25px;
        height: 265px !important;
    }
}

@media (min-width: 576px) and (max-width: 1199.98px) {
    .dashboard-top-panel-2 {
        height: 265px;
        margin-bottom: 25px
    }
}

@media (max-width:1199.98px) {
    .dashboard-top-panel > div:last-child {
        padding-right: 25px !important;
        padding-left: 25px !important;
        margin-bottom: 25px
    }

    .dashboard-carousel {
        height: 350px;
    }

    .vehicle-report-top-panel > div:not(:last-child) {
        margin-bottom: 25px;
    }
}

@media (min-width:1200px) {
    .dashboard-top-panel-2 {
        height: calc(50% - 12.5px);
    }

    .dashboard-carousel {
        height: calc(50% - 12.5px);
    }

    .dashboard-top-panel:not(.dashboard-top-panel-sc) .dashboard-top-panel-2 {
        height: 100%;
    }
}

#update-vehicle-modal #LimitType + span,
#update-vehicle-modal #IsLiterCustomer + span,
#add-vehicle-modal #LimitType + span,
#add-vehicle-modal #IsLiterCustomer + span {
    width: 41% !important
}

.component-message-background {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 25;
    top: 0;
    left: 0;
    display: -ms-grid;
    display: grid;
    place-items: center;
}

.dashboard-top-panel > div:first-child .component-message-background {
    width: calc(100% - 25px) !important;
    margin-left: 12.5px !important;
}

.component--error,
.component--nodata {
    max-width: 85%
}

.component--loader__wrapper {
    display: -ms-grid;
    display: grid;
    place-items: center;
    margin-bottom: 1rem
}

.component--loader__spinner::before {
    width: 3rem !important;
    height: 3rem !important;
    left: -2rem !important;
    margin-top: 1rem !important
}

#paramlist table {
    margin-bottom: 0 !important
}

#paramlist .card {
    min-height: calc(100% + 1px);
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
    word-break: break-word;
}

#dashboard-date-filter + span {
    width: 100% !important
}

.clr-bold-blue {
    color: var(--clr-shell-bold-blue);
    text-decoration: underline;
}

    .clr-bold-blue:hover {
        color: var(--clr-shell-bold-blue) !important;
        text-decoration: underline !important;
    }

input.form-control::-webkit-input-placeholder {
    color: hsl(0 0% 56%) !important;
    font-weight: 600 !important
}

input.form-control::-moz-placeholder {
    color: hsl(0 0% 56%) !important;
    font-weight: 600 !important
}

input.form-control:-ms-input-placeholder {
    color: hsl(0 0% 56%) !important;
    font-weight: 600 !important
}

input.form-control::-ms-input-placeholder {
    color: hsl(0 0% 56%) !important;
    font-weight: 600 !important
}

input.form-control::placeholder {
    color: hsl(0 0% 56%) !important;
    font-weight: 600 !important
}

input.form-control:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: hsl(0 0% 56%) !important;
}

.select2-container--disabled {
    background-color: #ddd !important;
    padding: 0 !important;
    display: block;
    width: 100%;
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #3F4254;
    background-clip: padding-box;
    border: 1px solid #E4E6EF;
    border-radius: 0.42rem;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    -o-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

    .select2-container--disabled .select2-selection__clear {
        background-color: inherit !important;
    }

    .select2-container--disabled > span {
        height: 100%;
    }

        .select2-container--disabled > span > span {
            background-color: inherit !important;
            height: 100% !important
        }

#paramlist tbody tr:nth-of-type(odd) {
    background-color: hsl(49deg 97% 90%)
}

#shell-img-sfs {
    margin-left: -10px;
}

.scrolltop {
    background-color: var(--clr-shell-bold-blue) !important;
}

.vehicle-report-top-panel > div {
    height: 375px !important
}

.tooltip-inner {
    background: var(--clr-shell-gray);
    color: #ffffff
}

a.text-hover-primary:hover,
.text-hover-primary:hover {
    color: var(--clr-shell-bold-blue) !important
}

.dashboard-timefilter,
.date-filters {
    z-index: 93
}

.btn-group.date-filters.text-end button {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.dashboard-timefilter button {
    background: none !important;
    border: none !important;
    outline: none !important
}

.dashboard-timefilter .dropdown-item:hover {
    background: var(--clr-primary) !important
}

.dashboard-timefilter .dropdown-item.active,
.dashboard-timefilter .dropdown-item.active::before {
    content: '';
    background: var(--clr-primary) !important
}

.dashboard-timefilter i {
    color: #000000;
    font-size: 1.5rem;
}

.offcanvas {
    z-index: 7500
}

#CardNumberField #CardNumber + span,
#StatusCode + span {
    width: 100% !important;
}

    #CardNumberField #CardNumber + span,
    #CardNumberField #CardNumber + span span {
        height: 100% !important
    }

#kt_aside_menu_wrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.card-select-dropdown {
    padding-right: 3px;
}

@media (max-width: 1199.98px) {
    #add-vehicle-modal .modal-dialog,
    #add-handover-modal .modal-dialog,
    #update-handover-modal .modal-dialog,
    #update-vehicle-modal .modal-dialog {
        min-width: 90vw !important
    }
}

@media (min-width: 1200px) {
    #add-vehicle-modal .modal-dialog,
    #add-handover-modal .modal-dialog,
    #update-handover-modal .modal-dialog,
    #update-vehicle-modal .modal-dialog {
        min-width: 65vw !important
    }

    #add-handover-modal .modal-dialog,
    #update-handover-modal .modal-dialog {
        min-width: 55vw !important
    }
}

.center-grid {
    display: grid;
    place-items: center;
}

.center-flex {
    display: flex;
    justify-content: center;
    align-items: center
}

.center-absolute {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.btn .svg-icon {
    margin-right: 0 !important
}

@media (min-width: 768px) {
    .dashboard-timefilter {
        display: none !important;
    }

    .date-filters:not(.hgs) {
        display: block !important;
    }
}

@media (max-width: 767.98px) {
    .dashboard-timefilter {
        display: block !important;
    }

    .date-filters:not(.hgs) {
        display: none !important;
    }
}

.audit-date-filters {
    position: relative
}

.date-filters {
    transition: all 0.2s ease;
    margin-right: 3px;
}

    .date-filters button {
        border-radius: 10px;
        padding: 5px !important;
        border: 1px solid hsl(0 0% 74%) !important;
    }

    .date-filters > .btn:not(:first-child) {
        margin-left: -5px;
    }

    .date-filters button.active,
    .date-filters button:focus,
    .date-filters button:hover {
        background-color: var(--clr-primary) !important;
    }

    .date-filters button.active,
    .date-filters button:hover {
        color: var(--clr-shell-gray) !important
    }

.audit-title,
#heatmap .apexcharts-title-text,
#piechart--title {
    text-decoration: underline;
    font-size: 16px !important
}

.vehicledashboard-filter-disabled[disabled],
.vehicledashboard-filter-disabled[disabled] + span {
    background-color: #ffffff !important
}

.ranges ul {
    width: 100% !important
}

.daterangepicker {
    width: 200px
}

    .daterangepicker.show-calendar {
        justify-content: flex-end;
        width: 550px;
    }

.text-warning {
    color: #EB8705 !important
}

.page-loader {
    z-index: 1051 !important;
    background: rgba(0, 0, 0, 0.1) !important;
}

.card-select-dropdown a:first-child {
    color: #3F4254;
    background-color: #E4E6EF;
    border-color: #E4E6EF;
    width: auto;
}

.font-weight-bold,
.buttons-colvis,
.dropdown-toggle,
.detail-table .detail:first-child,
.misc-btn-dd-detail,
.misc-btn-dd-main,
#view-order-btn,
.buttons-collection,
.dt-button {
    font-weight: 600 !important
}

.req-btn-wrapper-b2b,
.req-btn-wrapper-dd {
    display: none;
}

@media (max-width: 1599.98px) {
    .req-btn-wrapper-dd {
        display: block !important;
    }
}

@media (min-width: 1600px) {
    .req-btn-wrapper-b2b {
        display: block !important;
    }
}

@media (max-width:575.98px) {
    .audit-title,
    #heatmap .apexcharts-title-text,
    #piechart--title {
        text-decoration: underline;
        font-size: 14px !important
    }
}

[aria-controls="kt_user_datatable"] {
    font-weight: 600
}

.select2-container--disabled .select2-selection__clear {
    display: none !important;
}

.alert-text {
    font-size: 1.15rem !important
}

.carouselItem td {
    vertical-align: inherit !important
}

.praticcard-order-img {
    color: #fff;
    position: absolute;
    bottom: -7px;
    left: 15px;
    font-weight: bold;
    font-size: 12px;
}

.praticcard-txtField {
    color: #fff;
    position: absolute;
    font-weight: bold;
    font-size: 12px;
    display: inline-block;
    bottom: 5%;
    left: 11%;
    width: 90%;
}

@media only screen and (min-width: 768px) {
    .praticcard-txtField {
        font-size: 13px;
        bottom: 10%;
        left: 10%;
        width: 80%;
    }
}

@media only screen and (min-width: 992px) {
    .praticcard-txtField {
        font-size: 14px;
        bottom: 15%;
        left: 13%;
        width: 70%;
    }
}

#vehicle-limit-edit-form .fv-plugins-message-container {
    margin-left: 1rem;
}

.tab-panel {
    background: #fff;
    box-shadow: 0px 0px 30px 0px rgba(82, 63, 105, 0.05);
    padding: 1rem 0.75rem;
}

    .tab-panel a {
        color: var(--clr-shell-gray) !important;
        font-weight: 600;
        border-radius: 12px !important;
        padding: 0.5rem 1.5rem !important;
        border: none !important;
        position: relative;
        background: var(--clr-secondary);
        transition-duration: 0.1s !important;
    }

        .tab-panel a.active,
        .tab-panel a:hover {
            background: var(--clr-secondary) !important;
            box-shadow: 0 0 3px;
        }

            .tab-panel a.active::before,
            .tab-panel a:hover::before {
                content: '';
                position: absolute;
                bottom: -13px;
                width: 100%;
                height: 5px;
                background: var(--clr-primary);
                left: 0;
                border-radius: 2px;
            }

@media (max-width: 991.98px) {
    .tab-panel {
        justify-content: center;
    }
}

@media (max-width: 413px) {
    .tab-panel li:not(:last-child) {
        margin-bottom: 2rem !important;
    }
}

#transaction-req-json-table,
#transaction-resp-json-table {
    border: none;
    min-height: 0 !important;
    margin: 1.9rem 1.5rem;
}

    #transaction-req-json-table td,
    #transaction-resp-json-table td {
        border-color: var(--clr-gray) !important;
        max-width: 350px !important;
    }

    #transaction-req-json-table tr.odd td,
    #transaction-resp-json-table tr.odd td,
    .cfgwJsonNode {
        background-color: hsla(49deg, 97%, 51%, 0.5);
    }

    #transaction-req-json-table tr.even td,
    #transaction-resp-json-table tr.even td {
        background-color: hsl(49deg 97% 90%);
    }

.clip-padding {
    background-clip: padding-box !important
}

#transaction-req-detail-body,
#transaction-resp-detail-body {
    max-height: 500px;
    overflow: hidden auto;
    padding-right: 3rem !important;
}

.transaction-array-index {
    font-weight: 700;
    font-size: 1.45rem;
    text-decoration: underline;
}

.card-carwash-order .wizard-steps {
    margin-left: 9%;
}

@media (max-width: 767.98px) {
    .card-prepaidcard-order .wizard-steps,
    .card-partnercard-order .wizard-steps,
    .card-carwash-order .wizard-steps {
        margin-left: 0;
    }
}

.card-prepaidcard-order .card-body,
.card-partnercard-order .card-body,
.card-carwash-order .card-body {
    padding: 1.5rem 0;
}

#session-timeout-dialog .modal-body {
    height: auto !important
}

.cfgwJsonKey {
    background-color: #ddd !important;
    font-weight: 600;
}

.cfgwJsonValue {
    background-color: #F0EEEE !important;
}

.cfgwJsonNoData {
    background: #ddd;
    border-radius: 4px;
    font-weight: 600;
    margin: 0.75rem;
    padding-left: 0.75rem;
}

.calicon-update1,
.calicon-update2 {
    cursor: pointer;
    font-size: 2rem !important;
}

.progress-bar-striped.progress-bar {
    background-color: var(--clr-primary) !important;
}

.phone-wrapper {
    padding-left: 35px;
}

    .phone-wrapper::before {
        content: "+90";
        height: 100%;
        width: 35px;
        background: var(--clr-secondary);
        color: black;
        position: absolute;
        top: 0;
        left: 0;
        display: grid;
        place-content: center;
    }

.howToImgSection {
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    -o-transition: opacity 0.5s;
    transition: opacity 0.5s;
    width: 75vw;
    height: 42vw;
    z-index: 99999;
}

@media (max-width: 992px) {
    .howToImgSection {
        width: 85vw;
        height: 48vw;
    }
}

.howToImgSection[hidden] {
    opacity: 0
}

.howToImgSection .prev {
    border-radius: 10px 0 0 10px;
    left: -50px;
}

.howToImgSection .prev,
.howToImgSection .next {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.howToImgSection .next,
.howToImgSection .close {
    border-radius: 0 10px 10px 0;
    right: -50px;
}

.howToImgSection .prev,
.howToImgSection .next,
.howToImgSection .close {
    position: absolute;
    font-size: 4rem;
    cursor: pointer;
    border: 1px solid rgba(0 0 0 / 56%);
    padding: 0.5rem;
    color: #fff;
    background: hsl(0 0% 56%);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 50px;
    text-align: center;
}

@media (max-width: 1200px) {
    .howToImgSection .prev,
    .howToImgSection .next,
    .howToImgSection .close {
        font-size: 2rem
    }
}

@media (max-width: 991.98px) {
    .howToImgSection .close {
        right: 0;
        top: -44px !important;
        border-radius: 10px 10px 0 0;
    }
}

.howToImgSection .prev:hover,
.howToImgSection .next:hover,
.howToImgSection .close:hover {
    background: hsl(0, 0%, 41%) !important;
}

.howToImgSection .close {
    top: 0;
    opacity: 1 !important;
}

.howToImgSection .imgContainer {
    width: 100%;
    height: 100%;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transform: translateY(-75px) scale(0.8);
    -ms-transform: translateY(-75px) scale(0.8);
    transform: translateY(-75px) scale(0.8);
    opacity: 0.75;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.5s;
    transition: opacity 0.35s, -webkit-transform 0.5s;
    -o-transition: opacity 0.35s, transform 0.5s;
    transition: opacity 0.35s, transform 0.5s;
    transition: opacity 0.35s, transform 0.5s, -webkit-transform 0.5s;
}

.howToImgSection.visible .imgContainer {
    -webkit-transform: translateY(0) scale(1);
    -ms-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
    opacity: 1;
}

.howToImgBackdrop {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: hsl(0,0%,-30%);
    z-index: 99998;
    opacity: 0.3;
}

.plateCodeWrapper.validation::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='L9' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 100' enable-background='new 0 0 0 0' xml:space='preserve'%3E%3Cpath fill='%23red' d='M73 50c0-12.7-10.3-23-23-23S27 37.3 27 50 M30.9 50c0-10.5 8.5-19.1 19.1-19.1S69.1 39.5 69.1 50'%3E%3CanimateTransform attributeName='transform' attributeType='XML' type='rotate' dur='1s' from='0 50 50' to='360 50 50' repeatCount='indefinite' /%3E%3C/path%3E%3C/svg%3E");
    width: 30px;
    height: 30px;
    position: absolute;
    right: 1rem;
}

[id^="wizard-"]:not([disabled]) svg {
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    -o-transition: transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s;
}

[id^="wizard-"] rect {
    fill: var(--clr-gray) !important;
}

[id^="wizard-"] rect {
    opacity: 1;
    height: 13px;
}

[id^="wizard-fwd"]:not([disabled]):hover svg {
    -webkit-transform: translateX(3px);
    -ms-transform: translateX(3px);
    transform: translateX(3px);
}

[id^="wizard-back"]:not([disabled]):hover svg {
    -webkit-transform: translateX(-3px);
    -ms-transform: translateX(-3px);
    transform: translateX(-3px);
}

.w-200 {
    width: 200px !important
}

.apexcharts-datalabels {
    opacity: 1 !important;
}

    .apexcharts-datalabels.legend-mouseover-inactive {
        opacity: 0.7 !important;
    }

.shell-primary i {
    color: var(--clr-gray)
}

.shell-primary circle,
.shell-primary path {
    fill: var(--clr-gray) !important
}

.select-info .select-item:not(:first-child) {
    display: none;
}

#customer-setting-modal #ProvisionCount + .fv-plugins-message-container {
    position: absolute;
    left: 50%;
    top: 3rem;
}

.shell-primary i {
    color: #000;
}

.switch.switch-outline.switch-success input:empty ~ span:after {
    background-color: var(--clr-gray)
}

.switch.switch-outline.switch-success input:checked ~ span:after {
    background-color: #BED50F
}

.switch.switch-outline.switch-success input:empty ~ span:before {
    border-color: var(--clr-gray)
}

.switch.switch-outline.switch-success input:checked ~ span:before {
    border-color: #BED50F
}

.maintenance-img {
    width: 100%;
}

@media (min-width: 1300px) {
    .maintenance-img {
        width: 60%;
    }
}

#card-multi-actions-list button:disabled,
#multi-action-menu button:disabled {
    opacity: 0.6;
}

#card-multi-actions-list button,
#multi-action-menu button {
    width: 100%;
    text-align: center;
}   

@media (max-width: 1000px) {
    .alert-text {
        font-size: 12px !important
    }
}

.svg-icon.svg-icon-shell-primary svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: var(--clr-primary) !important;
}

.svg-icon.svg-icon-shell-primary svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
}

body.aside-minimize #sidebar-searchbox__container .svg-icon {
    margin-left: 0.5rem;
}

.shell-primary i {
    color: #000
}

.content-modal-css .ps__rail-x,
.content-modal-css .ps__rail-y,
.content-modal-css .carousel-indicators {
    display: none !important;
}

.content-modal-css .modal-body {
    overflow-y: auto !important;
    height: 50vh !important;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 25px;
    height: 25px;
    position: absolute;
    display: block;
    top: 50%;
    transform: translateY(-50%);
}

.carousel-control-prev-icon {
    transform: rotate(180deg) translateY(50%)
}

.carousel-control-next,
.carousel-control-prev {
    background: rgb(0,0,0,0.25);
    height: 50px;
    width: 50px;
    bottom: auto;
    z-index: 99
}

.carousel-control-next {
    right: 0;
}

.carousel-control-prev {
    right: 75px;
    left: auto;
}

/* Generic Views */

#create-description-form,
#update-description-form {
    max-height: 600px
}

/* search bar */

#sidebar-searchbox__container {
    border-bottom: 1px solid rgba(0 0 0 / 25%);
}

#sidebar-searchbox {
    outline: none !important;
    border: none !important;
}

    #sidebar-searchbox::placeholder {
        font-style: italic;
        opacity: 0.75
    }

.aside-minimize:not(.aside-minimize-hover) .aside #sidebar-searchbox,
.aside-minimize:not(.aside-minimize-hover) .aside .menu-goback__text {
    display: none;
}

.menu-goback {
    border-top: 1px solid rgba(0 0 0 / 25%);
}

.inline-fit {
    min-inline-size: fit-content;
}

.deploycolortest {
    background: indianred !important;
}

.deploycolortest2 {
    background: cadetblue !important;
}

.zoom-80 {
    zoom: 80%;
}

.zoom-85 {
    zoom: 85%;
}

.zoom-90 {
    zoom: 90%;
}

.zoom-95 {
    zoom: 95%;
}

#myTabContent[class^="zoom"] {

}

@media (min-width: 1400px) {
    #define-top-limit-modal .modal-dialog.modal-xl {
        max-width: 1300px;
    }
}

[data-labelup]::before {
    content: "";
    position: absolute;
    top: -16px;
    left: 14px;
    z-index: 70;
    opacity: 1;
    font-size: 0.8rem;
    font-weight: bold;
}

@media (min-width: 2500px) {
    [data-labelup]::before {
        top: -26px;
        font-size: 1.15rem;
    }
}

.input-group-text:has(> .la-calendar) {
    padding: 0.65rem !important;
}

.modal-header,
.modal-footer {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/*body:has(#add-handover-modal.show) :is(.datepicker-dropdown, .tooltip.show, body > .select2-container--open),
body:has(#update-handover-modal.show) :is(.datepicker-dropdown, .tooltip.show, body > .select2-container--open) {
    scale: 0.85;
    z-index: 10000 !important;
    margin-top: -7px !important;
}*/

.list-unstyled {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background-color: #E4E6EF !important;
    border-radius: 5px;
}

.dashboard-placeholder {
    height: calc(100% + 25px);
    width: 100%;
    background: rgba(0 0 0 / 0.3);
    position: absolute;
    z-index: 94;
    top: -12.5px;
}

    .dashboard-placeholder > div {
        background: #fff;
        display: grid;
        place-items: center;
        height: 100px;
        padding: 2rem;
        border-radius: 5px;
        top: 10rem;
        position: sticky;
        margin-top: 10rem;
    }

.notruncate-table td {
    min-width: 155px !important;
    max-width: 155px !important;
    word-break: break-all;
}

.text-underline {
    text-decoration: underline;
}

.gap-0 {
    gap: 0;
}

.gap-1 {
    gap: 0.25rem;
}

.gap-2 {
    gap: 0.5rem;
}

.gap-3 {
    gap: 1rem;
}

.gap-4 {
    gap: 1.5rem;
}

.gap-5 {
    gap: 3rem;
}

.charger-handover-btn.disabled {
    cursor: not-allowed;
}

#VehicleConfirmation + span.valid {
    border: 1.5px solid #1BC5BD !important;
}

#VehicleConfirmation + span.invalid {
    border: 1.5px solid #F64E60 !important;
}

#add-vehicle-modal .alert-text,
[for="VehicleConfirmation"] {
    font-size: 0.82rem !important;
}

#checkboxContainer .checkbox.checkbox-lg > span,
#checkboxContainerMass .checkbox.checkbox-lg > span {
    height: 18px !important;
    width: 18px !important;
    border: 1px solid rgba(0 0 0 / 50%);
    margin-bottom: 0 !important;
}

#checkboxContainer .checkbox.checkbox-lg > span:after,
#checkboxContainerMass .checkbox.checkbox-lg > span:after {
    width: 4px !important;
    height: 8px !important;
}

#MassCreateSotrCardResultBody {
    height: auto !important;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-color: #E4E6EF !important;
}