{literal}
@import "css/reset.css";
@import "css/navigation.css";
@import "css/elements.css";
@import "css/bootstrap.min.css";
/* @import "css/global_BACKUP.css"; */

html {
    font-size: 14px;
    /* Reserve scrollbar gutter so Bootstrap modals don't compensate
       with a body padding-right shift on open (causes a 2-5px jump). */
    scrollbar-gutter: stable;
}

body {
    margin: 0;
    padding: 0;
    background: #e2e3e6;
    line-height: normal;
	color: #181c2e;
	font-weight: 400;
    letter-spacing: normal;
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 14px;
}
div.content {
        flex: 1;
        background-color: #fff;
        padding: 25px 30px;
        /* box-shadow: -4px 0 11px -5px rgba(0, 0, 0, 0.3); */
    }

.btn-orange {
    background-color: #f58420;
    color: #fff;
}
.btn-orange:hover, .btn-orange:active {
    color: #fff !important;
    background-color: #bb6418 !important;
}

body a.btn-outline-secondary {
    color: #515151;
}
body a.btn-outline-secondary:visited {
    color: #515151;
}
body a.btn-outline-secondary:hover, .btn-outline-secondary:hover i {
    color: #fff !important;
}
body .btn i {
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

/* Login page
------------------------------ */

.login .site-container {
    max-width: 530px;
    background-image: none;
    padding-left: 15px;
    padding-right: 15px;
}


.site-container {
    max-width: 1728px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (max-width: 991px) {
    .site-container {
        max-width: none;
        width: 100%;
    }
}

.site-header {
    display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding: 13px 23px 0 13px;
}
.site-header .site-logo {
    margin: 0 30px 6px 0;
}
.site-header .row-top {
    margin-bottom: 22px;
}
.index_notifications {
    font-size: 15px;
    display: flex;
    align-items: center;
}
.index_notifications a {
    color: #515151 !important;
    display: flex;
    align-items: center;
}
.index_notifications a svg {
    fill: #077efe;
    max-width: 20px;
    max-height: 20px;
    margin-right: 11px;
}
.index_notifications .sep {
    margin: 0 15px;
}
.nav-user {
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-end;
}
.nav-user li + li {
    margin-left: 5px;
}   
.nav-user li a {
    display: inline-block;
    text-decoration: none !important;
    color: #fff;
    background-color: #7a8a99;
    font-size: 13px;
    line-height: normal;
    padding: 7px 28px 11px;
    border-top: 5px solid #8997a4;
    border-radius: 5px 5px 0 0;
}
.nav-user li a:hover {
    border-color: #bdc5cc;
}
.nav-user li.active a {
    background-color: #097efe;
    border-color: #3b99ff;
}
a {
    transition: all 0.2s;
}
a:link {
    color: #0d519a;
}

a:visited {
    color: #0d519a;
}

a:hover,
a:active {
    color: #0d519a;
    text-decoration: none;
}
.page-title {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    flex-wrap: wrap;

    margin: .4em 0 1em;
    border-bottom: 2px solid #007bff;
    overflow: hidden;
    padding-bottom: 8px;
}
.page-title h1, .page-title h2, .page-title h3 {
    margin-bottom: 0;
}
.alert {
    font-size: 1.071em;
}
.alert a {
    color: inherit;
}
h1 {
    margin: 0 0 .6em;
    font-size: 1.43em;
    color: #000;
    font-weight: 700;
    line-height: 1.4;
}

h2 {
    margin: 0 0 1.2em;
    font-size: 1.143em;
    color: #000;
    font-weight: 700;
    line-height: 1.75;
}

h3 {
    margin: 0 0 1.2em;
    font-size: 1em;
    font-weight: 700;
    color: #181c2e;
    line-height: normal;
}

p {
    margin: 0 0 1em;
}

.header-banner {
    background-image: linear-gradient(to right, #004b7b 0%, #002445);
    text-align: center;
    padding: 10px 10px 11px;
    color: #ccf0ff;
    font-weight: 700;
    font-size: 16px;
    line-height: normal;
    letter-spacing: normal;
    min-height: 40px;
}
.header-banner a {
    white-space: nowrap;
    color: inherit;
}
.header-banner a:hover {
    color: #fff;
}
.header-banner span {
    color: #2ed051;
}
@media (max-width: 991px) {
    .header-coupon-section,
    .header-banner {
        font-size: 14px;
    }
}
@media (max-width: 991px) {
    .header-banner {
        margin-top: 40px;
        margin-bottom: -40px;
    }
    .header-coupon-section {
        margin-top: 40px;
        margin-bottom: -40px;
    }

}

.header-coupon-section {
    min-height: 40px;
    background-color: #d0011c;
    text-align: center;
}
.header-coupon-link {
    padding: 10px;
    display: block;
    text-decoration: none;
    color: #fff !important;
}
.header-coupon-link u {
    font-weight: 700;
}

.sidebar ul {
    padding: 0;
    margin: 0;
}
.sidebar ul li {
    margin-bottom: 1px;
}
.sidebar ul li a {
    display: block;
    text-decoration: none;
    font-size: 13px;
    color: #181c2e;
    background-color: #c6cfd8;
    padding: 11px 11px 11px 8px;
    border-left: 4px solid #d4dce5;
}
.sidebar ul li a i {
    margin-right: 5px;
}
.sidebar ul li a:hover,
.sidebar ul li.active a {
    background-color: #e9eef4;
    border-color: #f2f6fb;
}
.custom-radio, .custom-radio-icon {
    position: relative;
    height: 100%;
}

.custom-radio input[type="radio"], .custom-radio-icon input[type="radio"] {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
}
.custom-radio label, .custom-radio-icon label {
    display: block;
    padding: 16px 15px 16px 60px;
    border-radius: 4px;
    border: solid 1px #bdbdbd;
    cursor: pointer;
    position: relative;
    color: #000;
    font-size: 14px;
    transition: all 0.2s;
    height: 100%;
}
.custom-radio-icon label {
    padding: 25px 20px 15px;
    text-align: center;
}
.custom-radio-icon label > * {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.custom-radio-icon label > * + * {
    margin-top: 11px;
}
.custom-radio-icon label i {
    font-size: 42px !important;
}
.custom-radio label:hover, .custom-radio-icon label:hover {
    border-color: #007bff;
}
.custom-radio label:before, .custom-radio-icon label:before {
    content: '';
    position: absolute;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    top: 11px;
    left: 20px;
    background-color: #e2e3e6;
    transition: all 0.2s;
}
.custom-radio-icon label:before {
    top: 15px;
    left: auto;
    right: 20px;
}
.custom-radio label:after, .custom-radio-icon label:after {
    content: '';
    position: absolute;
    width: 8px;
    height: 12px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);
    left: 29px;
    top: 17px;
    opacity: 0;
    transition: all 0.2s;
}
.custom-radio-icon label:after {
    left: auto;
    right: 29px;
    top: 21px;
}
.custom-radio input:checked + label, .custom-radio-icon input:checked + label {
    border-color: #dad8bb;
    background-color: #fffde5;
}
.custom-radio-icon input:checked + label .title {
    font-weight: 700;
}
.custom-radio input:checked + label:before, .custom-radio-icon input:checked + label:before {
    background-color: #28a745;
}
.custom-radio input:checked + label:after, .custom-radio-icon input:checked + label:after {
    opacity: 1;
}
.custom-radio-icon label a {
    margin: 0;
    display: inline-block;
}
.custom-progress {
    position: relative;
    padding: 18px 0 45px;
}
.custom-progress .custom-progress-bar {
    height: 2px;
    background-color: #bdbdbd;
    position: relative;
}
.custom-progress .custom-progress-bar.progress-bar-active:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 2px;
    background-color: #28a745;
}
.custom-progress .custom-progress-bar.progress-bar-active.progress-step-1:before {
    width: 19%;
}
.custom-progress .custom-progress-bar.progress-bar-active.progress-step-2:before {
    width: 37.5%;
}
.custom-progress .custom-progress-bar.progress-bar-active.progress-step-3:before {
    width: 60%;
}
.custom-progress .custom-progress-bar.progress-bar-active.progress-step-4:before {
    width: 81%;
}
.custom-progress .custom-progress-bar.progress-bar-active.progress-step-complete:before {
    width: 100%;
}
.custom-progress .step {
    position: absolute;
    text-align: center;
    top: 0;
}
.custom-progress .step-1 {
    left: 15%;
} 
.custom-progress .step-2 {
    left: 37.5%;
    transform: translateX(-37.5%);
}
.custom-progress .step-3 {
    left: 60%;
    transform: translateX(-60%);
}
.custom-progress .step-4 {
    right: 15%;
} 
.custom-progress .step a,
.custom-progress .step p {
    display: block;
    text-decoration: none;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: normal;
    color: #181c2e;
    position: relative;
    pointer-events: none;
}
.custom-progress .step.active a,
.custom-progress .step.active p {
    pointer-events: all;
    font-weight: 700;
}
.custom-progress .step a:hover .title {
    text-decoration: underline;
}
.custom-progress .step a .number,
.custom-progress .step p .number {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 5px solid #fff;
    background-color: #bdbdbd;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2px;
}
.custom-progress .step.active a .number,
.custom-progress .step.active p .number {
    background-color: #000;
}

@media screen and (min-width: 768px) and (hover: hover) {
    .d-icon-on-hover {
        opacity: 0;
        text-decoration: none;
    }
    #ulf li:hover .d-icon-on-hover,
   table tr:hover .d-icon-on-hover
    {
        opacity: 1;
    }
}

.paging .page-link {
    font-size: 1em;
}
.paging strong.page-link {
    background-color: #6c757d;
    color: #fff;
    /* border-color: #6c757d !important; */
}

.footer {
    padding: 50px 0;
}
.footer p {
    margin: 0;
}

.green-color {
    color: #2ed051;
}

body .btn {
    border-radius: 4px;
    --bs-btn-padding-y: 0.82rem;
    --bs-btn-padding-x: 1.5rem;
}
body .btn-search {
    /* Padding hack + background-image icon removed — buttons render
       a real <i class="bi bi-search"> icon inline now. */
}

.sales-info-wrapper {
    display: flex;
    vertical-align: center;
    min-height: 40px;
    flex-wrap: wrap;
    background-color: #4a4a4a;
    padding: 5px 9px 7px 13px;
    margin: 20px 0 10px;
    color: #fff;
}
.sales-info-wrapper div {
    display: flex;
    align-items: center;
    margin-right: 20px;
}

body table thead {
    background-color: #f5f7fa;
}

body table thead th,
body table thead td {
    padding: 0.5rem;
    color: #667085;
    text-align: left;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid #dfe6ee;
    vertical-align: middle;
}

body table thead a {
    border-bottom: 0;
    color: inherit;
    text-decoration: none;
}

body table ul {
    margin: 0;
}
body table i.bi,
body .status_info i.bi,
body .content i.bi {
    font-size: 18px;
}
body .btn i.bi {
    font-size: inherit;
}
body .table>:not(caption)>*>* {
    padding: 0.6rem 0.5rem;
}

/*body table thead a img.sort {
    vertical-align: -.4em;
}*/

body .select2-container--default .select2-selection--single,
body .select2-container--default .select2-selection--multiple {
    border-color: #dee2e6;
    height: auto;
    border-radius: 5px;
}

body .select2-container .select2-selection--single .select2-selection__rendered,
body .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: .375rem 2.25rem .375rem .75rem;
    line-height: 1.5;
    color: var(--bs-body-color);
    display: block;
    min-height: 30px;
}
body .select2-container .select2-search--inline .select2-search__field {
    margin-top: 0;
}
body .select2-container--default.select2-container--focus .select2-selection--multiple, 
body .select2-dropdown {
    border-color: #dee2e6;   
}
body .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    width: 35px;
}
body .select2-container--default .select2-selection--single .select2-selection__arrow b {
    width: 8px;
    height: 8px;
    border: 1px solid transparent;
    border-right-color: #343a40;
    border-bottom-color: #343a40;
    margin: -2px 0 0 -4px;
    transform: rotate(45deg) translate(-50%, -50%);
}
body .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border: 1px solid transparent;
    border-left-color: #343a40;
    border-top-color: #343a40;
    margin: 2px 0 0 -4px;
}

body ::placeholder {
    color: #94a3b8 !important;
    opacity: 1;
}

.paging p {
    color: #AAA;
    font-size: 1.1em;
}

.paging p a,
.paging p span {
    margin-right: 1em;
    display: inline-block;
}

body .accordion-button {
    outline: 0 !important;
    box-shadow: none !important;
}
body .accordion-button i {
    position: relative;
    top: 1px;
}

body .form-inline-li {
    display: flex;
    align-items: center;
    gap: 10px;
}
#clearCredit {
    border: 0;
    background: none;
}
table i[data-bs-toggle] {
    position: relative;
    top: 2px;
}

body .nav-pills {
    padding-left: 12px;
    padding-right: 12px;
    border-bottom: 1px solid #097efe;
}
body .nav-pills .nav-item {
    margin-right: 2px;
}
body .nav-pills .nav-link {
    border-radius: 5px 5px 0 0;
    font-size: 13px;
    padding: 12px 30px;
    background-color: #fff;
    color: #077efe;
}
body .nav-pills .nav-link:hover {
    background-color: #cce5ff;
}
body .nav-pills .nav-link.active, body .nav-pills .show>.nav-link {
    background-color: #097efe;
}

body .tab-content {
    padding: 0px 0px 0 0px;
}

.commentsUL {
    padding-left: 0;
    max-height: 484px;
    overflow-y: scroll;
}
.commentsUL::-webkit-scrollbar {
            -webkit-appearance: none;
            width: 6px;
            background-color: #d8d8d8;
            border-radius: 3px;
}

.commentsUL::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background-color: #000;
}
.commentsLI span {
    font-size: 11px;
    color: #6c757d;
}
.commentsLI .commentsText {
    font-size: 14px;
    color: #464646;
}
.btn.small {
    font-size: .875em;
    padding: 7px 12px;
}
.icons-column {
    min-width: 120px;
}

.paging ul.pagination {
    display: flex;
    flex-wrap: wrap;
}

#ulf > li {
    padding: 5px;
    border: 1px solid #c4c8cb;
/*    border-left: 0;*/
/*    border-right: 0;*/
/*    display: flex;*/
    align-items: flex-start;
    position: relative;
    /*background-color: red;*/
}

#ulf > li a.accardeon {
    display: inline-block;
    width: calc(100% - 50px);
    padding-left: 10px;
    text-decoration: none;
    padding-top: 10px;
    padding-bottom: 8px;
    color: inherit;
}
#ulf > li + li {
    margin-top: -1px;
}
#ulf > li .actions {
    position: absolute;
    float: none !important;
    top: 12px;
    right: 23px;
}
#ulf li > i {
    position: absolute;
    top: 16px;
    right: 7px;
    font-size: 10px;
}
#ulf > li .answer {
    padding: 10px;
}

.answer ul {
    list-style: disc !important;
    margin-bottom: 1em;
    line-height: 1.5;
}
.answer ol {
    list-style: auto;
    margin-bottom: 1em;
    line-height: 1.5;
}

.custom-orange {
    color: #F58420;
}

{/literal}
