@import "../../../../DesktopModules/AdminModules/shared.css";
@import "LoyaltyStreamLite/menu.css";
@import "Skin.css";
@import "LoyaltyStreamLite/header.css";
@import "LoyaltyStreamLite/menu.css";
@import "../../../../DesktopModules/CPSModules/SkinObjects/module.css";

body {
    --main-color: #002d5d !important;
    --site-menu-main-color: var(--menu-text-colour);
    /*
    --site-menu-main-color: #002d5d !important;
    --site-menu-background-color: #315985 !important;
    */
    --highlight-color: #fbad1d;
    --site-color-purple: #544595;
    --site-color-blue: #43BCCD;
    --site-color-green: #0B6E4F;
    --site-color-yellow: #F9C80E;
    --site-color-orange: #F86624;
    --site-color-black: #282828;
    --site-color-grey: #EDEDED;
    --site-color-lightgrey: #F1F1F1;
    --site-color-lightblue: #D0EAF0;
    --site-color-lightorange: #FBD1B7;
    --main-color: #554596;
    --highlight-color: #BFA8D1;
    --text-color: #0d526a;
    --text-on-main-color: #ffffff;
    --readonly-bgcolor: #EDEDED;
    --text-colour: #0d526a;
    --primary-header-colour: #0d526a;
}



.site-menu-nav ul {
    border: none;
    background-color: white;
}

.site-menu-nav {
    margin: 0 !important;
    border-top: 2px solid var(--site-color-lightgrey) !important;
    border-bottom: 2px solid var(--site-color-lightgrey) !important;
}

    .site-menu-nav a {
        height: 100%;
    }

    .site-menu-nav .sub-menu {
        background-color: white;
        color: black;
        z-index: 9999;
    }

        .site-menu-nav .sub-menu a {
            color: var(--menu-text-colour); 
        }

.sub-menu li a:hover,
.site-menu li:hover, .site-menu li a:hover {
}

nav ul li:hover > ul {
    padding-right: 0px;
}

h1, h2, h3, h4 {
    color: var(--main-color) !important;
    font-weight: 700 !important;
}

h1, h2, h3, h4, h5, h6, p, div, td, th, tr {
    font-family: Raleway, Calibri !important;
}



.btn-primary {
    background-color: var(--main-color);
    border-color: var(--main-color);
    color: #ffffff !important;
    font-size: 14px;
}

    .btn-primary:hover, .btn-primary:active, .btn-primary:focus {
        background-color: var(--highlight-color) !important;
        border-color: var(--highlight-color) !important;
    }

    .btn-primary:focus {
        box-shadow: 0 0 0 0.25rem rgb(251 173 29 / 50%);
    }

.search-btn, .clear-filters-btn, .btn-primary {
    margin-left: 5px;
    margin-right: 5px;
    box-shadow: 0px 5px 6px #00000029;
    font-size: 14px;
}

    .search-btn:hover {
        box-shadow: 0px 5px 6px var(--site-color-orange);
        border-color: transparent !important;
    }

.btn-primary-orange, .search-btn {
    background-color: var(--site-color-lightorange) !important;
    border-color: transparent !important;
    color: var(--site-color-orange) !important;
    font-size: 14px;
}

    .btn-primary-orange:hover, .btn-primary-orange:active, .btn-primary-orange:focus,
    .search-btn:hover, .search-btn:active, .search-btn:focus {
        background-color: var(--site-color-orange) !important;
        color: #ffffff !important;
        box-shadow: 0px 5px 6px #00000029;
    }



.clear-filters-btn {
    background-color: white;
    border-color: transparent !important;
    color: black !important;
    font-size: 14px;
}

    .clear-filters-btn:hover, .clear-filters-btn:active, .clear-filters-btn:focus {
        color: var(--site-color-purple) !important;
        box-shadow: 0px 5px 6px var(--site-color-purple);
    }



.mandatory-field {
    color: red;
}

.tab-strip .rtsLI a {
    border-color: var(--main-color) !important;
    color: var(--main-color);
}



.selected-tab {
    background-color: var(--main-color) !important;
    color: #ffffff !important;
}

#content {
    padding-bottom: 20px;
    /* padding-top: 20px;*/
}

.padded-segment {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 5%;
    padding-right: 5%
}

#menu {
    width: 100%;
}


#header {
    margin: 10px 30px;
    background-color: white;
}

    #header .icon {
        font-size: 1.5em;
    }

.language-object span {
    margin: 0px 5px;
}

    .language-object span img {
        opacity: 0.5;
    }

.language-object .selected img {
    opacity: 1;
}

#header a, #header a:visited, #header a:hover, #header a.active {
    color: var(--main-color);
    text-decoration: none;
}

.user-details {
    text-align: right;
}

.rgHeader, .rgHeader a {
    /*background-color: var(--main-color) !important;
    color: #ffffff !important;*/
    font-weight: bold !important;
}

/* new phase 2 stylings added*/

.rmpView .RadGrid.RadGrid_Bootstrap .rgHeader,
.RadGrid_Bootstrap.cps-table .rgHeader {
    background-color: var(--site-color-lightgrey) !important;
    color: var(--site-color-black) !important;
    border-left: none;
    padding: 10px;
}

.rmpView .RadGrid.RadGrid_Bootstrap td,
.RadGrid_Bootstrap.cps-table td {
    border-left: none !important;
    border-top-width: 2px !important;
    border-top-color: var(--site-color-grey) !important;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgRow td,
.rmpView .RadGrid.RadGrid_Bootstrap .rgAltRow td {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.RadGrid_Bootstrap.cps-table.product-insights td {
    padding: 15px 25px !important;
}

.RadGrid_Bootstrap.cps-table.product-insights .rgPager td {
    padding: 0px !important;
}

    .RadGrid_Bootstrap.cps-table.product-insights .rgPager td.rgPagerCell {
        padding: 7px !important;
    }

.rmpView .RadGrid.RadGrid_Bootstrap .rgSorted,
.RadGrid_Bootstrap.cps-table .rgSorted {
    background-color: var(--site-color-lightgrey) !important;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgAltRow > td,
.RadGrid_Bootstrap.cps-table .rgAltRow > td {
    background-color: white;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgFooter td,
.cps-table .rgFooter td {
    background-color: var(--site-color-lightgrey) !important;
    padding-right: 7px !important;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgHeader:first-child,
.cps-table .rgHeader:first-child {
    border-top-left-radius: 10px;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgHeader:last-child,
.cps-table .rgHeader:last-child {
    border-top-right-radius: 10px;
}

.rmpView .RadGrid.RadGrid_Bootstrap td.rgPagerCell,
.RadGrid_Bootstrap.cps-table td.rgPagerCell {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgMasterTable,
.RadGrid.RadGrid_Bootstrap.cps-table .rgMasterTable {
    border-collapse: collapse;
}

.rmpView .RadGrid.RadGrid_Bootstrap,
.RadGrid.RadGrid_Bootstrap.cps-table {
    border-width: 2px;
    border-radius: 14px;
}

    .rmpView .RadGrid.RadGrid_Bootstrap .rgHeader a,
    .cps-table .rgHeader a, .RadGrid.RadGrid_Bootstrap th {
        /*   background-color: inherit !important;*/
        color: inherit !important;
        font-size: 14px;
    }

    .rmpView .RadGrid.RadGrid_Bootstrap a,
    .RadGrid_Bootstrap.cps-table a {
        text-decoration: none;
        color: var(--site-color-black)
    }

.rmpView .RadGrid_Bootstrap .rgCommandCell {
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.rmpView .RadGrid.RadGrid_Bootstrap .rgCommandCell {
    border-top-color: transparent !important;
    border-bottom-color: #dedede; /*this is the radGrid_boostrap colour - using it so it matches*/
}

.rmpView .RadGrid.RadGrid_Bootstrap td {
    border-bottom-color: transparent;
}


.chart-card {
    box-shadow: 0px 5px 6px #00000029;
    border-radius: 14px;
    z-index: 99;
    position: relative;
    background-color: white;
    padding-top: 40px;
    height: 100%;
}

    .chart-card svg {
        border-radius: 14px;
    }

.pie-chart-inside-Label .chart-card {
    box-shadow: none;
    position: inherit;
    background-color: transparent;
    padding-top: 10px;
    height: inherit;
}

.button-container-lifecycle {
    position: relative;
    left: 50px;
    bottom: 45px;
}


.button-container-marketing {
}

.bar-chart-label-left {
    transform: rotate(-90deg);
    position: absolute;
    top: 300px;
    left: 2%;
    display: inline-block;
    z-index: 100;
}

.bar-chart-label-right {
    transform: rotate(-270deg);
    position: absolute;
    top: 300px;
    right: 2%;
    display: inline-block;
    z-index: 100;
}

.content-row {
    padding-left: 5%;
    padding-right: 5%
}

.lightblue-container {
    background-color: var(--site-color-lightblue);
    padding-top: 30px;
    padding-bottom: 30px;
}

.lightgrey-container {
    background-color: var(--site-color-lightgrey);
    padding-top: 30px;
    padding-bottom: 30px;
}

.black-container {
    background-color: black;
    padding-top: 30px;
    padding-bottom: 30px;
}

    .black-container .header h1, .black-container .header h2, .black-container .header h3, .black-container .header h4, .black-container .header h5 {
        color: white !important;
    }

    .black-container .dashboard-tile-link h1, .black-container .dashboard-tile-link h2, .black-container .dashboard-tile-link h3,
    .black-container .dashboard-tile-link h4, .black-container .dashboard-tile-link h5 {
        color: var(--main-color);
    }

.cps-bar-chart {
    padding-left: 10%;
    padding-right: 10%;
    padding-top: 40px;
    padding-bottom: 20px
}

.bar-chart-label-horizontal label {
    font-size: 18px !important;
}

.bar-chart-label-horizontal .row {
    padding-top: 10px;
}

.chart-card .tile-contents {
}

.blue-purple-card .dashboard-card, .blue-purple-card.hit-rate {
    background: linear-gradient(to bottom right, var(--site-color-blue), var(--site-color-purple));
    color: white;
}

.blue-purple-card h1, .blue-purple-card h2, .blue-purple-card h3, .blue-purple-card h4, .blue-purple-card h5, .blue-purple-card h6, .blue-purple-card p {
    color: white !important;
}

.blue-purple-card h2 {
    font-size: 24px;
}

.blue-purple-card .last-updated-text {
    visibility: hidden;
}

.blue-purple-card .row div {
    align-self: center;
}

.blue-purple-card img {
    object-fit: contain;
    max-width: 100%;
}

.prospects-count-orange {
    background-color: rgba(248,102,36,0.2);
    border-radius: 10px;
    padding: 30px 20px 30px 20px;
    margin: 15px;
    flex: 1 0 0%;
}

.prospects-count-blue {
    background-color: rgba(67,188,205,0.2);
    border-radius: 10px;
    padding: 30px 20px 30px 20px;
    margin: 15px;
    flex: 1 0 0%;
}

.prospects-count-green {
    background-color: rgba(11,110,79,0.2);
    border-radius: 10px;
    padding: 30px 20px 30px 20px;
    margin: 10px 15px;
    flex: 1 0 0%;
}

.prospects-count-purple {
    background-color: rgba(84,69,149,0.2);
    border-radius: 10px;
    padding: 30px 20px 30px 20px;
    margin: 10px 15px;
    flex: 1 0 0%;
}

    .prospects-count-green .col-6.text-start,
    .prospects-count-purple .col-6.text-start {
        padding-left: 0px !important;
    }


.prospects-count-orange h1, .prospects-count-orange h2, .prospects-count-orange h3, .prospects-count-orange h4, .prospects-count-orange h5, .prospects-count-orange h6,
.prospects-count-orange p {
    color: var(--site-color-orange) !important;
}

.prospects-count-purple h1, .prospects-count-purple h2, .prospects-count-purple h3, .prospects-count-purple h4, .prospects-count-purple h5, .prospects-count-purple h6,
.prospects-count-purple p {
    color: var(--site-color-purple) !important;
}

.prospects-count-green h1, .prospects-count-green h2, .prospects-count-green h3, .prospects-count-green h4, .prospects-count-green h5, .prospects-count-green h6,
.prospects-count-green p {
    color: var(--site-color-green) !important;
}

.prospects-count-blue h1, .prospects-count-blue h2, .prospects-count-blue h3, .prospects-count-blue h4, .prospects-count-blue h5, .prospects-count-blue h6,
.prospects-count-blue p {
    color: var(--site-color-blue) !important;
}

.prospect-card {
    padding-left: 40px;
    padding-right: 40px;
}


.healthcheck_legend {
    border-radius: 10px;
    padding: 15px 10px 10px 10px;
    margin: 15px;
    flex: 1 0 0%;
}




.product-dif-container {
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.product-dif-label {
    border-radius: 10px;
    padding: 15px 10px 5px 10px;
    margin: 10px;
    flex: 1 0 20%;
    text-align: center;
}

.chart-title {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
}

.filters select {
    background-color: var(--site-color-lightgrey);
    border: 0;
    border-radius: 0;
}

p.load-time-data {
    padding-top: 10px;
}

.heavy-borders.heavy-borders-box {
    border-color: var(--site-color-grey) !important;
}

a.hyperlink-card {
    text-decoration: none !important;
}

.checkbox-item input {
    margin-right: 5px;
}

.comms-key img {
    margin-bottom: 5px;
    margin-right: 3px;
    margin-left: 3px;
    width: 20px;
    height: 20px;
}

.btn-info-circle.account-info-btn {
    background-color: white !important;
    border: none !important;
    box-shadow: none !important;
}

    .btn-info-circle.account-info-btn i.fa.fa-info-circle {
        color: var(--site-color-purple) !important;
    }

btn:focus {
    box-shadow: none !important;
}

.btn-info-circle.account-info-btn:hover, .btn-info-circl.account-info-btn:active, .btn-info-circl.account-info-btn:focus {
    background-color: white !important;
    border: none !important;
    box-shadow: none !important;
}

.btn-info-circl.account-info-btn i.fa.fa-info-circle:hover, .btn-info-circl.account-info-btn i.fa.fa-info-circle:active, .btn-info-circl.account-info-btn i.fa.fa-info-circle:focus {
    color: var(--site-color-orange) !important;
}



.load-time-data {
    margin-top: 10px;
}

.filters-row label {
    font-weight: bold;
}

.cpsTable_orange {
    background-color: var(--site-color-lightorange) !important;
}

    .cpsTable_orange.rgHeader {
        background-color: var(--site-color-orange) !important;
    }

a label {
    cursor: pointer;
}

label.no-wrap {
    white-space: nowrap;
}

.blue-purple-card .dashboard-card .square-tile.static-text {
    padding-bottom: 20px;
}

.hit-rate {
    padding-bottom: 40px;
    padding-right: 40px;
    display: flex;
}

    .hit-rate img {
        padding-left: 40px;
    }

.trade-segment {
    background-color: var(--site-color-lightgrey);
    margin: 5px;
    border-radius: 5px;
    padding: 5px 15px;
    box-shadow: 0px 3px 6px #00000029;
    position: relative;
}

    .trade-segment .btn-close {
        width: 4px;
        height: 4px;
        position: absolute;
        top: 4px;
        right: 4px;
        display: inline-block;
        vertical-align: middle;
        overflow: hidden;
    }

.chart-card.prospect-card a, .chart-card.prospect-card a p, .chart-card.prospect-card a h4 {
    text-decoration: none;
    color: inherit;
}

.customer-branch-spend {
    background-color: var(--site-color-lightblue) !important;
    padding: 10px 15px;
}

.dashboard-tile-link, .dashboard-tile-link:hover, .dashboard-tile-link:active, .dashboard-tile-link:visited {
    text-decoration: none;
    color: #000000;
}

.card .heavy-borders {
    border: none !important;
}

.card {
    height: 100%;
}

    .card.dashboard-card {
        border-width: 0 !important;
        border-radius: 10px !important;
        text-align: center;
        box-shadow: 0px 5px 6px #00000029;
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 180px;
        width: 100%;
    }

.last-updated-text {
    display: none;
}

.dashboard-card h4 {
    min-height: 70px;
}

.contacted {
    background-color: #d1e7dd;
}

.proactivity-dashboard h2, .proactivity-dashboard h1 {
    padding-bottom: 20px;
}

.row.dashboard {
    background-color: var(--site-color-lightblue);
    padding-bottom: 40px;
}

.proactivity-dashboard .dashboard-tile .dashboard-card .btn {
    padding: 0;
}

.proactivity-dashboard .dashboard-tile .dashboard-card .btn-secondary,
.proactivity-dashboard .dashboard-tile .dashboard-card .btn-secondary :active,
.proactivity-dashboard .dashboard-tile .dashboard-card .btn-secondary :focus {
    background-color: transparent;
    border-color: transparent;
    color: transparent !important;
    box-shadow: none;
}

.proactivity-dashboard .card-body {
    padding: 1.5rem 1.5rem 0.5rem 1.5rem;
    flex: none;
}

.reports .row-cols-3 > * {
    margin-bottom: 1rem;
}

.ls-desktop-menu .header-block {
    padding-right: 30px;
}

.header-userinfo, .loginGroup {
    display: inline-block;
}

.filters {
    padding-top: 15px;
}

.userinfo-group {
    padding-top: 20px;
}

.mobile-menu {
    padding: 10px;
}

.ls-mobile-menu .filters {
    padding: 20px 50px 20px 50px;
}

.ls-mobile-menu .header-block {
    height: 100px;
}

.reports .card-text .view-link {
    bottom: 10px;
}