:root {
    --primary: #0B0B45;
}

a {
    color: var(--primary);
}

.card-token {
    background-image: linear-gradient(45deg, #0B0B45 0%, #4040a9 100%);
}

.card-title {
    color:  var(--primary);
}

h1, h2, h4, h5 {
    color: var(--primary);
}


.topbar {
    background: var(--primary);
    position: relative;
    z-index: 1003;
}

.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}

.btn-info {
    background: var(--primary);
    border-color: var(--primary);
}

.btn-success {
    background: #E1F3D8;
    border-color: #E1F3D8;
    color: #67C23A;
}

.total-amount-lead {
    color: var(--primary);
}


.bonus-base {
    background: var(--primary);

}


.bonus-extra-item:before {
    background: #67C23A;

}

.pay-option-check:checked ~ label {
    border-color: #67C23A;
    background: #fff;
}

.pay-option-label:after {
    background: #67C23A;
}

.popup-body .lead strong, .popup-body .lead span {
    color: var(--primary);
}

.popup-title {
    color: var(--primary);
}

.badge-success {
    background: #CECEDA;
    border-color: #CECEDA;
    color: var(--primary);
}

.navbar-menu>li>a {
    color: var(--primary);
}

.navbar-menu>li>a:before {
    background: var(--primary);
}

.user-status {
    background: var(--primary);
}

.user-status-title {
    color: #ababab;
}

.document-type:checked ~ label {
    border-color:var(--primary);
}


.document-type ~ label:after {
    background:var(--primary);
}

.navbar-menu>li>a:hover, .navbar-menu>li>a:focus, .navbar-menu>li>a:active {
    color: var(--primary);
}

.navbar-menu>li>a:hover, .navbar-menu>li>a:focus, .navbar-menu>li>a:active {
    color: #A8ABB2;
}

.ti-files:before {
    color: var(--primary);
}


.user-thumb {
    background: var(--primary);
}


.user-thumb {
    background: var(--primary);
    border: 1px solid #D2D5DC;
}


.progress-percent:after {
    border: 3px solid #67C23A;
}

.card-token .card-sub-title {
    color: #ffffff;
}


.card-token, .btn {
    border-radius: 12px;
}


.btn-primary:disabled, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-info:disabled, .btn-info:hover, .btn-info:focus, .btn-info:active {
    background: #A8ABB2;
    border-color: #A8ABB2;
}


.card-full-height {
    border-radius: 12px;
}

.card {
    border-radius: 12px;
}


.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}


.data-head .data-col {
    color: var(--primary);
}

.nav-tabs-line .nav-link.active {
    color: var(--primary);
}


.nav-tabs-line .nav-link:after {
    background: var(--primary);
}

.input-switch:checked ~ label:before {
    background: var(--primary);
}


.note-info [class*=fa] {
    color: var(--primary);
}

.note-info p, .note-info .note-text {
    color: var(--primary) !important;
}


.btn {
    padding: 7px 20px;
}


.text-primary {
    color: var(--primary) !important;
}


.input-checkbox ~ label:not(.error):after, .input-radio ~ label:not(.error):after {
    background: var(--primary);
}

.navbar-dropdown:after {
    background: var(--primary);
}


.navbar-dropdown li.active>a, .navbar-dropdown li.current>a, .navbar-dropdown li:hover>a {
    color: var(--primary);
}

.navbar-dropdown li a, .page-nav li.active a, .stage-info-total, .progress-amount, .progress-txt, .stage-info-number small, .stage-info-total{
    color: var(--primary) !important;
}


.table thead th {
    color: var(--primary);
}

.sidebar-nav li a .ikon, .sidebar-nav li a .ti, .sidebar-nav li a .icon {
    color: var(--primary);
}

.dropdown-list li a:hover, .sidebar-nav li a:hover, .sidebar-nav li a.active {
    color: var(--primary);
}

.btn-outline.btn-primary {
    color: #ffffff;
}

.spinner .sp {
    background-color:  var(--primary);
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    background-color:var(--primary);
    border-color: var(--primary);
}


.pay-option-label {
    background: #ffffff;
}


.dashboard-referral .token-balance {
    min-width: 200px;
    margin-bottom: 0;
}

.dashboard-referral .token-balance-icon{
    background: #4d4d8a;
}

.dashboard-referral .texte {
    width: 85%;
    font-size: 14px !important;
    font-weight: 400;
    color: #495463 !important;
}

.dashboard-referral .card-sub-title {
    color: #0b0b45;
    font-weight: 600;
    margin-bottom: 10px;
}

.payment-cancel-btn {
    padding: 7px 20px !important;
}


.payment-cancel-btn:disabled {
    background-color: #ccc; 
    color: #666; 
    cursor: not-allowed;
    opacity: 0.5; 
}

.mb0 {
    padding-bottom: 10px !important;
}

.whatsapp-link {
    position: fixed;
    right: 10px;
    bottom: 20px;
    display: flex;
    align-items: flex-end;
    gap: 0;
    cursor: pointer;
}

.whatsapp-link  .title {
    background: white;
    box-shadow: 0 4px 19px #0000002b;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    font-size: 13px;
    line-height: 21px;
    color: #444;
    padding: 5px 15px;
    max-width: 240px;
    z-index: 100;
    margin-bottom: 5px;
}

.whatsapp-link  .icon {
    width: 55px;
}


@media (min-width: 768px) {

    .page-ath-gfx {
        background: url(../images/ath-gfx.png) var(--primary) no-repeat;
    }
    
}

.footer-bar {
    margin-bottom: 40px;
}

@media (max-width: 1000px) {

    .dashboard-referral .card-innr{
        display: flex;
        flex-direction: column;
    }

    .ref-m-flex {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start !important;
    }

    .dashboard-referral .texte {
        width: 100%;
        text-align: left;
    }

    .footer-bar {
        margin-bottom: 60px;
    }
    
}