#module-referralbyphone-program #idTab1 p{
    color: #414141;
    font-size: 16px;
}



#module-referralbyphone-program #content{
    padding:0px;
    border: none;
}

#referralbyphone-program-content {
    display: flex;
}

.s_vouchers, .success{
    border: none;
    padding: 15px;
    margin-bottom: 15px;
    padding-left: 12px;
    border-left: solid 3px #92d097;
    background-color: #ddf0de;
    position: relative;
}

.s_vouchers, .success{
    border: none;
    padding: 15px;
    margin-bottom: 15px;
    padding-left: 12px;
    border-left: solid 3px #92d097;
    background-color: #ddf0de;
    position: relative;
}

.s_vouchers, .warning{
    border: none;
    padding: 15px;
    margin-bottom: 15px;
    padding-left: 12px;
    border-left: solid 3px rgb(241, 229, 188);
    background-color: rgb(251, 242, 212);;
    position: relative;
}


.s_vouchers i {
    color: #92d097;
    font-size: 34px;
}

.text_green{
    color: #229800;	
    line-height: 3;
    padding: 0 24px;
}

.reff_way{
    padding-bottom: 10px
}

.reff_way i{
    padding-right: 10px;
    width:25px;
    color: #92d097;
    font-size: 16px;

}

.reff_way i.material-icons{
    font-weight: bold;	
}

.s_vouchers_content{
    display: inline-block;
    padding-left: 14px;
    vertical-align: top;
    padding-top: 6px;
}

.profile-usermenu .nav {
    margin-bottom: 14px;
    padding-left: 0;
    list-style: none; }
.profile-usermenu   .nav:before, .nav:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */ }
.profile-usermenu .nav:after {
    clear: both; }
.profile-usermenu .nav > li {
    position: relative;
    display: block; }
.profile-usermenu .nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px; }
.profile-usermenu .nav > li > a:hover, .profile-usermenu .nav > li > a:focus {
    text-decoration: none;
    background-color: #eeeeee; }
.profile-usermenu .nav > li.disabled > a {
    color: #999999; }
.profile-usermenu .nav > li.disabled > a:hover, .profile-usermenu .nav > li.disabled > a:focus {
    color: #999999;
    text-decoration: none;
    background-color: transparent;
    cursor: not-allowed; }
.profile-usermenu .nav .open > a, .profile-usermenu .nav .open > a:hover, .profile-usermenu .nav .open > a:focus {
    background-color: #eeeeee;
    border-color: #777; }
.profile-usermenu .nav .nav-divider {
    height: 1px;
    margin: 8px 0;
    overflow: hidden;
    background-color: #e5e5e5; }
.profile-usermenu .nav > li > a > img {
    max-width: none; }

.profile-usermenu .nav-tabs {
    border-bottom: 1px solid #ddd; }

.tab-content > .tab-pane,
.pill-content > .pill-pane {
    display: none; }

.tab-content > .active,
.pill-content > .active {
    display: block; }

.hidden{
    display: none;
}

#referral_rules_link{
    text-decoration: underline;
} 

#ref_link {
    padding-bottom: 14px;
    margin-top: 14px;
} 

#ref_link .fancybox {
    padding: 14px;
    line-height: 3;
    color: #fff;
    margin-bottom: 14px;
    background: #F39C11;
    cursor: pointer;
}  

#ws_referral_tabs {border-bottom:1px solid #acaaa6; }

#module-referralbyphone-program .tabs .tab-pane {
    padding-top: 1rem;
}  

#module-referralbyphone-program .footer_links li {list-style: none; margin-top: 14px;} 

.share_url { display: block;}

.panel {
    margin-bottom: 24px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
    padding-bottom: 14px;
}

.panel-heading {
    font-size: 20px;
    height: 50px;
    padding: 12px 0 0 20px;
}


.panel-warning {
    background: #f6f6f6;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid #DADADA;
    color: #0A5AA1;
}

.referral_voucher {
    border: 1px dashed #000;
    margin: 24px 14px;
    width: 100%;
    display: flex;
    float: left;
}

.referral_voucher_save {
    flex: 1 1 45%;
    background: #e33d3d;
    text-align: center;
    color: #fff;
    padding: 15px;
}

.referral_voucher_save b {
    font-size: 24px;
    line-height: 2;
}

.referral_voucher_code {
    padding: 15px 20px;
    flex: 1 1 55%;
}

.referral_voucher_code b {
    font-size: 24px;
    line-height: 2;	
}

.referral_voucher_panel > small {clear: both;}

#statistic_tab{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

#statistic_tab b{
    font-size: 24px;
    line-height: 2
}

#statistic_tab i{
    color: #fff;
    opacity:0.4;
    position: absolute;
    bottom: 4px;
    right: 4px;
    font-size: 66px;
}

#total_frinds_tab, #total_orders_tab, #total_loyalty_tab {
    background: #4cc0c1;
    color: #fff;
    margin-right: 34px;
    padding: 14px 70px 20px 31px;
    position: relative;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
}

#total_orders_tab {
    background: #f05050;
}

#total_loyalty_tab {
    background: #fa8564;
}

.footer_links {
    clear: both;
}

.referral_voucher_panel .panel-content > small {
    display: block;
    clear: both;
}

.ws_discount_code {
    padding: 14px;
    background: #f62f8a;
    width: 150px;
    text-align: center;
    margin-top: 14px;
    margin-bottom: 14px;
    color: #fff;
}

.sponsor_fields {
    width: 40%;
    margin: 0 6px;
    max-width: 170px;
}

.sponsor_name_block {
    display: flex;
}

#module-referralbyphone-share #content-wrapper h1{
    text-align: center;
    font-size: 46px;
    font-weight: 500;
    margin-top: 24px;
    margin-bottom: 34px;	
}

#btnRefereeRegister {
    background-color: #f62f8a;
    color: white;
    font-size: 18px;
    padding: 0.7rem 2rem;
}

#ws_share_img{
    float: left;
    margin-bottom: 24px;
    margin-right: 24px;
}

.isInvSent{
    color: #f62f8a;
}

.ws_coupon-left{float:left;     margin-top: 5px;}
.ws_coupon-right{float:right; text-align: center;}

.ws_coupon-expiry {
    background: rgba(255, 0, 0, 0.4); /* Light red background */
    font-size: 12px;
    padding: 2px 5px;
    color: white; /* Ensure the text is readable */
    border-radius: 3px; /* Optional for rounded corners */
    margin-top: 5px; /* Space between the code and expiry date */
    display: inline-block; /* To keep it compact */
}

.ws_coupon{
    overflow: hidden;
    margin: 0 0 20px;
    background: #000;

    color: #fff;
    padding: 20px;
    font-size: 16px;
    border: 2px dashed #fff;
    box-shadow: 0 0 0 4px #000, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
}

.ws_coupon:first-child{
    margin-left:0px;
}

.ws_coupon-rowed{
    padding: 10px;
    margin-right: 20px;
}
.ws_coupon-code{
    text-transform: uppercase;
    font-family: 'fira sans semibold';
    letter-spacing: 2.5px;
    font-size: 20px;
}

.ws_coupon-reduction{
    display:block;
    font-size: 26px;
    font-weight: bold;
}

.ws_coupon-description{
    display:block;
    font-size:12px;
    margin-top: 15px;
}

.ws_coupon-expiry.available {
    background: rgba(0, 128, 0, 0.4); 
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    display: inline-block;
}

.ws_coupon-expiry.expired {
    background: rgba(255, 0, 0, 0.4);
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    display: inline-block;
    text-decoration: line-through;
}

.datevalid.green{
    color: #2bb32b;  /* Green for more than 6 months */
}
.ws_coupon-expiry.green {
    background: rgba(0, 128, 0, 0.4);  /* Green for more than 6 months */
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    display: inline-block;
}

.datevalid.yellow{
    color: rgba(255, 165, 0, 0.6);
}
.ws_coupon-expiry.yellow {
    background: rgba(255, 165, 0, 0.6);  /* Yellow for more than 1 month */
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    display: inline-block;
}

.datevalid.red{
    color : rgba(255, 0, 0, 0.4);
}
.datevalid.grey { 
    color: gray;
}
.ws_coupon-expiry.red {
    background: rgba(255, 0, 0, 0.4);  /* Red for less than 1 month */
    color: white;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    display: inline-block;
}



.referral_voucher{
    background: none;
    background-image: linear-gradient(45deg, rgba(227, 61, 61, 0.05) 25%, transparent 25%, transparent 50%, rgba(227, 61, 61, 0.05) 50%, rgba(227, 61, 61, 0.05) 75%, transparent 75%, rgba(255, 255, 255,0.1));
    background-size: 50px 50px;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
    border:none;
    margin: 20px 0;
}




/* Coupon Checkboxes */


/*Checkboxes styles*/
input.ws_coup[type="checkbox"] { display: none; }

input.ws_coup[type="checkbox"] + label {
    display: flex;
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    font: 14px/20px 'Open Sans', Arial, sans-serif;
    color: #ddd;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

input.ws_coup[type="checkbox"] + label:last-child { margin-bottom: 0; }

input.ws_coup[type="checkbox"] + label:before {
    content: '';
    display: block;
    width: 25px;
    height: 25px;
    border: 2px solid red;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .6;
    -webkit-transition: all .12s, border-color .08s;
    transition: all .12s, border-color .08s;
}

input.ws_coup[type="checkbox"]:checked + label:before {
    width: 15px;
    top: -5px;
    left: 5px;
    border-radius: 0;
    opacity: 1;
    border-top-color: transparent;
    border-left-color: transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.wc_top_capt{
    font-family: 'fira sans semibold';
    font-weight: normal; 
    margin-bottom:20px;
}

#referral_account h2{
    font-family:'fira sans semibold';
    text-align:center;
    font-size: 24px;
    margin: 30px 0 20px;
}
@media (max-width: 768px){


    #total_frinds_tab, #total_orders_tab{
        width:100%;
          
    margin: 0 0 15px 0;
    padding: 6px 70px 6px 30px;
    }
    
    #statistic_tab{
        margin-left:0px;
    }
        
    #statistic_tab b{
        font-size: 20px;
        line-height: 1.5;
    }
    
    #statistic_tab i{
        font-size:50px;
    }
    #referral_account h2{
        font-size: 16px;
    margin: 20px 0 10px;
    }
}

#ws_errors{ display:none;}
#ws_errors.active{display:block;}



#ambassador_competition,
#athlete_program{
    padding-bottom: 20px;
    border: 2px dashed #000;
    margin-bottom: 20px;
    padding: 20px;
    background: rgba(0,0,0,0.02);
}

#athlete_program{
    border: 2px dashed #f00;
}

#ambassador_competition h2,
#athlete_program h2{
    margin-top:0px;
}
#athlete_program h2:first-child{
    color:#000;
}
#athlete_program h2{

    color: rgba(227, 61, 61, 1);
}

.athlete_program_rules{
    margin:20px 0;
}
    
.ambassador_competition_claim_form{
    text-align:center;
    padding:5px 0;
}




#ambassador_competition .ambassador_progress_bar,
#athlete_program .ambassador_progress_bar{
    position: relative;
    width: 100%;
    height: 35px;
    margin: 20px 0;
    background: none;
    background-image: linear-gradient(45deg, rgba(227, 61, 61, 0.05) 25%, transparent 25%, transparent 50%, rgba(227, 61, 61, 0.05) 50%, rgba(227, 61, 61, 0.05) 75%, transparent 75%, rgba(255, 255, 255,0.1));
    background-size: 50px 50px;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
    
    overflow: hidden;
}

#ambassador_competition .ambassador_progress_bar .progress,
#athlete_program .ambassador_progress_bar .progress{
    height: 35px;
    background: rgba(227, 61, 61, 0.5);
    margin: 0px;
}
#ambassador_competition .ambassador_progress_bar .stats,
#athlete_program .ambassador_progress_bar .stats{
    position: absolute;
    top: 0px;
    text-align: center; 
    width: 100%;
    line-height: 35px;
    font-family: 'fira sans semibold'; 
    font-size: 14px;
}


.ambassador_competition_boxes{
    display: flex;
    flex-wrap: wrap;
    margin:20px 0;
}

.ambassador_competition_boxes .competition_box_item b{
    font-size: 24px;
    line-height: 2
}

.ambassador_competition_boxes .competition_box_item i{
    color: #fff;
    opacity:0.4;
    position: absolute;
    bottom: 4px;
    right: 4px;
    font-size: 66px;
}

.ambassador_competition_boxes .competition_box_item{
    background: #000;
    color: #fff;
    margin-right: 34px;
    padding: 14px 70px 20px 31px;
    position: relative;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.4);
}

.ambassador_competition_boxes a.competition_box_item{
    background:#e33d3d;
}

.ambassador_competition_boxes a.competition_box_item:hover{
    background: #000;
}


@media (max-width: 768px){

    #referral_account{
        padding: 0px 5px !important;
    }
    
    #ambassador_competition,
    #athlete_program{
        padding:5px;
        border-left:0px;
        border-right: 0px;
    }

    .athlete_program_rules{
        margin:10px 0;
    }

    .ambassador_competition_boxes .competition_box_item{
        width:100%;

        margin: 0 0 15px 0;
        padding: 6px 70px 6px 30px;
    }

    .ambassador_competition_boxes .competition_box_item{
        margin-left:0px;
    }

    .ambassador_competition_boxes .competition_box_item b{
        font-size: 20px;
        line-height: 1.5;
    }

    .ambassador_competition_boxes .competition_box_item i{
        font-size:50px;
    }
}



.competitior_ranking .current_customer{
    background-color: #dafdd6 !important;
}

.competitior_ranking{text-align:center;}
.competitior_ranking th{
    text-align: center;
}
.ambass_name{text-align:left !important}
.star-0{color:#C9B037;}
.star-1{color:#D7D7D7;}
.star-2{color:#6A3805;}



.referralprogram-red_button,
.referralprogram-black_button{
    margin:5px;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    font-family: 'fira sans semibold';
    background: #e33d3d;
    display: inline-block;
    position: relative;
    color: #fff !important;
    text-align: center;
    width: auto;
    padding: 0px 15px;
    transition: 0.3s ease !important;
    cursor: pointer!important;
}
.referralprogram-black_button{
    background:#000;
}

.referralprogram-red_button:hover{
    color: #fff;
    background: #000;
}

.referralprogram-black_button:hover{
    color: #fff;
    background: #e33d3d;
}


/* COPY Functionality */

.copy-wrapper{
    margin: 0;
    width: 100%;
    position: relative;
    text-align: center;
    margin: 20px 0 0;
    border: 1px dashed #000;
    border-right: 0;
    border-left: 0;
    padding: 5px 0;
}
.copy-action {
    margin-right: 5px;
    display: inline-block;
    color: #e33d3d;
    font-weight: bold;
    cursor: pointer;
}

.copy-action:hover{
    color:#000;
}


.copy-popup {
    display: none;
    background-color: #333; /* Dark background for visibility */
    color: #fff; /* White text color */
    padding: 6px 12px; /* Some padding */
    position: absolute;
    z-index: 1;
    border-radius: 4px; /* Rounded corners */
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); /* Subtle shadow */


    margin-top: 8px;
}

.copy-popup::before {
    content: "";
    position: absolute;
    bottom: 100%; /* Arrow at the bottom of tooltip */
    left: 50%; /* Centered */
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #333 transparent; /* Arrow with same color as tooltip background */
}

@media (max-width: 768px){
    .copy-wrapper{ 
        font-size: 12px;
    }
}

span.status.annulate{
    display: inline-block;
    padding: 0 0.8125rem;
    margin-right: 1.563rem;
    color: #ffa30d;
}