﻿@font-face {
    font-family: 'GESS';
    src: url("/fonts/GESS/GESSTwoLight-Light.woff2") format("woff2"), url("/fonts/GESS/GESSTwoLight-Light.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    unicode-range: U+003A-FFFF;
}

@font-face {
    font-family: 'GESS';
    src: url("/fonts/GESS/GESSTwoBold-Bold.woff2") format("woff2"), url("/fonts/GESS/GESSTwoBold-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    unicode-range: U+003A-FFFF;
}

@font-face {
    font-family: 'GESS';
    src: url("/fonts/GESS/GESSTwoMedium-Medium.woff2") format("woff2"), url("/fonts/GESS/GESSTwoMedium-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    unicode-range: U+003A-FFFF;
}


/* Buttons */
:root {
    --Foundation-Blue-Normal: #019AC6; 
    --L: 16px; 
    --MD:10px ;
    --Radius:16px;
    --alternate-default-color: #fff; 
    --heading-color: #000; 
    --accent-color: #019AC6; 
    --surface-color: #E6F5F9; 
    --contrast-color: #ffffff; 
}

.icon-notify {
    stroke-width: 1.2px;
    width:35px;
    height:35px;
}

.icon-default {
    stroke-width: 1.2px;
    color: #555555b8;
}

.form-hint {
    font-size: 0.8rem;
    color: #555;
    font-style: italic;
}

.content-ar {
    direction: rtl;
    font-family: "GESS", "IBM Plex Sans", sans-serif;
}

.jconfirm.jconfirm-modern .jconfirm-bg {
    background: rgb(15 21 32 / 40%);
}

.btn-primary {
    color: #fff;
    background-color: var(--Foundation-Blue-Normal);
    border-color: #019AC6;
}


.btn-primary:hover {
    color: #019AC6;
    background-color: #fff;
    border-color: #3019AC6;
}

.btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: #0158d4;
    border-color: #0153c7;
    box-shadow: 0 0 0 0.2rem rgba(39, 127, 251, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: #0168fa;
    border-color: #0168fa;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #0153c7;
    border-color: #014ebb;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(39, 127, 251, 0.5);
}



.btn-secondary, .ui-datepicker-buttonpane button {
    color: #fff;
    background-color: #7987a1;
    border-color: #7987a1;
}

.btn-secondary:hover, .ui-datepicker-buttonpane button:hover {
    color: #fff;
    background-color: #64738f;
    border-color: #5f6d88;
}

.btn-secondary:focus, .ui-datepicker-buttonpane button:focus, .btn-secondary.focus, .ui-datepicker-buttonpane button.focus {
    color: #fff;
    background-color: #64738f;
    border-color: #5f6d88;
    box-shadow: 0 0 0 0.2rem rgba(141, 153, 175, 0.5);
}

.btn-secondary.disabled, .ui-datepicker-buttonpane button.disabled, .btn-secondary:disabled, .ui-datepicker-buttonpane button:disabled {
    color: #fff;
    background-color: #7987a1;
    border-color: #7987a1;
}

.btn-secondary:not(:disabled):not(.disabled):active, .ui-datepicker-buttonpane button:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .ui-datepicker-buttonpane button:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle,
.ui-datepicker-buttonpane .show > button.dropdown-toggle {
    color: #fff;
    background-color: #5f6d88;
    border-color: #5a6780;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .ui-datepicker-buttonpane button:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .ui-datepicker-buttonpane button:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus,
.ui-datepicker-buttonpane .show > button.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(141, 153, 175, 0.5);
}

/* Buttons */

/*TABLE VIEW*/
table.dataTableCircular thead td:first-child {
    border-top-left-radius:12px;
}

table.dataTableCircular thead td:last-child {
    border-top-right-radius: 12px;
}


table.dataTable thead th, table.dataTable thead td {
    padding: 10px 18px;
    border-bottom: 0px solid #111111;
    background-color: #E6F5F9;
    color: #000;
    margin-bottom: 10px;
}

table.dataTable thead th:first-child {
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.rtl table.dataTable thead th:first-child {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}

table.dataTable thead th:last-child {
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}

.rtl table.dataTable thead th:last-child {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.table-striped tbody tr:nth-of-type(2n) {
    background-color: #F5FBFC;
}

.table-striped tbody tr:nth-of-type(2n+1) {
    background-color: #fff;
}

table.dataTable {
    border: 1px solid transparent;
}

.table th, .table td {
    border-top: 1px solid transparent;
}

table.dataTable.no-footer {
    border-bottom-color: transparent;
}

.dataTables_filter
{ display:none;}


.content-body > .container {
    padding-left: 0px;
    padding-right: 0px;
}

.alert-row {
    color: red;
}

.fullscreen {
    overflow: auto;
}

.page-header-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.form-control-disabled {
    background-color: rgb(245 246 250);
    border-color: rgb(245 246 250);
}

.form-control-hint {
    font-size: 13px;
    color: #8392a5;
}

.content-mail-holder1 {
    width: 60%;
    padding: 0px 5px;
    min-height: 60px;
}

.content-mail-holder2 {
    width: 40%;
    padding: 0px 5px;
    min-height: 60px;
}

.content-mail-holder21 {
    width: 50%;
    padding: 0px 5px;
}

.content-mail-holder22 {
    width: 50%;
    padding: 0px 5px;
}

.content-mail-holder23 {
    width: 50%;
    padding: 0px 5px;
}


.btn-uppercase {
    white-space: nowrap;
}

.btn-status {
    min-width: 180px;
    border-radius: 20px;
    cursor: auto;
}

.btn-status-sm {
    min-width: 120px;
    border-radius: 20px;
    cursor: auto;
}

.hidden {
    display: none !important;
}

.content-ellipsis {
    display: -webkit-box;
    max-width: 320px;
    height: 16px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#pageloader {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 999999;
    /*background-image: url(/Assets/CustomTemplate/images/backgound.png);*/
    position: fixed; /* Sit on top of the page content */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(101, 101, 102, 0.10);
    /*background-color: rgba(6,6,6,0.5) !important;*/
    cursor: pointer; /* Add a pointer on hover */
}

#pageloader-modal {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 999999;
    /* background-image: url(/Assets/CustomTemplate/images/backgound.png); */
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* background-color: rgba(101, 101, 102, 0.21); */
    background-color: rgba(6,6,6,0) !important;
    cursor: pointer;
}

.bg-theme {
    background-color: #26ade3;
}

.loader-img {
    position: fixed;
    bottom: 45%;
    left: 45%;
    margin: 0px;
    background-color: #fff;
    border-radius: 50%;
}

    .loader-img img {
        width: 150px;
        padding: 20px;
    }

.navbar-header .navbar-right {
    padding-right: 0px;
}

    .navbar-header .navbar-right .dropdown:last-child {
        margin-left: 0px;
    }


.text-smart {
    color: #26ade3;
}

.fa-green {
    color: #6ba26d;
}

.fa-red {
    color: #dc3545;
}

select {
    height: calc(1.4em + 0.3375rem + 2px);
    padding: 0.20875rem 0.525rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #596882;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #c0ccda;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.dropdown-toggle-custom {
    padding: 0px;
    border: 0px;
    font-size: 16px;
}

    .dropdown-toggle-custom::after {
        display: inline-block;
        margin-left: 0.255em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0em solid;
        border-right: 0em solid transparent;
        border-bottom: 0;
        border-left: 0em solid transparent;
    }

.navbar-menu .nav-item.with-sub .nav-link::after {
    margin-left: 10px;
    margin-top: -5px;
}

.btn-outline-light:hover, .btn-outline-light:focus, .btn-outline-light:active {
    background-color: transparent;
    border-color: transparent;
}

.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle {
    background-color: transparent;
    border-color: transparent;
}

    .btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus {
        box-shadow: 0 0 0 0rem rgba(244, 245, 248, 0.5);
    }

.card-custom {
    border: 1px solid rgba(72, 94, 144, 0.16) !important;
    box-shadow: none !important;
}

label {
    margin-bottom: 0.25rem;
    font-weight: 400;
    color: #1b2e4bb8;
}

    label.form-control {
        display: block;
        width: 100%;
        height: calc(1.25em + 0.9375rem + 0px);
        padding: 0.35875rem 0.625rem;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.5;
        color: #596882;
        background-color: #fff;
        background-clip: padding-box;
        border: 0px solid #c0ccda7d;
        border-radius: 0.25rem;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        background-color: #f4f4f4a1;
    }


.control-label-title {
    margin-bottom: 0rem;
}

.control-label-value {
    display: block;
    width: 100%;
    font-size: 0.875rem;
}

.modal-footer .control-label-value {
    margin-bottom: 0px;
}

.modal-footer .control-label-title {
    margin-bottom: 0rem;
    color: #333;
}

table.table-custom {
    border: 0px solid rgba(72, 94, 144, 0.16);
}

    table.table-custom.no-footer {
        border-bottom: 0px solid #111111;
    }

.input-validation-error {
    border-color: #dc3545;
    padding-right: calc(1.5em + 0.9375rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.23438rem) center;
    background-size: calc(0.75em + 0.46875rem) calc(0.75em + 0.46875rem);
    margin-bottom: 5px;
}

.mandatory {
    color: #dc3545;
    font-weight: bold;
}

.mobileApp {
    border: #8b94a5 40px solid;
    height: 600px;
    border-radius: 20px;
    border-bottom: #8b94a5 80px solid;
}

.mail-group-body {
    position: relative !important;
    top: 5px !important;
    left: 0;
    right: 0;
    bottom: 0;
}

.mail-wrapper {
    display: inline-flex;
    width: 100%;
    background-color: #fff;
}

.mail-group {
    width: 100vw;
    position: inherit !important;
    top: 0;
    left: 100vw;
    bottom: 0;
    transition: all 0.3s;
}

.mail-group {
    width: 100% !important;
    right: 0;
    left: 220px;
}

table.dataTable-nopadding tbody th, table.dataTable-nopadding tbody td {
    padding: 0px 0px;
}

.mail-sidebar-body {
    position: relative;
    height: auto !important;
}

table.dataTable-nopadding {
    border-left: 0px solid rgba(72, 94, 144, 0.16);
    border-right: 0px solid rgba(72, 94, 144, 0.16);
}

.mailIcon {
    border: thin solid #dedede;
    padding: 4px;
    border-radius: 7px;
}

/* The customcheck */
.customcheck {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    .customcheck input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    border-radius: 5px;
}


/* When the checkbox is checked, add a blue background */
.customcheck input:checked ~ .checkmark {
    border-radius: 5px;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.customcheck input:checked ~ .checkmark:after {
    display: block;
}

.customcheck input ~ .checkmark {
    display: none;
}

.customcheck input:checked ~ .checkmark {
    display: block;
    top: -6px;
    left: 38px;
}

.fa-custom-radio {
    font-size: 1.6em !important;
}

.form-control-ar {
    direction: rtl;
    text-align: right;
    font-family: 'GE SS Two Light',Gotham, sans-serif !important;
}

/* Style the checkmark/indicator */

.mobileContainer {
    height: 675px;
    border: solid 30px #1C2654;
    max-width: 410px;
    border-radius: 20px;
    border-bottom: solid 60px #1C2654;
}

.mobilePanel {
    background-color: #efefef;
    width: 100%;
    height: 100%;
}

.mobileFrame {
    width: 100%;
    height: 98%;
    border: 0px;
}

.desktopFrame {
    width: 100%;
    height: 98%;
    border: 0px;
}

.btn-mobile-close {
    color: #003399;
    margin-top: 10px;
    margin-right: 10px;
}

.btn-mobile-close-main {
    width: 40px;
    height: 40px;
    background-color: deepskyblue !important;
    border-radius: 50px;
    opacity: 1;
    position: absolute;
    margin-left: -10px;
}

#MobileView .modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 0.0rem;
    height: 80vh;
}

#DesktopView .modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 0.0rem;
    height: 80vh;
}



.desktopContainerNew {
    height: 600px;
    overflow: auto;
}

.model-desktop {
    max-width: 600px;
}

.btn-mobile-close {
    color: #003399;
    margin-top: 10px;
    margin-right: 10px;
}

#DesktopView .modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 0.0rem;
}


input[type="file" i] {
    height: auto !important;
}

.btn-theme1 {
    color: #26ade3;
}

.btn-theme2 {
    color: #3b4863;
}

    .btn-theme2:hover {
        color: #fff;
    }

.btn-theme3 {
    color: #26ade3;
}

.formHint {
    color: #999;
}

.input-form-footer .control-label {
    color: #aaa;
    line-height: 1.2;
}

#FormLastModified .form-lable {
    font-size: 0.85rem;
    color: #aeb2b8;
}

.form-lable {
    font-weight: 400;
    color: #1b2e4bb8;
}

.actionButton {
    width: 10px;
}

/**:focus {
    outline:thin solid #ccc;
}*/

.toggle-control {
    display: block;
    position: relative;
    padding-left: 60px;
    margin-bottom: 35px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .toggle-control input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

        .toggle-control input:checked ~ .control {
            background-color: #0168fa;
        }

            .toggle-control input:checked ~ .control:after {
                left: 14px;
            }

    .toggle-control .control {
        position: absolute;
        top: 0;
        left: 0;
        height: 16px;
        width: 28px;
        border-radius: 15px;
        background-color: darkgray;
        -webkit-transition: background-color 0.15s ease-in;
        transition: background-color 0.15s ease-in;
    }

        .toggle-control .control:after {
            content: "";
            position: absolute;
            left: 2px;
            top: 0.1rem;
            width: 12px;
            height: 12px;
            border-radius: 15px;
            background: white;
            -webkit-transition: left 0.15s ease-in;
            transition: left 0.15s ease-in;
        }

#editor .ql-editor {
    font-family: GOTHAM;
}

#ContentEditorArabic .ql-editor {
    text-align: right;
    font-family: GESS;
}

table.dataTable.no-footer {
    border-bottom: 0px solid #111111;
}

.limitContent {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 75ch;
}

.card-loaders {
    position: absolute;
    margin: auto;
    right: 2%;
    top: 2%;
}

.OrganizationLogo {
    max-width: 130px;
}

#CommentView .modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 0.0rem;
}

#CommentView .modal-content {
    border-color: #1C2654;
    border-radius: 1.25rem;
    background-color: #1C2654;
}

.btn-more-info {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 100;
    border: 0px;
    background-color: transparent;
}

.validation-summary-errors ul {
    padding-left: 0px;
    list-style: none;
}

.template-panel .card:hover {
    background-color: aliceblue;
    border: solid thin #0168fa;
}

#CustomColumns .form-control {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top: 0px;
}

.nav-item-ar {
    position: absolute;
    right: 5px;
}

.dropdown-menu-right {
    left: auto;
}

.Editor-editor {
    padding: 10px 10px 15px 10px !important;
    min-height: 35px;
}

.btn-uppercase.btn-vsm, .btn-group-vsm > .btn-uppercase.btn, .sp-container .btn-group-sm > button.btn-uppercase, .ui-datepicker-buttonpane button.btn-uppercase {
    font-size: 10px;
    line-height: 1.773;
}

.modal-standard {
    max-width: 700px;
}

.modal-standard-large {
    max-width: 900px;
}
.modal-standard-XtraLarge {
    max-width: 90%;
}

/* SCROLLER CONTAINERS */
.container-scroller {
    border-radius: 12px;
    padding: 10px 15px;
    max-height: 365px
}

.container-scrollers {
    max-height: 365px
}
/* SCROLLER CONTAINERS */


/* RADIO BUTTONS*/
.radio {
    margin: 0.5rem;
    margin-bottom: 0rem;
}

    .radio input[type=radio] {
        position: absolute;
        opacity: 0;
        width: auto;
    }

        .radio input[type=radio] + .radio-label:before {
            content: "";
            background: #f4f4f4;
            border-radius: 100%;
            border: 1px solid #b4b4b4;
            display: inline-block;
            width: 1.4em;
            height: 1.4em;
            margin-right: 0.65em;
            vertical-align: top;
            cursor: pointer !important;
            text-align: center;
            transition: all 250ms ease;
        }

        .radio input[type=radio]:checked + .radio-label:before {
            background-color: #3197EE;
            box-shadow: inset 0 0 0 4px #f4f4f4;
        }

        .radio input[type=radio]:focus + .radio-label:before {
            outline: none;
            border-color: #3197EE;
        }

        .radio input[type=radio]:disabled + .radio-label:before {
            box-shadow: inset 0 0 0 4px #f4f4f4;
            border-color: #b4b4b4;
            background: #b4b4b4;
        }

        .radio input[type=radio] + .radio-label:empty:before {
            margin-right: 0;
        }

/* RADIO BUTTONS END*/

/* CONFIRM BOX */

.jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-content {
    text-align: center;
    color: #777;
    margin-bottom: 20px;
    font-weight: 400;
}

/* CONFIRM BOX END */


/* TABLE CUSTOMIZATIONS */
table.dataTable tbody th.actionButton, table.dataTable tbody td.actionButton {
    padding: 8px 0px !important;
    text-align: center;
}

table.dataTable tbody th.statusCell, table.dataTable tbody td.statusCell {
    width: 130px;
}

table.dataTable tbody th.modifiedCell, table.dataTable tbody td.modifiedCell {
    width: 170px;
}
/* TABLE CUSTOMIZATIONS */


.status-container {
    position: absolute;
    right: 15px;
}

/*ul li.activity-item:nth-last-child(3)::before {
    border-left: 0px dotted #c0ccda !important;
}*/

.nav-label > a {
    color: #555555;
    text-decoration: none;
}

.view-placeholder {
    background-color: aliceblue !important;
    padding: 7px 10px;
    border-radius: 5px;
    color: #1b2e4b;
}

textarea.form-control {
    min-height: 38px;
}

.card-header-min {
    padding: 10px 15px !important;
}

.alert-container {
    display: flex;
}

.alert {
    padding: 12px 10px;
}

/*.alert-success {
    color: #345837;
    background-color: #dff6dd;
    border-color: #dff6dd;
}*/

.alert-success {
    color: #001737;
    background-color: #fff;
    border-color: #fff;
    box-shadow: 0 0 25px rgb(26 108 225 / 10%);
    border-left: solid 5px #6ba26d;
}

/*.alert-danger {
    color: #721c24;
    background-color: #fce9eb;
    border-color: #fce9eb;
}*/

.alert-success {
    color: #001737;
    background-color: #fff;
    box-shadow: 0 0 25px rgb(26 108 225 / 10%);
    border-left: solid 5px #6ba26d !important;
    border-color: rgb(26 108 225 / 10%);
}

.alert-danger {
    color: #001737;
    background-color: #fff;
    box-shadow: 0 0 25px rgb(26 108 225 / 10%);
    border-left: solid 5px #dc3545 !important;
    border-color: rgb(26 108 225 / 10%);
}

/*input[type=file]::-webkit-file-upload-button {
    border: 1px solid #26ade3;
    padding: .2em .6em;
    border-radius: .2em;
    background-color: #26ade3;
    transition: 1s;
    color: #fff;
    font-size: 14px;
}

input[type=file]::file-selector-button {
    border: 2px solid #26ade3;
    padding: .2em .4em;
    border-radius: .2em;
    background-color: #26ade3;
    transition: 1s;
}*/

.linkButton {
    border: 0px;
    background-color: transparent;
    color: #0168fa;
    outline: none;
}

    .linkButton:focus {
        outline: 0 !important;
    }

.card-loaders-1 {
    position: absolute;
    margin: auto;
    right: 2%;
    top: 0%;
}

.bg-theme-A, .bg-theme-B, .bg-theme-C {
    color: #aaa;
    background-color: #ffffff;
    border: solid thin #aaa;
}


/*.bg-theme-A {
    color: #dc3545;
    background-color: #ffffff;
    border: solid thin #dc3545;
}

.bg-theme-B {
    color: #ffab00;
    background-color: #ffffff;
    border: solid thin #ffab00;
}

.bg-theme-C {
    color: #0052cc;
    background-color: #ffffff;
    border: solid thin #0052cc;
}*/

.treegrid-indent {
    width: 0px;
    height: 16px;
    display: inline-block;
    position: relative;
}

.treegrid-expander {
    width: 3px;
    /* height: 12px; */
    display: inline-block;
    position: relative;
    left: -20px;
    cursor: pointer;
    top: 3px;
    margin-left: 10px;
}



table.dataTable tbody th.actionButton, table.dataTable tbody td.actionButton {
    padding: 5px 5px !important;
    text-align: center;
}


table.dataTable tbody th.modifiedCell, table.dataTable tbody td.modifiedCell {
    max-width: 220px;
}

#searchPanel label.form-lable {
    font-size: 10pt;
}

.bd-info-f {
    border-color: #00b8d4 !important;
}

.bd-danger-f {
    border-color: #dc3545 !important;
}

.bd-gray-700-f {
    border-color: #596882;
}

.bd-gray-400-f {
    border-color: #b4bdce;
}

/*.badge-success {
    color: #383;
    background-color: #fff;
    border: thin solid #383;
    border-radius: 0px;
}*/

.badge-success {
    color: #5ba787;
    background-color: #51ce9938;
    border-radius: 5px;
}

/*.badge-danger {
    color: #dc3545;
    border: thin solid #dc3545;
    background-color: #fff;
    border-radius: 0px;
}*/

.badge-danger {
    color: #dc3545;
    /* border: thin solid #dc3545; */
    background-color: #dc354526;
    border-radius: 4px;
}

.buttons-copy {
    border: 1px solid rgba(72, 94, 144, 0.16);
}


.buttons-print {
    border: 1px solid rgba(72, 94, 144, 0.16);
}


.buttons-csv {
    border: 1px solid rgba(72, 94, 144, 0.16);
}

table.table-vertical tbody th, table.table-vertical tbody td {
    vertical-align: inherit;
}

.custom-switch-container {
    /*background-color: #f5f7f8;*/
    background-color: aliceblue;
    padding: 5px;
    border-radius: 20px;
    padding-left: 10px;
    width: fit-content;
    padding-right: 15px;
    color: #333;
}

.breadcrumb-style1 {
    margin-bottom: 10px;
}

.page-header {

}

section {
    padding: 20px;
}

.page-title {
    /*margin-top: 1rem;*/
    margin-bottom: 0.15rem;
    font-weight: 500;
    line-height: 1.25;
    color: #001737;
    font-size: 1.12rem;
    letter-spacing: -0.5px;
}

.page-description {
    color: #666;
    font-size: 0.875rem;
}


.bg-yellow {
    background-color: #edd52a
}

.btn-custom {
    color: #1C2654;
    border-color: #1C2654;
}

    .btn-custom:hover {
        color: #fff;
        background-color: #1C2654;
        border-color: #1C2654;
    }

    .btn-custom:focus, .btn-custom.focus {
        box-shadow: 0 0 0 0.2rem rgba(59, 72, 99, 0.5);
    }

    .btn-custom.disabled, .btn-custom:disabled {
        color: #1C2654;
        background-color: transparent;
    }

    .btn-custom:not(:disabled):not(.disabled):active, .btn-custom:not(:disabled):not(.disabled).active,
    .show > .btn-custom.dropdown-toggle {
        color: #fff;
        background-color: #1C2654;
        border-color: #1C2654;
    }

        .btn-custom:not(:disabled):not(.disabled):active:focus, .btn-custom:not(:disabled):not(.disabled).active:focus,
        .show > .btn-custom.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(59, 72, 99, 0.5);
        }


.state-label {
    border-color: transparent;
    min-width: 100px;
    border-radius: 15px;
    display: inline-block;
    font-weight: 500;
    text-align: center;
    user-select: none;
    border: 1px solid transparent;
    padding: 0.2rem 0.5rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    text-transform: uppercase;
    font-size: 0.60rem;
    margin-top: auto;
    margin-bottom: auto;
}

.state-label-xs {
    /*margin-top: auto;*/
}

    .state-label-xs .state-label {
        min-width: 75px !important;
        height: 18px;
        padding: 0.1rem 0.3rem !important;
        margin-top: auto;
        margin-bottom: auto;
    }

    .state-label-xs .state-label {
        min-width: 110px;
        padding: 0.15rem 0.3rem;
        font-size: 10px;
    }

.state-label-xss {
    min-width: 85px;
    padding: 0.20rem 0.35rem;
    font-size: 10px;
}

.state-label-sm {
    min-width: 80px;
    padding: 0.1rem 0.5rem;
}

.state-label-md {
    min-width: 135px;
}

.state-pink {
    color: #ffffff;
    background-color: #f10075b0;
}

.state-label-large {
    min-width: 180px;
    white-space: nowrap;
}

.state-success {
    color: #10b759;
    /*background-color: rgba(16, 183, 89, 0.18);*/
    border: thin solid #10b759;
    background-color: #ffffff;
}

.state-danger, .state-High {
    color: #dc3545;
    border: thin solid #dc3545;
    background-color: #fff;
}

.state-hold {
    color: #ffab00;
    border: thin solid #ffab00;
    background-color: #fff;
}


.state-outline-success {
    color: #10b759;
    /*background-color: rgba(16, 183, 89, 0.18);*/
    border: thin solid #10b759;
}

.state-info {
    color: #0168fa;
    /*background-color: rgba(1, 104, 250, 0.15);*/
    border: thin solid #0168fa;
    background-color: #ffffff;
}

.state-outline-info {
    color: #0168fa;
    border: thin solid #0168fa;
}

.state-warning, .state-Medium {
    color: #fd7e14;
    /*background-color: rgb(253 126 20 / 18%)*/;
    border: thin solid #fd7e14;
    background-color: #ffffff;
}

.state-outline-danger {
    color: #f10075;
    border: thin solid #f10075;
}

.state-dark {
    color: #fff;
    background-color: #31b0d5;
}

.state-secondary {
    color: #383d41;
    background-color: #fff;
    border-color: #b5b7bb;
}

.state-disabled {
    color: #b5b7bb;
    background-color: #fff;
    border-color: #b5b7bb;
}

.tx-dark {
    color: #383d41;
}

.bg-message-light {
    background-color: #e2e3e5;
}


.state-shade, .state-Low {
    color: #888;
    border: thin solid #aaa;
    background-color: #ffffff;
}

.state-shade1 {
    color: #0168fa;
    /*background-color: #62c1e5*/;
    border: thin solid #0168fa;
    background-color: #ffffff;
}

.state-shade2 {
    color: #0168fa;
    /*background-color: #62c1e5*/;
    border: thin solid #0168fa;
    background-color: #ffffff;
}

.state-shade3 {
    color: #0168fa;
    /*background-color: #62c1e5*/;
    border: thin solid #0168fa;
    background-color: #ffffff;
}

.state-shade4 {
    color: #157aa1;
    /*background-color: #62c1e5*/;
    border: thin solid #157aa1;
    background-color: #ffffff;
}

.state-shade5 {
    color: #ffffff;
    background-color: #157aa1;
}

.state-shade6 {
    color: #ffffff;
    background-color: #e58030;
}

.state-shade7 {
    color: #ffffff;
    background-color: #00997d;
}

.state-shade8 {
    color: #ffffff;
    background-color: #e378a6;
}



.bg-High {
    background-color: #dc3545 !important;
}

.bd-High {
    border-color: #dc3545 !important;
    font-weight: 600;
    color: #dc3545;
}

.bg-Medium {
    background-color: #ffc107 !important;
}

.bd-Medium {
    border-color: #ffc107 !important;
    font-weight: 600;
    color: #ffc107;
}

.bg-Low {
    background-color: #10b759 !important;
}

.bd-Low {
    border-color: #10b759 !important;
    font-weight: 600;
    color: #10b759;
}

.panelContainer {
    background-color: aliceblue;
    padding: 10px 15px 5px;
    margin-bottom: 15px;
}

.wizard > .steps > ul li + li {
    margin-left: 30px !important;
}

    .wizard > .steps > ul li + li::before {
        left: -20px !important;
    }

.size-18 {
    width: 18px !important;
    height: 18px !important;
}

.mn-wd-40-f {
    min-width: 40px !important;
}

.mn-ht-40-f {
    min-height: 40px !important;
}

.error {
    color: #dc3545;
    margin-top: 0px;
}

.spinner-border-md {
    width: 1.5rem !important;
    height: 1.5rem !important;
}

.dot {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    margin-left: 5px;
}

.dot {
    height: 25px;
    width: 25px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}

.dot-sm {
    height: 20px !important;
    width: 20px !important;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}

.dot-xs {
    height: 15px !important;
    width: 15px !important;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}

.dot-success {
    background-color: #93d05ab5 !important;
}

.dot-warning {
    background-color: #ffc02cb5 !important;
}

.dot-danger {
    background-color: #fe0f0fa8 !important;
}

.dot-phasechange {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    display: inline-block;
    margin-top: 4px;
}

#panelSearch {
    background-color: rgba(26, 108, 225, 0.05);
    padding: 15px;
}


table.dataTable tbody th, table.dataTable tbody td {
    padding: 5px 6px;
}


.top-nav-links:hover {
    color: #333;
}

.list-group-item-active {
    background-color: aliceblue;
}

.form-control-xs {
    height: calc(1.0em + 0.782rem + 2px);
    padding: 0.391rem 0.5rem;
    font-size: 0.8125rem;
    line-height: 1.5;
    border-radius: 0.2rem;
}

.wd-16 {
    width: 16px;
}

.wd-17 {
    width: 17px;
}

.wd-18 {
    width: 18px;
}

.wd-19 {
    width: 19px;
}

.wd-21 {
    width: 21px;
}

.wd-21 {
    width: 21px;
}

.wd-22 {
    width: 22px;
}


.wd-23 {
    width: 23px;
}

.wd-24 {
    width: 24px;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 8px 7px;
}

.bg-green {
    background-color: #10b759;
}

.bg-green-light {
    background-color: #10b75933;
}

.bg-yellow {
    background-color: #edd52a
}

.bg-red {
    background-color: #FF0909;
}

.bg-red-light {
    background-color: #ff090969;
}

.select2-container--default .select2-selection--single {
    height: 32px;
}

.custom-checkbox .custom-control-label::before, .custom-checkbox .custom-control-label::after, .custom-radio .custom-control-label::before, .custom-radio .custom-control-label::after, .custom-switch .custom-control-label::before, .custom-switch .custom-control-label::after {
    top: 55%;
    transform: translateY(-50%);
}

select.error {
    border: 1px solid #cc0000;
}

input.error {
    border: 1px solid #cc0000;
}

/*label.error {
    display:none !important;
}*/

table.dataTable tbody tr.inactive {
    text-decoration: line-through;
}

.nav-icons {
    stroke-width: 1.25px;
}



.linkNew {
    width: 20px;
    /*margin-right: 3px;*/
    margin-top: -2px;
    stroke-width: 1.5px;
}

.pageTitleHint {
    font-size: 14px;
    color: #8392a5;
    margin-top: 2px;
}

.table-filter .dataTables_filter {
    display: none;
}




.progress-bar-round {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: radial-gradient(closest-side, white 0%, transparent 0% 100%), conic-gradient(hotpink 40%, pink 0);
    margin-right: 10px;
    margin-left: auto;
}

.badge-pill-round {
    padding: 8px 8px 0px 8px;
    border-radius: 10px;
    min-width: fit-content;
    border-radius: 50%;
    vertical-align: middle;
}


.spinner-border-md-ali {
    width: 3.5rem !important;
    height: 3.5rem !important;
}

.card-loaders-ali {
    position: absolute;
    margin: auto;
    right: 45%;
    top: 40%;
}


.filter-toggle-panel-gray {
    background-color: #efefef;
    padding: 5px 5px 5px 10px;
    border-radius: 20px;
}

.stroke-width-1 {
    stroke-width: 1;
}

.stroke-width-1-5 {
    stroke-width: 1.5px;
}

.stroke-width-2 {
    stroke-width: 2;
}

.mg-t-minus-3 {
    margin-top: -3px;
}

.mg-t-minus-5 {
    margin-top: -5px;
}

.alert-application {
    z-index: 10000;
    width: 100%;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    position: absolute;
    padding: 10px;
    background-color: #fce9eb;
}

.btnAction {
    color: #777;
    stroke-width: 1.25px;
    height: auto;
}

.text-truncate-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.text-truncate-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.text-truncate-4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tx-small {
    font-size: 0.85rem;
}

.table tbody tr.group {
    background-color: aliceblue;
    font-weight: 500;
}

.tx-truncate-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tx-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tx-truncate-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tx-truncate-4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}



@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
    .page-header-panel {
        display: block;
        align-items: center;
        justify-content: space-between;
    }

    .loader-img {
        position: fixed;
        bottom: 55% !important;
        left: 35% !important;
        margin: 0px;
    }

        .loader-img img {
            width: 110px !important;
        }
}


@keyframes click-wave {
    0% {
        height: 20px;
        width: 20px;
        opacity: 0.15;
        position: relative;
    }

    100% {
        height: 200px;
        width: 200px;
        margin-left: -80px;
        margin-top: -80px;
        opacity: 0;
    }
}

input[type="checkbox"].option-input {
    border-radius: 50% !important;
}

.option-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    position: relative;
    right: 0;
    bottom: 0;
    left: 0;
    height: 20px;
    width: 20px;
    transition: all 0.15s ease-out 0s;
    background: #cbd1d8;
    border: none;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    outline: none;
    position: relative;
    z-index: 1000;
}

    .option-input:checked {
        border-radius: 50%;
    }

    .option-input:hover {
        background: #9faab7;
    }

    .option-input:checked {
        background: #E91E63;
    }

        .option-input:checked::before {
            height: 20px;
            width: 20px;
            position: absolute;
            content: "\f111";
            font-family: "Font Awesome 5 Free";
            display: inline-block;
            font-size: 16.66667px;
            text-align: center;
            line-height: 20px;
        }

        .option-input:checked::after {
            background: #E91E63;
            content: '';
            display: block;
            position: relative;
            z-index: 100;
        }

    .option-input.radio {
        border-radius: 50%;
    }

        .option-input.radio::after {
            border-radius: 50%;
        }


/* SCROLL BAR*/

*::-webkit-scrollbar {
    height: 6px;
    width: 6px;
}

*::-webkit-scrollbar-track {
    border-radius: 4px;
    background-color: #DFE9EB;
}

*::-webkit-scrollbar-track:hover {
    background-color: #B8C0C2;
}

*::-webkit-scrollbar-track:active {
    background-color: #B8C0C2;
}

*::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #019AC6;
}

*::-webkit-scrollbar-thumb:hover {
    background-color: #019AC6;
}

*::-webkit-scrollbar-thumb:active {
    background-color: #019AC6;
}

#ProfileDisplay {
    object-fit: contain;
    border-radius: 50%;
}