﻿/*Accessibility: Colours*/
body {
    color: #464646;
}

.text-megna {
    color: #008271 !important;
}

.text-underline {
    text-decoration: underline !important;
}

.text-secondary {
    color: #475561 !important;
}

.footer {
    padding-right: 120px !important;
}

a {
    text-decoration: none;
}

.card {
    --bs-card-spacer-y: 1.25rem;
    --bs-card-spacer-x: 1.25rem;
}
input[type=button].btn-block, input[type=reset].btn-block, input[type=submit].btn-block {
    width: 100%;
}
.small, small {
    font-size: .8em;
}
.btn-block {
    display: block;
    width: 100%;
}

.btn-block+.btn-block {
    margin-top: .5rem;
}

/**Overrride placeholder colours */
/*::placeholder {*/ /* Chrome, Firefox, Opera, Safari 10.1+ */
    /*color: #E0E0E0 !important;
    opacity: 1 !important;*/ /* Firefox */
/*}
:-ms-input-placeholder {*/ /* Internet Explorer 10-11 */
    /*color: #E0E0E0 !important;
}

::-ms-input-placeholder {*/ /* Microsoft Edge */
    /*color: #E0E0E0 !important;
}*/

.bi-20px.bi-set, .bi-20px.bi:before {
    font-size: 20px
}

.bi-24px.bi-set, .bi-24px.bi:before {
    font-size: 24px
}

.bi-36px.bi-set, .bi-36px.bi:before {
    font-size: 36px
}

.bi-48px.bi-set, .bi-48px.bi:before {
    font-size: 48px
}

.sidebar-nav > ul {
    padding: 0px;
}

.customvtab .tabs-vertical li .nav-link.active, .customvtab .tabs-vertical li .nav-link:hover, .customvtab .tabs-vertical li .nav-link:focus {
    border-right: 2px solid #006323;
    color: #006323;
    font-weight: 400;
}

.topbar ul.dropdown-user {
    min-width: 320px;
}

@media(max-width: 375px){
    .topbar ul.dropdown-user {
        min-width: 320px;
        width: 100%;
    }
}

@media(min-width: 376px) and (max-width:766px) {
    /* Keep it box design */
    .topbar .top-navbar .navbar-nav > .nav-item.show .dropdown-menu {
        width: inherit;
    }
}

/* Change Auto-complete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    transition: background-color 50000s ease-in-out 0s !important;
    border-bottom: 1px #d9d9d9 solid !important;
}

.form-select {
    padding: .375rem 1.75rem .375rem .75rem !important;
    height: calc(1.5em + .75rem + 2px);
}

.form-select.custom-style {
    border-color: #6e7780;
    font-size: 14px;
    min-height: 37px;
}
.form-select.custom-style:hover {
    background-color: #727b84;
    background-image: url(../images/custom-select-white.png);
    opacity: 0.7;
    border: 1px solid #2f3d4a;
    color: #FFF;
}
.form-select.custom-style:focus {
    background-color: #727b84;
    background-image: url(../images/custom-select-white.png);
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #ffffff;
}

#loginform option {
    color: #343a40;
}

.login-bg-image {
    background-image: url(../images/login-register.jpg);
}

.txt-ellipsis-300 {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.cd-horizontal-timeline {
    margin-top: 0;
    margin-bottom: 0;
}

.cd-horizontal-timeline .events-content {
    margin-top: 0;
    margin-bottom: 0;
}

/* iPad & above all(768px) */
.topbar {
    position: fixed !important;
    width: 100% !important;
}

/* Fixed padding down, always, to push from top NavBar */
.page-wrapper {
    padding-top: 70px;
}

.b-t-l-r-0 {
    border-top-left-radius: 0px !important;
}

.b-t-r-r-0 {
    border-top-right-radius: 0px !important;
}

.b-t-l-r {
    border-top-left-radius: 4px !important;
}

.b-t-r-r {
    border-top-right-radius: 4px !important;
}

/* Fit the modal on the screen and add scrol to the modal-body only. */
#treeview_options.treeview ul.list-group li.list-group-item {
    padding: 8px 10px;
}

#treeview_selector_modal .modal-content {
    max-height: 90%;
    min-height: 40%;
}

#treeview_selector_modal .modal-dialog {
    height: 90%;
}

#treeview_selector_modal .modal-body {
    /*   max-height: calc(100% - 120px);*/
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}

.btn-success {
    color: #0C0C0C !important;
}

.btn-success:active{
    color: #FFFFFF !important;
}

.btn.float-bottom-right {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 25px;
}

.float-bottom-right i {
    position: absolute;
    top: 15px;
    left: 15px;
}

.float-bottom-right .notify {
    position: relative;
    left: 21px;
    top: 6px;
}

.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 8px;
    right: 60px;
    display: none;
    z-index: 10;
}

p a  {
    text-decoration: underline;
}

nav a {
    text-decoration: none;
}

a.link:hover, a.link:focus, a:hover {
    color: #903600 !important;
}

a:focus {
    color: #0052ab !important;
}

a.btn:focus {
    color: #CECECE !important;
}

a.btn:hover {
    color: #FFFFFF !important;
}

.wizard-content a:focus {
    color: #271414 !important;
}

.wizard-content .wizard > .actions > ul > li > a:focus{
    color: #FFFFFF !important;
}

.wizard-content .wizard > .actions > ul > li > a[href="#previous"] {
    color: #2d2d2d !important;
}
.wizard-content .wizard > .actions > ul > li > a[href="#previous"]:focus {
    color: #271414 !important;
}
.pagination a:focus {
    color: #001e3e !important;
}

.dataTables_wrapper{
    padding-top: 0px;
}

.dataTables_wrapper th:focus, .dataTables_wrapper td:focus {
    color: #00536d;
    }

.dataTables_wrapper tr.selected th:focus, .dataTables_wrapper tr.selected td:focus {
    color: #FFFFFF;
}

/***/
table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected {
    background-color: #235033;
}
table.dataTable tbody > tr.selected [class^="text"], table.dataTable tbody > tr.selected [class^="mcr-text"],
table.dataTable tbody > tr > .selected [class^="text"], table.dataTable tbody > tr > .selected [class^="mcr-text"] {
    color: #FFF !important;
}
/*
.login-box a {
    color: #daca59 !important;
}
.login-box a:hover {
    color: #fff18f !important;
}
.login-box a:focus {
    color: #72d886 !important;
}*/

.sidebar-nav ul li a:hover {
    color: #00cebc !important;
}

.sidebar-nav > ul > li.active > a:focus, .sidebar-nav ul li a:focus {
    color: #e2e2e2 !important;
}

.sidebar-nav > ul > li > ul li a:focus {
    color: #CECECE !important;
}

@media (min-width: 768px) {
    .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a {
        color: #FFFFFF !important;
        background: #235033;
        width: 255px;
    }

    .mini-sidebar .sidebar-nav #sidebarnav > li > ul {
        left: 55px;
        top: 40px;
    }
}

@media (min-width: 768px) and (max-width: 826px) {
    .flex-wrap {
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        -webkit-flex-wrap: wrap !important;
    }
}

.list-group-item.active, .list-group .list-group-item.active:hover {
    color: #000000 !important;
}

.list-group .list-group-item.active:focus {
    color: #0a0a0a !important;
    background: #2fa4e8;
    border-color: #2fa4e8;
}

.btn-warning, .btn-warning.disabled {
    color: #312525 !important;
}

.btn-warning:hover, .btn-warning.disabled:hover {
    color: #2f2323 !important;
}

/* Apply these styles only when screen size is less than 765px */
@media (max-width: 765px) {
    .my-0 {
        margin: 0px !important;
    }
    .my-5 {
        margin: 5px !important;
    }
    .my-15 {
        margin: 15px !important;
    }
    .my-10 {
        margin: 10px !important;
    }
    .my-20 {
        margin: 20px !important;
    }

    .my-t-0 {
        margin-top: 0px !important;
    }
    .my-t-5 {
        margin-top: 5px !important;
    }
    .my-t-10 {
        margin-top: 10px !important;
    }
    .my-t-15 {
        margin-top: 15px !important;
    }
    .my-t-20 {
        margin-top: 20px !important;
    }

    .my-r-0 {
        margin-right: 0px !important;
    }
    .my-r-5 {
        margin-right: 5px !important;
    }
    .my-r-10 {
        margin-right: 10px !important;
    }
    .my-r-15 {
        margin-right: 15px !important;
    }
    .my-r-20 {
        margin-right: 20px !important;
    }

    .my-b-0 {
        margin-bottom: 0px !important;
    }
    .my-b-5 {
        margin-bottom: 5px !important;
    }
    .my-b-10 {
        margin-bottom: 10px !important;
    }
    .my-b-15 {
        margin-bottom: 15px !important;
    }
    .my-b-20 {
        margin-bottom: 20px !important;
    }

    .my-l-0 {
        margin-left: 0px !important;
    }
    .my-l-5 {
        margin-left: 5px !important;
    }
    .my-l-10 {
        margin-left: 10px !important;
    }
    .my-l-15 {
        margin-left: 15px !important;
    }
    .my-l-20 {
        margin-left: 20px !important;
    }

    /** Add scroll after x width */
    .scroll-min-width-200px, .scroll-min-width-300px, .scroll-min-width-350px, .scroll-min-width-400px, .scroll-min-width-450px, .scroll-min-width-500px {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto !important;
    }
    /* parent > child.with_class */
    .scroll-min-width-200px > div.scroll {
        min-width: 200px;
    }
    .scroll-min-width-300px > div.scroll {
        min-width: 300px;
    }
    .scroll-min-width-350px > div.scroll {
        min-width: 350px;
    }
    .scroll-min-width-400px > div.scroll {
        min-width: 400px;
    }
    .scroll-min-width-450px > div.scroll {
        min-width: 450px;
    }
    .scroll-min-width-500px > div.scroll {
        min-width: 500px;
    }

    ul.timeline.overrides:before {
        left: 25px !important;
    }

    .dataTables_info {
        white-space: normal !important;
    }
}

.required::after {
    content: " *";
}

/** Background colours*/
.mcr-bg-green {
    background-color: #006323  !important;
}
.mcr-bg-gray, .mcr-bg-grey {
    background-color: #EBEBEB !important;
}
.mcr-bg-teak {
    background-color: #AFA35B !important;
    color: #151515 !important;
}
.mcr-bg-blue {
    background-color: #2e577b !important;
}
.mcr-bg-tapestry {
    background-color: #ab1b44 !important;
}
.mcr-bg-purple {
    background-color: #533f9e !important;
}
.mcr-bg-blue-orient {
    background-color: #005782 !important;
}
.mcr-bg-livid-brown {
    background-color: #4f2432 !important;
}
.mcr-bg-finn {
    background-color: #4f2448 !important;
}
.mcr-bg-port-gore {
    background-color: #2b244f !important;
}
.mcr-bg-mineral-green {
    background-color: #0f632b !important;
}

/** Background colour: Symphony Wheel Colours */
.mcr-bg-swc-wheat {
    background-color: #d4a500 !important;
    color: #191919 !important;
}
.mcr-bg-swc-curious-blue {
    background-color: #007bbb !important;
}
.mcr-bg-swc-light-green {
    background-color: #81c938 !important;
}
.mcr-bg-swc-orange {
    background-color: #e7552b !important;
}
.mcr-bg-swc-purple {
    background-color: #5f3a94 !important;
}
.mcr-bg-swc-amaranth {
    background-color: #e22a47 !important;
}


/** Text colour */
.mcr-text-theme {
    color: #005d21 !important;
}
.mcr-text-gray, .mcr-text-grey {
    color: #EBEBEB !important;
}
.mcr-text-teak {
    color: #AFA35B !important;
}
.mcr-text-blue {
    color: #5b8baf !important;
}
.mcr-text-tapestry {
    color: #af5b73 !important;
}
.mcr-text-purple {
    color: #6d5baf !important;
}
.mcr-text-blue-orient {
    color: #005782 !important;
}
.mcr-text-livid-brown {
    color: #4f2432 !important;
}
.mcr-text-finn {
    color: #4f2448 !important;
}
.mcr-text-port-gore {
    color: #2b244f !important;
}
.mcr-text-mineral-green {
    color: #0c5625 !important;
}

/** Text colour: Symphony Wheel Colours */
.mcr-text-swc-wheat {
    color: #c1b561 !important;
}
.mcr-text-swc-curious-blue {
    color: #007bbb !important;
}
.mcr-text-swc-light-green {
    color: #81c938 !important;
}
.mcr-text-swc-orange {
    color: #e7552b !important;
}
.mcr-text-swc-purple {
    color: #5f3a94 !important;
}
.mcr-text-swc-amaranth {
    color: #A0122E !important;
}

.text-cinnamon {
    color: #714a00 !important;
}

.text-link {
    color: #0056b3 !important;
}

.mcr-bg-teak h1, .mcr-bg-teak h2, .mcr-bg-teak h3, .mcr-bg-teak h4, .mcr-bg-teak h5, .mcr-bg-teak p {
    color: #151515;
}

a.mcr-text-theme {
 font-weight: 400;
}

dl.n-p, ol.n-p, ul.n-p {
    padding: 0;
    padding-left: 11px;
}

dl.n-p dl, dl.n-p ol,
ol.n-p dl, ol.n-p ol,
ul.n-p dl, ul.n-p ol {
    padding: 0;
    padding-left: 11px;
}

dl.n-p ul, ol.n-p ul, ul.n-p ul {
    padding: 0;
    padding-left: 20px;
}


/* Timeline*/
/* Float the badges to left */
.timeline.override > li > .timeline-badge {
    left: inherit !important;
    margin-left: 0px !important;
}
/* Width of panel */
.timeline.override > li > .timeline-panel {
    width: calc(100% - 65px) !important;
}

.timeline.override {
    max-width: inherit;
}

.timeline:before, .timeline.override:before {
    display: block;
    background-color: #e2e4e8
}
.timeline.override:before {
    left: 25px;
}

.timeline.tprogress:after {
    background-color: red;
}

/* KPI icons */
.kpi-image {
    width: 38px !important;
    height: 38px !important;
    padding: 0;
    margin: 6px;
}

/* Limit search box size */
div.dataTables_wrapper div.dataTables_filter input{
    width: 150px !important;
}

/* Stick page title to the top of each page */
.sticky-page-title-top {
    z-index:15;
    top:70px;
}

@media (min-width: 1024px) and (max-width: 1170px) {
    .page-wrapper {
        margin-left: 60px !important;
    }
}

@media (min-width: 769px) and (max-width: 1023px) {
    .mini-sidebar .page-wrapper {
        margin-left: 60px !important;
    }
}

@media (max-width: 767px) {
    .page-wrapper {
        margin-left: 0 !important;
    }

    #main-container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .page-titles {
        margin-left: -15px !important;
        margin-right: -15px !important;
        margin-bottom: 15px !important;
        padding:10px !important;
    }

    #main-container .card {
        margin-bottom: 10px;
    }
}

.apexcharts-legend {
    padding: 0 !important;
}

.background-image-arrow-down {
    background-image: url(../images/icons/performance-arrow-down.svg);
}
.background-image-arrow-up {
    background-image: url(../images/icons/performance-arrow-up.svg);
}
.background-image-circle-light {
    background-image: url(../images/icons/performance-circle-light.svg);
}
.background-image-circle-dark {
    background-image: url(../images/icons/performance-circle-dark.svg);
}
.background-image-arrow-down, .background-image-arrow-up,
.background-image-circle-light, .background-image-circle-dark {
    background-size: 45px;
    background-repeat: no-repeat;
    background-position: bottom right; 
}

.background-image-circle-light, .background-image-circle-dark {
    background-size: 60px;
}
.bg-transparent-image {
    background-image: url(../images/icons/transparent-square.svg);
    background-repeat:repeat;
}

.border-dotted {
    border-style: dotted !important;
}

.border-dotted-2px {
    border-style: dotted !important;
    border-width: 2px !important; 
}

@keyframes pulse {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
    }
}

.animate-opacity {
    animation: pulse 2s 8;
}

.animate-opacity-infinite {
    animation: pulse 2s infinite;
}

.bullet:before {
    content: "\2022";
    display: inline-block;
    margin-left: 5px;
    margin-right: 10px;
    font-size: 35px;
    line-height: 20px;
    vertical-align: middle;
}

/* Added to block bootstrap downgrade of animations which stopped our fade in and out working */
@media screen and (prefers-reduced-motion: reduce) {
    .fade {
        transition: opacity 0.15s linear !important;
    }
}

/* Added to block bootstrap downgrade of animations which stopped our fade in and out working */
@media screen and (prefers-reduced-motion: reduce) {
    .modal.fade .modal-dialog {
        transition: -webkit-transform 0.01s ease-out !important;
        transition: transform 0.3s ease-out !important;
        transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out !important;
    }
}

#security-word-container {
    display: grid;
}

#security-word-container .layer1, #security-word-container .layer2 {
    grid-column: 1;
    grid-row: 1;
}

#security-word-container .layer1 {
    z-index: 999;
    transition: opacity 1s;
}

#security-word-container .layer1:active {
    opacity: 0;
}

#gdpr-toggle {
    right: 16px !important;
    bottom: 9px !important;
}

.table-card .card {
    border: 2px solid rgba(35, 80, 51, 1);
}

.table-card .total {
    font-size: 1.2rem;
    border: 1px solid rgba(35, 80, 51, 0.7);
}

tr .code {
    font-family: monospace, 'Courier New';
}

tr.selected .code {
    color: #FFFFFF;
}

.ribbon-vertical-transaction-l {
    clear: none;
    padding: 0 4px;
    height: 40px;
    width: 40px;
    line-height: 50px;
    text-align: center;
    top: -2px;
    background: rgba(35, 80, 51, 0.7);
    border-bottom-right-radius: 5px;
}

.pointer {
    cursor: pointer;
}

.modal-dialog-wider {
    max-width:800px !important;
}

.cc-cp-foot > .cc-cp-foot-byline {
    visibility: hidden !important;
}

.cookie_preferences {
    position: fixed;
    cursor: pointer;
    display: flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    background-color: rgb(72, 72, 74);
    border-radius: 50px;
    z-index: 2147483646;
    bottom: 10px;
    right: 10px;
    color: #CCC;
    padding-top: 3px;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    right: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

.dropdown-submenu > span:before {
    display: block;
    content: " ";
    float: left;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 5px 5px 0;
    border-right-color: #ccc;
    margin-top: 7px;
    margin-left: -10px;
    margin-right: 5px;
}

.dropdown-submenu:hover > span:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left > .dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

.page-item {
    padding: 0 !important;
    border: none !important;
}

.page-link:focus {
    box-shadow: none !important;
}

.page-item.active .page-link {
    background-color: inherit !important;
    border-color: #235033 !important;
    color: inherit !important;
}

#terminal-map {
    min-height: 400px;
    border: 1px solid #e6dee3;
}
