/* Override Kendo theme properties */
:root {
    --kendo-color-primary: #275dad;
    --kendo-font-size: 0.875rem;
    --kendo-menu-item-text: #212529;
}

/* Override theme to set dark side bar to primary color. */
:root[data-sidebar=dark] {
    --tb-vertical-menu-bg: var(--tb-primary);
    --tb-vertical-menu-border: var(--tb-indigo);
    --tb-vertical-menu-item-color: var(--tb-gray-400);
    --tb-vertical-menu-title-color: var(--tb-white);
    --tb-twocolumn-menu-iconview-bg: var(--tb-primary);
}

/* Override theme to set top bar to primary color. */
:root[data-topbar=dark] {
    --tb-header-bg: var(--tb-primary);
    --tb-header-item-sub-color: var(--tb-gray-400);
    --tb-topnav-item-color: var(--tb-gray-400);
    --tb-topnav-item-color-active: var(--tb-white);
}

/* Override theme to nav item color. */
[data-layout=twocolumn] li.nav-item {
    color: var(--tb-vertical-menu-item-color);
}

/* Override theme to nav item color. */
[data-layout=vertical] li.nav-item {
    color: var(--tb-vertical-menu-sub-item-color);
}

/* Override theme to nav item color. */
[data-layout=horizontal] li.nav-item {
    color: var(--tb-topnav-item-color);
}

/* Override theme to include a box shadow for keyboard navigation clarity. */
[data-layout=horizontal] .nav-link:focus-visible,
[data-layout=horizontal] .logo:focus-visible {
    box-shadow: 0 0 0 2px rgba(27, 127, 204, .8);
}

/* Override theme to set top bar menu link color. */
[data-layout=horizontal][data-topbar=dark] .navbar-nav .nav-sm .nav-link,
[data-layout=horizontal][data-topbar=dark] li.nav-item {
    color: var(--tb-vertical-menu-sub-item-color);
}

/* Override theme to set top bar menu active color. */
[data-layout=horizontal][data-topbar=dark] .navbar-nav .nav-sm .nav-link:hover, 
[data-layout=horizontal][data-topbar=dark] .navbar-nav .nav-sm .nav-link.active {
    color: var(--tb-primary);
}

/* Override theme to set active menu item bottom border. */
[data-layout=horizontal][data-topbar=dark] .navbar-menu .navbar-nav .nav-link.active:before {
    background-color: var(--tb-white);
}

/* Override theme to set width from 90% to 100%. */
@media (min-width: 1024.1px) {
    [data-layout=horizontal] .layout-width,
    [data-layout=horizontal] .container-fluid {
        max-width: 100%;
    }
}

/* Override theme hamburger icon. */
.hamburger-icon span:nth-child(1) {
    width: 100%;
}
.hamburger-icon span:nth-child(3) {
    width: 100%;
}
.hamburger-icon.open {
  transform: none;
}
.hamburger-icon.open span:nth-child(1) {
  left: unset;
  top: 0;
  width: 100%;
  transform: unset;
  transition-delay: unset;
}
.hamburger-icon.open span:nth-child(2) {
  left: unset;
  top: 6px;
  width: 100%;
  transform: unset;
  transition-delay: unset;
}
.hamburger-icon.open span:nth-child(3) {
  left: unset;
  top: unset;
  bottom: 0;
  width: 100%;
  transform: unset;
  transition-delay: unset;
}
.vertical-menu-btn:hover .hamburger-icon:is(.open) span:nth-child(1) {
    top: -1px;
}
.vertical-menu-btn:hover .hamburger-icon:is(.open) span:nth-child(3) {
    bottom: -1px;
}

@media (min-width: 1024.1px) {
    /* Override theme mega menu width and position. */
    [data-layout=horizontal] .navbar-menu .navbar-nav .cb-mega-dropdown-menu {
        width: 55rem;
        transform: translateX(-50%);
    }

    /* Override theme mega menu left padding. */
    [data-layout=horizontal] .navbar-menu .navbar-nav .cb-mega-dropdown-menu .nav-sm {
        padding-left: 1.75rem;
    }

    /* Override theme mega menu text wrap. */
    [data-layout=horizontal] .navbar-menu .navbar-nav .cb-mega-dropdown-menu .nav-item .nav-link {
        white-space: normal;
    }
}

/* Override theme dark border. */
:root[data-bs-theme=dark] {
    --tb-dark-border-subtle: #2b2a31;
}

/* Override theme accordian caret. */
[data-bs-theme=light] .accordion-button:not(.collapsed):after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Override theme accordian caret. */
[data-bs-theme=dark] .accordion-button:not(.collapsed) {
    color: var(--tb-accordion-active-color);
}

/* Override theme code block selection */
code {
    user-select: text;
}

/* Bootstrap form floating add margin. */
.form-floating {
    margin-bottom: 1rem !important;
}

/* Bootstrap form group add margin. */
.form-group {
    margin-bottom: 0.5rem !important;
}

/* Bootstrap card change color. */
.card-header {
    background-color: var(--tb-light-bg-subtle);
}

/* Bootstrap accordian change color. */
.accordion {
    --tb-accordion-active-color: var(--tb-white);
    --tb-accordion-active-bg: var(--tb-primary);
}

/* Kendo toolbar before element reduced height */
.k-toolbar::before {
    height: 0;
}

/* Kendo set scrollbars for comparable table-responsive-md size. */
.k-grid table {
    min-width: 767.98px;
}

/* Kendo pager size expanded from 5em to 5.75em to prevent clipping of value because of reduction in default font size from 1em (16px) to 0.875em (14px). */
.k-pager-md .k-pager-sizes .k-dropdown-list, .k-pager-md .k-pager-sizes .k-dropdown, .k-pager-md .k-pager-sizes .k-dropdownlist, .k-pager-md .k-pager-sizes > select {
    width: 5.75em;
}

/* Kendo grid set links to have underline when hovered over. */
.k-grid a:hover {
    text-decoration: underline;
}

/* Field validation change color. */
.field-validation-error {
    color: red;
    font-weight: bold;
}

/* Main body minium height is viewport height minus header and footer size (219px) */
.cb-main-body-viewport-height {
    min-height: calc(100vh - 219px);
}

.cb-home-dropcaps:first-of-type:first-letter {
    height: 0.7em;
    margin: 0.08em 0 -0.05em 0;
    padding: 0 0.08em 0 0;
    font-size: 5em;
    line-height: 0.85em;
    float: left;
}

.cb-transaction-page .form-group .k-dropdownlist,
.cb-customer-page .card-body,
.cb-transaction-page .card-body {
    min-height: 60.13px;
}

.cb-session-background {
    --tb-body-bg: #ffffff;
}

.cb-session-application-header {
    overflow: auto;
}

.cb-session-application-logo {
    float: left;
    padding-bottom: 20px;
}

.cb-session-application-environment {
    float: right
}

.cb-wallet-height-rem-1 {
    height: 1rem;
}

.cb-wallet-nav-tabs > li > a {
    color: var(--tb-body-color);
    font-weight: 500;
}

.cb-error-title {
    font-size: 11rem;
    line-height: 1;
}

.cb-faq-page .nav-tabs {
    --tb-nav-tabs-border-color: var(--tb-primary);
    --tb-nav-tabs-link-active-color: var(--tb-white);
    --tb-nav-tabs-link-active-bg: var(--tb-primary);
    --tb-nav-tabs-link-active-border-color: var(--tb-primary) var(--tb-primary) var(--tb-primary);
}

.cb-developer-wallet-label {
    margin-bottom: 0rem;
}

.cb-grid-column-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.k-pdf-export .cb-grid-column-ellipsis {
    white-space: normal;
    overflow: visible;
    -ms-text-overflow: clip;
    -o-text-overflow: clip;
    text-overflow: clip;
}

.cb-grid-toolbar-title-hover:hover {
    opacity: .7;
    cursor: pointer;
}

.cb-card-icon {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.cb-session-check-sample-label {
    white-space: nowrap;
}

.cb-session-check-sample-routing-label {
    width: 170px;
    float: left;
}

.cb-session-spinner {
    z-index: 5000;
}

.cb-originator-paymenttype-badge {
    text-indent: initial;
}

.cb-receipt-transaction-detail-header {
    border-bottom: 2px solid #ddd;
}

.cb-grid-delete-popover {
    float: left;
}

.cb-customerinformation-paymentplantransactions {
    margin-bottom: 15px;
}

.cb-account-check-sample-label {
    white-space: nowrap;
}

.cb-datafield-language-header {
    width: 75px;
}

.cb-datafield-language-input {
    width: 100%;
}

.cb-datafield-language-resource {
    width: 100%;
}

.cb-summary-detail-export-button {
    min-width: 0px;
}

.cb-paymenttype-summary-toolbar {
    flex-basis: 100%;
}

.cb-reconciliation-toolbar-datetype {
    width: 150px;
}

.cb-reconciliation-toolbar-ordertype {
    width: 160px;
}

.cb-paymentplan-toolbar-status {
    width: 150px;
    border-color: #dee2e6;
    background-color: #dee2e6;
}

.cb-paymentplan-toolbar-status:hover {
    border-color: #ced4da;
    background-color: #ced4da;
}

.cb-paymentplan-toolbar-status:focus {
    border-color: #dee2e6;
    box-shadow: 0 0 0 0.25rem #21252911;
}

.cb-transactioninformation-editor {
    overflow: auto;
}

.cb-transactioninformation-associated {
    margin-bottom: 15px;
}

.cb-applicationmaintenance-publishmessage {
    padding: 10px;
}

.cb-help-facebook-icon {
    color: #4267b2;
}

.cb-help-x-twitter-icon {
    color: #000;
}

.cb-help-linkedin-icon {
    color: #0077B5;
}

.cb-magtek-currentmode {
    width: 100%;
}

.cb-user-activate {
    width: 100%;
}

.cb-ul-margin-0 ul {
    margin: 0;
}

.cb-toolbar-timezone-dropdown {
    border-color: #dee2e6;
    background-color: #dee2e6;
}

.cb-toolbar-timezone-dropdown:hover {
    border-color: #ced4da;
    background-color: #ced4da;
}

.cb-toolbar-timezone-dropdown:focus {
    border-color: #dee2e6;
    box-shadow: 0 0 0 0.25rem #21252911;
}