:root {
    --minimal: #f5f5f5;
    --absolute: #282828;
    --plum: #5a2e98;
    --burgundy: #981e32;
    --gold: #c93;
    --dark-gold: #a08040;
    --main: #8cc63e;
    --main_alpha:#8cc63e1f;
    --second:#353b37;
    --third:#414a42;
}
html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
}
body{
    position: relative;
    background-color: var(--minimal);
    /*padding-bottom: 40px;*/
    /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; */
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.75rem;
    line-height: 18px;
    color: #333333;
}

.cyn-pay-page .main-wrapper{
    margin-bottom: 65px;
}
/*headers*/
.h3{
    font-weight: 600;
    font-size: 1.313rem;
}
.h1,.h2,.h3,.h4,.h5,.h6{
    margin: 9px 0;
    font-family: inherit;
    font-weight: bold;
    line-height: 1.125rem;
    color: inherit;
    text-rendering: optimizelegibility;
}
.h1,.h2,.h3{
    line-height: 2.25rem;
}
form label{
    font-weight: 600;
}
/*Headers End*/
/*Typography*/
p{
    margin: 0 0 0.5625rem;
}
/*Typography end*/
.base-home{
    background-color: #fff;
}
a:hover{
    text-decoration: none;
}
i.fa, a i.fa,button i.fa{
    margin-right:5px
}
#notification-message ul{
   padding-left:10px;
    list-style: none;
    width: 90%;
}
#notification-message ul li{
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
}
#notification-message .alert-visible{
    display: flex;
}
#notification-message .alert span.close-notification{
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
}
#notification-message .alert span.close-notification i{
    line-height: 1.2;
}
.ht-navbar{
    width: 100%;
    min-height: 40px;
    padding-right: 20px;
    padding-left: 20px;
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
    background-repeat: repeat-x;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
    zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}
.ht-navbar img{
    width: auto !important;
    height: auto !important;
    max-height: 60px !important;
    /*padding: 5px 20px 7px 0;*/
}
.ht-navbar .container-fluid{
    padding-right: 0;
    padding-left: 0;
}
.ht-menu{
   font-size: 1rem;
}
.ht-menu a{
    color:#515151;    
    border-bottom: 2px solid transparent;
}
.ht-menu a:hover{
    color:var(--main);
    border-bottom: 2px solid var(--main);
}
.ht-menu li+li{
   margin-left:10px;
}
.ht-menu li.nav-item-notify{

}
.ht-menu li.nav-item-notify span{
    padding:10px;
    font-size: 0.8rem;
    color:#333;
    text-shadow: none;
}
.ht-menu li.nav-item span{
    color:#F68E14;
}
.email-verification-status, .phone-opted_in-status{
    display: inline-block;

}

.email-verification-status i,.phone-opted_in-status i{
    margin-left: 1px;
    margin-right:1px;
}
.ht-menu li.nav-item div.email-verification-status{
    padding:0.5rem 1rem;
}
.ht-menu li.nav-item .email-verification-status > span, .email-verification-status > span{
    color:#c72525 ;
}
.ht-menu li.nav-item .email-verification-status.verified > span, .email-verification-status.verified > span, .phone-opted_in-status.verified > span{
    color:#1e9739;
}
label[for="email"] .email-verification-status{

}

.ht-navbar .nav li{
    width:auto;
}

.error:focus{
    color: #b94a48 !important;
    border-color: #b94a48 !important;
    background-color: #fff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(185, 74, 72,0.25);
}
.main-wrapper{
    min-height: calc(100% - 80px);
    display: flex;
    width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}
.admin-sidebar {
    width: 300px;
    vertical-align: top;
    z-index: 2;
    background: #efefef;
    border-right: 1px solid #d7d7d7;
    position: relative;

}
/*Sidebar Start*/
.sidebar a {
    outline: 0 none;
    text-decoration: none;
}

.sidebar a:hover,
.sidebar a:focus {
    text-decoration: none;
    outline: 0 none;
}
.sidebar-user-info .sidebar{
    padding: 32px 20px;
    background-color: var(--second);
    border-bottom: 1px solid #999;
    /* border-top: 1px solid #fff; */
    list-style: none;
    color: var(--main);
}

.sidebar-user-info .sidebar li+li{

    margin-top:10px;
}
.sidebar-user-info .sidebar li i{
    font-size: 15px;
    margin-right:10px;
}
.sidebar-user-info .sidebar li:first-child span{
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    text-shadow: 0 0 3px #222;
}
.sidebar-user-info .sidebar li:last-child span{
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-shadow: 0 0 3px #222;
}
ul.sidebar{
    width: 100%;
    background: #e4e4e4 none repeat scroll 0 0;
    display: block;
   /* border-bottom: 1px solid #cccccc;*/
    /*border-top: 1px solid #fefefe;*/
    margin: 0;
    padding: 0;
}
ul.sidebar li a{
    border-bottom: 1px solid #b4b4b4;
    border-top: 1px solid #fff;
    color: #3b3b3b;
    display: block;
    font-size: 13px;
    font-weight: 500;
    padding: 14px 18px 13px 15px;
    /*text-shadow: 1px 1px 0 rgb(0 0 0 / 30%);*/
    white-space: nowrap;
    border-left: 4px solid transparent;
}
ul.sidebar li.parent a:hover {
    background-color: #d8d8d8;
}
ul.sidebar li.parent a i {
    font-size: 14px;
    margin-right: 7px;
    text-align: center;
    width: 20px;
}
ul.sidebar li.parent a span.ht-menu-item {
    display: inline-block;
    text-shadow: 0 0 2px #222;
}
ul.sidebar li.parent.active a {
    background-color: #d8d8d8;
    border-left: 4px solid var(--main);
}
ul.sidebar li.parent.active a i {
    color: var(--main);
}
ul.sidebar li ul {
    list-style: none;
    background-color: var(--third); /*#414a42;*/
    margin: 0;
    padding: 1px 0 0;
}
ul.sidebar .parent ul li {
    background-color: var(--second);/*#323d33;;*/
    list-style: outside none none;
}
ul.sidebar .parent ul.ht-sub-menu li a {
    border: none;
    background-color: var(--second);
    font-size: 11px;
    padding: 7px 18px 7px 55px;
    color:#fff;
    border-left: 4px solid transparent;
}
ul.sidebar .parent ul.ht-sub-menu li+li{
    margin-top:1px;
}
ul.sidebar .parent ul li a:hover,
ul.sidebar .parent ul li.active a,
ul.sidebar .parent ul li.active a:hover {
    background-color: var(--main_alpha); /*#414a42;*/
    border-left:4px solid var(--main);
    color:var(--main);
}
.ht-sub-menu-text-item{
    color:#fff;
    padding:5px 10px;
}
.sidebar-banner{
   background-color:#efefef;
    position:relative;
    margin:0 5px;
}
.sidebar-banner >ul{
    margin-bottom: 0;
}
.sidebar-banner ul{
    list-style: none;
    padding:10px;
    width:100%;
}
.sidebar-banner ul li:first-child{
    font-weight: 500;
    text-transform: uppercase;
}

.sidebar-banner ul li img{
    width: 100%;
    max-width: 100%;
    height: auto;
}
.sidebar-banner .banner-list{
    margin:0;
    padding: 0;
}
.sidebar-banner .banner-list li:not(:first-child){
   display: none;
}
.sidebar-banner .banner-list li{
    visibility: visible;
    position: absolute;
}
.sidebar-user-info,.main-sidebar,.sidebar-banner{
    z-index:100;
}

.sidebar-ht-logo-container{
    position: absolute;
    bottom:0;
    z-index: -50;
    width:100%;
    opacity:0.3;
}
.sidebar-ht-logo-container ul{
    list-style: none;
    padding: 0;
}
.sidebar-ht-logo-container ul li{
   text-align: center;
    color:#5e5e5e;
}
.sidebar-ht-logo-container ul li p{
    margin-bottom: 0;
}
.sidebar-ht-logo-container ul li:first-child span{
   text-transform: uppercase;
}
.sidebar-ht-logo-container ul li+li{
    margin-top:10px;
}
.sidebar-ht-logo-container .img-container{
    padding-bottom: 10px;
    border-bottom: 2px solid #999;
    display: inline-block;
}
/*Sidebar end*/

.admin-sidebar.collapse.in {
    display: flex;
    flex-direction: column;
    flex: 1;
    max-width: 250px;
    min-width: 250px;
}

.admin-sidebar.admin-sidebar-mobile.collapse.in {
    display: block;
}
#main-content {
    display: flex;
    vertical-align: top;
    padding: 0;
    position: relative;
    flex-direction: column;
    flex: 6;
    /* margin-left: 216px;*/
}
#main-content .card{
   border-radius: 5px;
}
/*Buttons Start*/

.btn-primary {
    background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
    background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
    background-image: -o-linear-gradient(top, #0088cc, #0044cc);
    background-image: linear-gradient(to bottom, #0088cc, #0044cc);
    background-repeat: repeat-x;
}
.btn-primary:hover {
    background-image: -moz-linear-gradient(top, #006ea5, #002f90);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#006ea5), to(#002f90));
    background-image: -webkit-linear-gradient(top, #006ea5, #002f90);
    background-image: -o-linear-gradient(top, #006ea5, #002f90);
    background-image: linear-gradient(to bottom, #006ea5, #002f90);
}
.btn-light{
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cecdcd;
}
.btn-light:hover {
    background-image: -moz-linear-gradient(top, #fcfcfc, #d5d5d5);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fcfcfc), to(#d5d5d5));
    background-image: -webkit-linear-gradient(top, #fcfcfc, #d5d5d5);
    background-image: -o-linear-gradient(top, #fcfcfc, #d5d5d5);
    background-image: linear-gradient(to bottom, #fcfcfc, #d5d5d5);
    border: 1px solid #cecdcd;
}
.btn-success{
    background-image: -moz-linear-gradient(top, #62c462, #51a351);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));
    background-image: -webkit-linear-gradient(top, #62c462, #51a351);
    background-image: -o-linear-gradient(top, #62c462, #51a351);
    background-image: linear-gradient(to bottom, #62c462, #51a351);
    background-repeat: repeat-x;
}
.btn-success:hover {
    background-image: -moz-linear-gradient(top, #62c462, #418741);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#418741));
    background-image: -webkit-linear-gradient(top, #62c462, #418741);
    background-image: -o-linear-gradient(top, #62c462, #418741);
    background-image: linear-gradient(to bottom, #62c462, #418741);
}

.btn-warning{
    background-image: -moz-linear-gradient(top, #fbb450, #f89406);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fbb450), to(#f89406));
    background-image: -webkit-linear-gradient(top, #fbb450, #f89406);
    background-image: -o-linear-gradient(top, #fbb450, #f89406);
    background-image: linear-gradient(to bottom, #fbb450, #f89406);
    background-repeat: repeat-x;

    color:#fff;
    border: 1px solid #d48d00;

}
.btn-warning:hover{
    color: #fff;
    border: 1px solid #d48d00;
    background-image: -moz-linear-gradient(top, #f89406, #f89406);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f89406), to(#f89406));
    background-image: -webkit-linear-gradient(top, #f89406, #f89406);
    background-image: -o-linear-gradient(top, #f89406, #f89406);
    background-image: linear-gradient(to bottom, #f89406, #f89406);
}
.btn-danger{
    border-color: #bd362f #bd362f #802420;
    background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
    background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
    background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
    background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
    background-repeat: repeat-x;
}
.btn-danger:hover{
    background-image: -moz-linear-gradient(top, #eb4c47, #922c26);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eb4c47), to(#922c26));
    background-image: -webkit-linear-gradient(top, #eb4c47, #922c26);
    background-image: -o-linear-gradient(top, #eb4c47, #922c26);
    background-image: linear-gradient(to bottom, #eb4c47, #922c26);
}
.btn-danger:hover{

}
.btn{
    text-shadow: 0 1px 1px rgb(100 100 100 / 20%);
    line-height: 18px;
    font-size: 12px;
    padding: 4px 12px;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

/*Buttons End*/
div.alert *{
    margin:0;
}
.alert-light{
    background-color: #f3f3f3;
}
.page-head {
    background: #fff;
    box-shadow: 0 2px 3px 0 rgb(0 0 0 / 5%);
    position: relative;
    border-bottom: 1px solid #cfcfcf;
    padding: 20px 25px;
    margin-bottom: 20px;
}
.payment-methods-list{
    list-style: none;
    padding:0;
}
.payment-methods-list li+li{
    margin-top: 10px;
}
.payment-methods-list li:hover div.pay-method{
    background: #fefefe;
    border: 2px solid #36bb42;
    box-shadow: 0 1px 2px 2px #58df64;
    cursor:pointer;
}
.payment-methods-list li.active div.pay-method{
    background: #fefefe;
    border: 2px solid #36bb42;

}
.pay-method{
    justify-content: space-between;
    width: 100%;
    align-items: center;
    padding: 10px 20px;
    display: flex;
    height: 100px;
    border:1px solid #d7d7d7;
    border-radius: 5px;
}
.select-payment-type{
    display: flex;
    align-items: center;
    justify-content: start;
}
.select-payment-type label{
    font-weight: 700;
}
.select-payment-type select{
    margin-left:0.5rem;
}
.cc-frame-wrapper{
    position: relative;
    left: 0;
    width: auto;
    max-width: 550px;
    top: 0;
    height: auto;
    margin:0 auto;
    /*margin: 0 20px;*/
}
.cc-frame-wrapper iframe{
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    position: relative;
}
.modal-dlg .card-body .validation-message.alert-danger p{
   color:#721c24;
    font-weight: 600;
}
/*modals or dialogs styles*/
.modal-dlg{
    background-color: #fff;
    top:50px !important;
}
.modal-dlg .card{
    text-transform: none;
    background-color: #f8f8f8;
    border: none;
}
.ui-dialog { z-index: 10010 !important ;}
.modal-dlg .ui-dialog-titlebar{
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.modal-dlg .ui-dialog-titlebar .ui-dialog-title{
    font-size: 1.3rem;
    line-height: 1.2;
}
.modal-dlg .ui-dialog-titlebar .ui-dialog-titlebar-close{
    display:none;
}
.modal-dlg .ui-dialog-buttonpane{
    border-top: 1px solid #d7d7d7;
}
.ui-widget-overlay.ui-front{
    background-color: rgba(0,0,0,0.5);
}
.modal-dlg .card-body p{
    font-size: 14px;
    color: #b7b7b7;
}
.payment-method-selected{
    display:flex;
    justify-content: space-between;
}

.payment-method-selected label{
    font-size: 1rem;
    font-weight: 600;
}
.payment-method-selected span{
    font-size: 1rem;
    color: #569f0b;
    font-weight: 600;
}
.spinner-group{
    position: relative;
    display:flex;
    justify-content: space-around;
}
.ht-loader{
    background-color: #0086ff;
}
.action-btn{
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.default-payment-method-content{

}
.default-payment-method-content ul{
    display: flex;
    justify-content: left;
    flex-wrap: nowrap;
    align-items: baseline;
    list-style: none;
    margin:0 0 5px 0;
    padding:5px 0;
}
.default-payment-method-content.confirm-payment ul{
    justify-content: left;
}
.default-payment-method-content ul li label{
    font-size:13px;
    font-weight: 600;
    color:#ff9200;
}
.default-payment-method-content ul li{
    display:inline;
}
.default-payment-method-content ul li:first-child{
    margin-right:10px;
}
.default-payment-method-content ul li:not(:first-child){
    font-size: 15px;
}
.default-payment-method-content ul li:not(:first-child) span {
    color:#333;
    margin-right:5px;
}
.default-payment-method-content ul li+li:not(:nth-child(2)):before{
    content:"|";
    margin:0 5px;
}
.close-payments-content{
    padding:20px 10px;
}
/*Popover agreement content*/
.agreement-details{
   width:100%;
   min-width:250px;
}
.agreement-details ul{
    list-style: none;
    padding:0;
    margin: 0;
}
.agreement-details ul li{
    display:flex;
    justify-content: space-between;
    align-items: stretch;
    flex: none;
}
.agreement-details ul li:not(:nth-child(4)) span.item-text{
    text-transform: lowercase;
}
.agreement-details ul li label{
   font-weight: 600;
}
.separator{
    flex: auto;
    display: block;
    height: 1px;
    border: none;
    border-bottom: 1px dotted;
    margin-top: 40px;
    margin-bottom: 10px;

}
.separator.sep-default {

    margin: 12px 2px;
    border-color: #aeaeae;
}
.separator.sep-sm {
   
}


.multi-due-dates{
    list-style: none;
    padding: 0;
    margin: 0;
}
.multi-due-dates li{
    display: flex;
    justify-content: right;
}
.multi-due-dates li label{
    font-weight: 600;
    margin-right: 10px;
    white-space: nowrap;
}
.multi-due-amounts{
   list-style: none;
    padding:0;
    margin:0;
}
.multi-due-amounts li{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0.5rem;
}
.multi-due-amounts li span{
    margin-left:10px;
}
.ht-one-pay-terms-btn{
    font-size: 0.5em;
    color: #239ac1;
    text-decoration: underline;

}
.multi-due-amounts.chk-box-ctrl li{
    margin-bottom: 0.81rem;
}
#ht-one-pay-terms h2{
    /*background-color: #f3f3f3;
    border-bottom: 1px solid #d7d7d7;*/
    padding:0 5px;
    /*margin-bottom:10px !important;*/
}
#ht-one-pay-terms li:last-child{
    border-top: 1px solid rgb(215, 215, 215);
    padding-top: 10px;
}
.ht-one-pay-terms-btn:before{
    content: '#';
    margin-right:5px;
}
#ht-one-pay-terms{
   list-style: none;
    padding:0;
    margin: 0;
}
.payment-info-list{
    list-style: none;
    padding:0;
    margin:0;
}
.payment-info-list li{
    display:flex;
    justify-content: left;
}
.payment-info-list li span+span{
    margin-left:10px;
}
.payment-info-list li span{
    font-weight: 600;
    color:#999;
}
#payment-method-create{
position: relative;
}
#payment-method-create label{
    white-space: nowrap;
    font-size:0.7rem;
}
#payment-method-create .card-body{
    padding:0;
}
#payment-method-create #payment-method-ctrl{
    list-style: none;
    padding: 0;
    margin: 0 auto;
}
/*#payment-method-create #payment-method-ctrl > li:first-child{
   margin-left:45px;
}*/
.loader-wrapper{
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 50%;
    left: 0; 
    background: #2a2a2a55;
    width: 100%;
    display: flex;
    text-align: center;
    height: 100vh;
    color: #FFF;
    transform: translateY(-50%);
    z-index: 99999;
     visibility: hidden;
}
.loader-wrapper.show-loader,.inner-loader-wrapper.show-loader{
    visibility: visible;
}
.inner-loader-wrapper{
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 0;
    background: #fff;
    width: 100%;
    display: flex;
    text-align: center;
    height: 100%;
    color: #333;
    transform: translateY(-50%);
    visibility: hidden;
}

#auto-pay-enrolled .form-control{
    width:100%;
}
#method-payment option span+span{
   margin-left:5px;
}
.tbl-action-separator::before{
   content: "|";
    margin:0 5px;
}
.badge {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.badge-success {
    background-color: #468847;
}

.badge-danger {
    background-color: #b94a48;
}

.badge-warning {
    background-color: #f89406;
}

.badge-due {
    background-color: #AA0000;
}
.badge-disabled {
    background-color: #dddddd;
}

.badge-light{
    color: #212529;
    background-color: #f8f9fa;
}

.disallow {
    color: #cc5555;
}
.table-striped tbody tr.odd{
    background-color: #f9f9f9 !important;
}
.table-striped tbody tr.even{
    background-color: #fff !important;
}
.table tbody tr td:last-child{
    border-right:1px solid #ddd;
}
.table.table-bordered :last-child tr:last-child td {
    border-bottom: 1px solid #dddddd;
}
.auto-pay-action-buttons button+button{
   margin-left: 10px;
}
/*Recurrence dialog*/

.main-menu li.active, .main-menu li:hover{
   background:#478c3c;
    color:#fff;
}

.scheduler-controls{
    /*width: 100%;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;*/
    min-width: 300px;
    width:auto;
    list-style: none;
    padding: 0;
    margin:0 auto;
}
.scheduler-controls > li{
    margin-bottom:20px;
}

.scheduler-controls > li:nth-child(2), .scheduler-controls > li:nth-child(1){
    display:flex;
    justify-content: center;
}
.scheduler-controls > li:nth-child(1){
    flex-direction: column;
    align-items: center;
}
.scheduler-keypad{
    margin:0 auto;
}
.scheduler-keypad-holder{
    width:100%;
}
.scheduler-keypad-holder ul.week-numbers{
    list-style: none;
    display: flex;
    justify-content: left;
    flex-wrap: nowrap;
    padding: 0;
    margin-bottom: 10px;
}

.scheduler-keypad-holder ul.week-numbers li{
    flex-direction: row;
}
.scheduler-keypad-holder ul.week-numbers li+li{
    border-left:1px solid #dfdfdf;
}
.scheduler-keypad-holder ul.week-numbers li label{
    padding-right: 16px;
    margin: 0;
    
}
.scheduler-keypad-holder ul.week-numbers li:not(:first-child){
    width:17%;
    text-align: center;
}
.scheduler-keypad-description div{
    font-size: 0.7rem;
    font-weight: 600;
    background: #efefe4;
    margin: 5px 0;
    padding: 5px 0;
}
.scheduler-manager .main-menu{
   list-style: none;
    padding:0;
}
.scheduler-manager .main-menu li{
    display:inline-block;
    padding:5px 10px;
    cursor:pointer;
}
.scheduler-manager .main-menu li+li{
    border-left:1px solid #dfdfdf;
}
.scheduler-items-pad{
    display:flex;
    justify-content: left;
    flex-wrap: wrap;
    border-top:1px solid #d7d7d7;
    border-left:1px solid #d7d7d7;
}
.scheduler-items-pad.single{
    width:250px;
    margin:0 auto;
}
.scheduler-items-pad .scheduler-pad-item{
    padding:15px;
    flex-grow: 1;
    width: 35%;
    text-align: center;
    border: 1px solid #d7d7d7;
}
.scheduler-items-pad.scheduler_month_days .scheduler-pad-item,.scheduler-items-pad.scheduler_semi_month .scheduler-pad-item{
    padding: 6px;
    flex-grow: 1;
    width: 15%;
    text-align: center;
}
.scheduler-pad-item + .scheduler-pad-item, .scheduler-pad-item:first-child{
   border-top:none;
    border-left:none;
}
.scheduler-pad-item.disabled{
    background-color: #e6e6e6;
    color:#999;
}
.scheduler-pad-item:not(.disabled).active,.scheduler-pad-item:not(.disabled):hover{
    background:#478c3c;
    color:#fff;
}
.scheduler-keypad-sub-menu-holder{
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin:20px 0;
}
.scheduler-keypad-sub-menu-holder li{
    display: inline-block;
    text-align: center;
    padding: 5px 6px;
    margin:0;
    cursor:pointer;
}

 .scheduler-keypad-sub-menu-holder li+li{
    border-left:1px solid #dfdfdf;
}
 .scheduler-keypad-sub-menu-holder.disabled li:not(:first-child),
 .scheduler-keypad-sub-menu-holder.disabled li:not(:first-child):hover{
    color:#c4c4c4;
    cursor: default;
    background: none;
}
 .scheduler-keypad-sub-menu-holder li.active, .scheduler-keypad-sub-menu-holder li:hover{
    background:#478c3c;
    color:#fff;
}
.scheduler-view-box{
    display: block;
    background-color: #ebebeb;
    padding: 5px;
    border-bottom: 1px solid #d1cece;
}
.scheduler-items-pad.scheduler_once{
   border:none;
}
.scheduler-once-ctrl{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    width: 100%;
    justify-content: center;
}
.scheduler-once-ctrl span{
    margin-right:10px;
}

.week-numbers li:not(:first-child).active,.week-numbers li:not(:first-child):hover{
    background:#478c3c;
    color:#fff;
}
.remove-btn{
    cursor: pointer;
}
.remove-btn i{
    color: #b40707;
}
#scheduler_result{
    display: flex;
    justify-content: left;
    align-items: baseline;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0 10px;
}
.scheduler-content{
    display:flex;
    justify-content: space-between;
    align-items: center;
}
.scheduler-content ul{
    list-style: none;
    padding:0;
    margin:0;
}
.scheduler-content li{

}
.scheduler-content li span{
    white-space: nowrap;
}
.scheduler-content li span+span{
    margin-left:5px;
}
.scheduler-content .remove-btn{
    margin-left:10px;
}
.global-payment{
    min-height: 810px;
}
/*Login screen Start */
.logo-wrapper{
    display:flex;
    align-items: center;
    justify-content: center;
    height: 230px;
    margin-bottom: 20px;
}
.logo-wrapper img{
   max-height:230px;
    width:auto;
}
.login-panel{
    padding: 10px;
    background-color: #f0f0f0;
    border: 1px solid #d7d7d7;
    border-radius: 8px;
    box-shadow: 0 1px 8px #999;
}

.login-panel ul{
    padding:0;
    list-style: none;
}
.login-panel ul li{
    padding:5px 10px;
}
.login-panel ul li label{
    font-size: 13px;
    font-weight: 600;
}
.login-panel ul li p{
    font-size: 0.9em;
    font-weight: 400;
}
.login-panel ul li .additional-text{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    padding: 5px 10px;
    border: 1px solid #d7d7d7;
    border-radius: 5px;
}
.login-panel ul li .additional-text span{
    font-size: 0.9em;
    font-weight: 600;
}
.login-panel ul li .additional-text a{
    white-space: nowrap;
}
.login-panel .sign_in-btn{
    padding: 10px;
    font-size: 18px;
}
.login-panel div:first-child ul li:last-child{
    text-align: center;
}
.login-panel ul.error-notice li{
    text-align: left !important;
    padding:0;
}
.login-panel p{
    margin-bottom:2px;
    line-height: 1rem;
}
.ht-copy{
    display: flex;
    justify-content: right;
    align-items: center;
    margin-top:10px;
}
.ht-copy span{
    text-transform: uppercase;
    color:#999;
    font-size:0.8em;
}
.ht-copy a{
    margin-left:10px;
    outline: none;
}
/*Login screen End*/
/*Register screen Start*/
.footer-button-wrapper{
    width:100%;
    border-top:1px solid #d7d7d7
}
.footer-buttons{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 20px;
    border-top: 1px solid #fff;
}
.footer-buttons .btn+.btn{
   margin-left:10px;
}
.form-register label{
    font-weight: 600;
}
/*Register screen End*/
.thank-you-message span{
    margin:20px;
    display: block;
}
.thank-you-message i{
   font-size: 25px;
    color: #0f7d0f;
}
.olp-closed{
    background-color: #fff3cd;
    border-color: #ffeeba;
}
.olp-closed .alert{
   margin:0;
}
.olp-closed ul li .fa{
    font-size: 30px;
}
.olp-closed a.btn{
    margin-top:20px;
}
.olp-closed-ctx{
    list-style:none;
}
.olp-closed-ctx i.fa{
    font-size: 4rem;
    color: #e50000;
}
.olp-closed-ctx li+li{
    margin-top:10px;
}
.olp-closed-ctx li strong{
    text-transform: uppercase;
}
.olp-closed-notice{
    display: flex;
    justify-content: left;
    align-items: center;
}
.olp-closed-notice i.fa{
    font-size: 2rem;
    color: #a80909;
    margin-right:10px;
}
.cynpay-notifications-wrapper{
    border:1px solid #fff;
    width:100%;
}
.cynpay-notifications{
    background-color: rgb(61 61 61 / 63%);
    width: 100%;
    padding: 50px 0;
    border: none;
}
.cynpay-notifications #terminal-timer{
font-size: 50px;
padding: 20px 0;
}
.errors-warning{
    width:100%;
    margin-top:20px
}
.errors-warning li{
    color: #883737;
}
.errors-warning li i{
   font-size: 1.3rem ;
}
.cynpay-screen-btns{
    position: fixed;
    bottom: 0;
    padding: 20px 10px;
    z-index: 1001;
    background-color: #f0f0f0;
    width: 100%;
    display: flex;
    justify-content: right;
    align-items: center;
    border-top: 1px solid #dfdfdf;
    box-shadow: 0 3px 13px #999;
}
.user-profile{
}
.user-profile ul:not(.pagination){
    list-style: none;
    padding:0;
}
.user-profile ul:not(.pagination) li.form-section{
    font-weight: 600;
    font-size: 14px;
    padding:10px 5px;
    background-color: #eeeeee;
    border-bottom: 1px solid #dfdfdf;
}
.user-profile ul:not(.pagination) > li+li{
    margin-top:10px;
}
.verified-pin{
   
}
.verified-pin .verified-pin-ctrl{
    display: flex;
    align-items: center;
}
.verified-pin .verified-pin-ctrl a{
    margin-left: 10px;
}
.verified-pin .form-check{
    display: flex;
    margin-bottom: 0.5rem;
}
.verified-pin .form-check label{
    white-space: nowrap;
}
.verified-pin .form-check .form-check-input{
      margin-top:0.15rem
}
.pin-verification{
    margin-top: 1.6rem;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: baseline;
}
.pin-verification a{
    white-space: nowrap;
}
.scheduler-date{
    display: flex;
    align-items: baseline;
    gap:1rem;
}
.scheduler-amount-ctrl{
    display: flex;
    align-items: baseline;
    gap:1rem;
}
.billing-history-invoice{
    list-style: none;
    padding: 0 10px;
    margin: 0;
}
.billing-history-invoice li:nth-child(2){
    font-size: 11px;
    color:#9a9a9a;
}
.billing-history-invoice li:first-child span+span{
    margin-left:10px;
}
.billing-history-invoice li:first-child span label{
    font-weight: 600;
    margin-right:5px;
    margin-bottom: 0;
}
.transaction{}
.transaction-success{
    color:#468847;
}
.transaction-warning{
    color:#f89406;
}
.transaction-danger{
    color:#b94a48;
}
.billing-history-link{
    color:#333;
}

.was-validated .form-control:invalid, .form-control.is-invalid{
    background-image: none;
    padding-right: 0;
}

.payment-status span.badge{
    padding: 7px 10px;
    cursor: pointer;
}
  /*Table*/
table {
    max-width: 100%;
    background-color: transparent;
    border-spacing: 0;
}
table.table.table-bordered thead tr {
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
    background-repeat: repeat-x;
}
.table {
    margin-bottom: 1.125rem;
}

.table-bordered {
    border-collapse: separate;
    border: 0;
}

.table th {
    border-top: 0;
}

.table th,
.table td {
    background-clip: padding-box;
    border-bottom: 0;
    border-right: 0;
    padding: 0.5rem;
}
.table td.action-buttons{
    white-space: nowrap;
}
.table td.action-buttons a+a{
   margin-left:5px;
}

.table.table-bordered thead th {
    border-top: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    border-right: 0;
    border-bottom-width: 1px;
}

.table thead:first-child tr:first-child th:first-child {
    border-top-left-radius: .25rem;
}

.table.table-bordered thead:first-child tr:first-child th:last-child {
    border-top-right-radius: .25rem;
    border-right: 1px solid #dddddd;
}

.table thead tr:last-child th,
.table :last-child tr:last-child td {
    border-bottom: 0;
}

.table.table-bordered tr td:last-child,
.table.dataTable tr td:last-child,
table.table-bordered.dataTable th,
table.table-bordered.dataTable td {
    border-right: 1px solid #dddddd;
}

.table.dataTable tr:first-child th {
    border-left: 0;
}

.table.dataTable tr th:first-child,
.table.dataTable tr td:first-child {
    border-left: 1px solid #dddddd;
}

.table.table-bordered :last-child tr:last-child td {
    border-bottom: 1px solid #dddddd;
}

.table :last-child tr:last-child td:first-child,
.table thead:last-child tr:last-child th:first-child {
    border-bottom-left-radius: .25rem;
}

.table :last-child tr:last-child td:last-child,
.table thead:last-child tr:last-child th:last-child {
    border-bottom-right-radius: .25rem;
}
.amountcol {
    text-align: left !important;
    width: 11% !important;
}
.agrcol {
    text-align: left !important;
    width: 18% !important;
}
.ddcol {
    text-align: left !important;
    width: 12% !important;
}
.paycol {
    text-align: center !important;
    width: 5% !important;
}
.cell-tiny{
    width:15px;
}
.amountcol span,
.agrcol span {
    display: none;
}
.amountcol:after {
    content: attr(title);
}
.agrcol:after {
    content: attr(title);
}
#filter-table{
    visibility: hidden;
    display: none;
}
.filters-container{
    
}
.filters-container ul{
    list-style: none;
    padding:0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.filters-container ul li+li{
    margin-left:10px;
}
.filters-container ul li:first-child label{
    margin-bottom:0.2rem;
}
.filter-complex-inline{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.filter-complex-inline *+*{
    margin-left:10px;
}
#history th{
   vertical-align: middle;
}
#history>thead .sorting:before, #history>thead .sorting:after{
    display:inline-block;
    bottom:unset;
}
#history thead tr{
    background:none;
}
#history thead{
    background-color: #fafafa;
    background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
    background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
    background-repeat: repeat-x;
}
/*Table End*/
.api-config{
    list-style: none;
    padding:0;
    margin:0;
    display: inline-block;
}
.api-config li+li{
    margin-top:3px;
}
.api-config li label{
    font-weight: 600;
    margin-right: 5px;
}
/*Gateway panel*/
.gateway-container,.box-container{
    display: flex;
    justify-content: left;
    align-items: stretch;
    flex-flow: row wrap;
}
.box-container{
    justify-content: center;
}
.box-container .card{
    margin-right:20px;
    margin-top:20px;
    max-width:350px;
}
.box-container{
    margin-bottom: 30px;
}
.box-container .card-header small{
   font-style: italic;
    color:#999;
}
.box-container .card-body{
    display: flex;
    justify-content: center;
    align-items: center;
}
.gateway-plate{
   margin-right:20px;
    margin-top:20px;
    width:350px;
}
.gateway-plate:not(.gateway-plate-disabled){
    box-shadow: 0 0 5px rgb(151 150 150 / 50%);
}
.gateway-plate .card-header{
    display:flex;
    justify-content: space-between;
    align-items: center;
}
.gateway-plate .card-body ul{
    padding:0;
    list-style: none;
}
.gateway-plate .card-body ul li{
    padding:3px 5px;
}
.gateway-plate .card-body ul .gateway-plate-item{
    font-size:15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.gateway-plate .card-body ul .gateway-plate-item label{
       font-weight: 600;
}
.gateway-plate .card-body ul .gateway-plate-item span{

}
.gateway-plate .card-body ul .gateway-plate-item-text{
    font-weight: 600;
    background-color:#d7d7d7;

}
.gateway-plate .card-body ul .gateway-plate-sub-item-text{
    font-weight: 500;
    background-color: #fefefe;

}
.gateway-plate .card-body ul .gateway-plate-sub-item{
    padding:3px 0;
}
.gateway-plate .card-body ul .gateway-plate-sub-item label{
    font-weight: 500;
    margin-right: 10px;
}
.gateway-plate .card-body ul .gateway-plate-sub-item span{
    font-weight: 400;
}
.gateway-plate.gateway-plate-disabled{
   background-color: #f9f9f9;
}
.gateway-plate.gateway-plate-disabled{
   color:#bababa
}
.gateway-plate .card-body ul .gateway-plate-item.status span.badge{
    text-transform: uppercase;
    padding:5px 10px;
}
/*End Gateway panel*/
.btn-file {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}
/*Media*/
/*Marketing*/
.media-container{

}
#media-container .media-item{
    margin-top:20px;
    margin-bottom: 20px;
}
.media-img-box{
    margin:0 auto;
    background-color:#d0d0d0;
    color:#fff;
    position: relative;
    background-size:cover;
    outline: none;
    padding:10px;
    cursor: pointer;
    height: 100%;
}
.media-img-wrapper{
    width:100%;
    height:100%;
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: #ebebeb;
}
.media-img-box img{
    display: block;
    width: 100%;
}
.media-loading-container{
    position: absolute;
    color: #fff;
    width: 100%;
    height: 100%;
    background-color: rgba(30, 30, 30, .65);
    overflow: hidden;
    z-index: 100;
    margin: -10px;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
}
.media-loading-container.show-loader{
    visibility: visible;
}
.media-fileUpload-input {
    display: block;
    visibility: hidden;
    width: 0;
    height: 0;
}
.media-img-box-action{
    padding:5px 0;
}
.media-img-box-action a{
    cursor: pointer;
}
.media-img-box-action a+a{
    margin-left:5px;
}
.media-img-box-action a:before{
    content: " | ";
    color:#333;
    margin-right:5px;
}

/*End Marketing*/
/*Reports*/
.report-chart-header{
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    margin: 20px 0;
}
.ct-chart-payments{
    position:relative;
}
.ct-bar-label{
    font-size:0.7rem;
    font-weight: 600;
}
.ct-bar-label.ct-bar-label-vertical{

}
#week-day-chart-container .ct-chart-bar.ct-chart-payments .ct-series line,#payment-chart-container .ct-chart-bar.ct-chart-payments .ct-series line{
    stroke-width: 15px;
}
.ct-chart-bar.ct-chart-payments .ct-series.ct-series-a line,.ct-chart-line.ct-chart-payments .ct-series.ct-series-a .ct-line{
   stroke:#3d933e;
}
.ct-chart-bar.ct-chart-payments .ct-series.ct-series-b line, .ct-chart-line.ct-chart-payments .ct-series.ct-series-b .ct-line{
    stroke:#f4c63d;
}
.ct-chart-bar.ct-chart-payments .ct-series.ct-series-c line,.ct-chart-line.ct-chart-payments .ct-series.ct-series-c .ct-line{
    stroke:#d70206;
}.ct-chart-bar.ct-chart-payments .ct-series.ct-series-a text{
     fill: #1e4f1f;
 }
.ct-chart-bar.ct-chart-payments .ct-series.ct-series-b text{
      fill: #cb8611;
  }
.ct-chart-bar.ct-chart-payments .ct-series.ct-series-c text{
    fill: #d70206;
}


.ct-chart-line.ct-chart-payments .ct-series.ct-series-a .ct-point{
    stroke: #136216;
}
.ct-chart-line.ct-chart-payments .ct-series.ct-series-b .ct-point{
    stroke: #7c6520;
}
.ct-chart-line.ct-chart-payments .ct-series.ct-series-c .ct-point{
    stroke: #75090b;
}
.ct-chart-line.ct-chart-payments .ct-series.ct-series-a .ct-point-label{
    stroke: #136216;
}
.ct-chart-line.ct-chart-payments .ct-series.ct-series-b .ct-point-label{
    stroke: #a68520;
}
.ct-chart-line.ct-chart-payments .ct-series.ct-series-c .ct-point-label{
    stroke: #75090b;
}
.ct-chart-legend ul{
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}
.ct-chart-legend ul li+li{
    margin-left: 20px;
}
.ct-chart-legend ul li label{
    font-size: 12px;
    font-weight: 600;
}
.ct-chart-legend .ct-chart-legend-success{
    padding: 5px;
    background-color: #3d933e;
}
.ct-chart-legend .ct-chart-legend-refund{
    padding: 5px;
    background-color: #f4c63d;
}
.ct-chart-legend .ct-chart-legend-declined{
    padding: 5px;
    background-color: #d70206;
}
/*End Reports*/
/*Widgets*/
.ht-widgets-container{
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-direction: row;
    flex-wrap: wrap;
}
.widget-filters{
    position: relative;
z-index:10;
    margin-left:20px;
}
.ht-widgets-container .widget-card{
    margin:20px;
    padding: 10px;
    width:47%
}

.ht-widget-container-a .widget-card{
   width:45%;
}

.ht-widgets-container .widget-card .widget-header{
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    padding:20px 10px;
}

.ht-widgets-container .widget-card-extended{
    margin:20px;
    padding: 10px;
    width:30%;
    min-width: 200px;
}
.widget-card-extended .show-chart{
    cursor: pointer;
    color: #0678a9;
}
.widget-card-extended .show-chart:hover{
    color: #06a909;
}
.widget-card-extended .widget-card-header{
    display:flex;
    background: #f2f2f2;
    align-items: baseline;
    padding: 10px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border: 1px solid #d7d7d7;
    font-weight: 600;
}
.widget-card-extended .widget-card-header span.chart-time-description{
    margin-left:5px;
}
.widget-card-extended .widget-card-body{
  /*  position: relative;*/
}
.widget-card-extended .widget-card-body .popup-chart-value{
    position: absolute;
    background: #fff;
    border: 1px solid #d7d7d7;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 1px 2px 4px #ddd;
}
.widget-card-extended .widget-card-body .popup-chart-value ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.widget-card-extended .widget-card-body .popup-chart-value ul li{
    display: flex;
    align-items:center;
    justify-content: space-between;
    font-size: 1rem;
}
.widget-card-extended .widget-card-body .popup-chart-value ul li span:last-child{
    font-weight: 600;
}
.widget-card-extended .widget-card-body .popup-chart-value.popup-success{
    color:#3d933e
}
.widget-card-extended .widget-card-body .popup-chart-value.popup-warning{
    color:#de7408;
}
.widget-card-extended .widget-card-body .popup-chart-value.popup-danger{
    color:#d70206;
}
.widget-card-header div:first-child{
    flex-grow: 2;
    font-size: 0.9rem;
}
.widget-card-header div:last-child i.fa{
    font-size: 1rem;
}

.ct-chart-pie .ct-label{
   font-weight: 600;
    fill:#666;
}
.legend-pie{
    min-height: 42px;
}

#payment-status-chart-container .ht-pie-type.ht-type-status-success .ct-slice-pie{
    stroke: #3d933e;
    fill:#3d933e;
}
#payment-status-chart-container .ht-pie-type.ht-type-status-failed .ct-slice-pie{
    stroke:#d70206;
    fill:#d70206;
}
#payment-status-chart-container .ht-pie-type .ht-pie-slice-label{
    visibility:hidden ;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s ease-in;
}
#payment-status-chart-container .ht-pie-type.active-node .ht-pie-slice-label{
    visibility: visible;
    opacity: 1;
}
#payment-status-chart-legend,#payment-env-chart-legend{
    position: relative;
    z-index: 10;
    list-style: none;
    text-align: center;
    padding:0;
    margin:0 auto
}
#payment-status-chart-legend li,#payment-env-chart-legend li{
    position: relative;
    padding-left: 23px;
    margin-right: 10px;
    margin-bottom: 3px;
    cursor: pointer;
    display: inline-block;
}
#payment-status-chart-legend li:before, #payment-env-chart-legend li:before{
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    content: '';
    border: 3px solid transparent;
    border-radius: 2px;
}
#payment-status-chart-legend .ht-type-status-success:before{
    background-color:#3d933e;
    border-color: #3d933e;
}
#payment-status-chart-legend .ht-type-status-failed:before{
    background-color:#d70206;
    border-color: #d70206;
}
#payment-env-chart-legend .ht-env-o:before,#payment-env-chart-container .ht-env-o .ct-slice-pie{

    background-color: #d9c6a7;
    border-color: #d9c6a7;
    stroke:#d9c6a7;
    fill:#d9c6a7;
}
#payment-env-chart-legend .ht-env-s:before,#payment-env-chart-container .ht-env-s .ct-slice-pie{
    background-color:#de7408;
    border-color: #de7408;
    fill:#de7408;
    stroke:#de7408;
}
#payment-env-chart-legend .ht-env-p:before,#payment-env-chart-container .ht-env-p .ct-slice-pie{
    background-color:#555ec4;
    border-color: #555ec4;
    fill:#555ec4;
    stroke:#555ec4;
}
#payment-env-chart-legend .ht-env-c:before,#payment-env-chart-container .ht-env-c .ct-slice-pie{
    background-color:#3b7a92;
    border-color: #3b7a92;
    fill:#3b7a92;
    stroke:#3b7a92;
}
#payment-env-chart-legend .ht-env-a:before,#payment-env-chart-container .ht-env-a .ct-slice-pie{
    background-color:#c2bf5b;
    border-color: #c2bf5b;
    fill:#c2bf5b;
    stroke:#c2bf5b;
}
#payment-env-chart-container .ht-pie-env .ht-pie-slice-label{
    visibility:hidden ;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s ease-in;
}
#payment-env-chart-container .ht-pie-env.active-node .ht-pie-slice-label{
    visibility: visible;
    opacity: 1;
}
.ct-chart-pie{
    text-align: center;
}
.legend-pie{
    max-width: 350px;
}
.sub-header-content{
    list-style: none;
    padding:10px;
    font-size: 14px;
    margin:0;
}
.sub-header-content li{
    /*display: inline-block;*/
}
.sub-header-content li label{
    margin-right: 10px;
    font-weight: 600;
}
/*.sub-header-content li span{
    color:#666;
}*/
.sub-header-content li span.badge{
   /* color:#fff;*/
    padding:5px;
}
.tor-transaction .ui-dialog-title{
    color: #6d0f0f;
}
.history-paid-highlight{
    background-color: #def9e4;
    font-weight: 600;
}
.recurring-table-header{
    width:50px;
}
.recurring-check{
    font-size: 18px;
    color:#0f7d0f;
}
.recurring-uncheck{
    font-size: 18px;
    color: #7d0f0f;
}
/*#d70206*/
/*End Widgets*/
/*Call to action*/
.cta p{
   margin:10px 0;
}
/*End Call to action*/

.fade:not(.show){
    visibility: hidden;
}
.error .error-notice li+li{
    margin-top:0;
}
.system-config{
    width:100%;
    height:500px !important;
    resize:none;
}
.cynpay-screen-btns{
    display: flex;
    --gap: 12px;
    flex-wrap: wrap;
    margin: calc(-1 * var(--gap)) 0 0 calc(-1 * var(--gap));
    width: calc(100% + var(--gap));
}
.cynpay-screen-btns > *{
    margin: var(--gap) 0 0 var(--gap);
}

.email-white-list-message{
    color:#666;
    font-weight: 500;
}
.email-white-list-message span{
    color:var(--main)
}
.ht-article{
    width:100%;
    margin:20px 0;

}
.ht-article .ht-article-title{
}
.ht-article .ht-article-title ul, .ht-article .ht-article-footer ul{
    display: flex;
    margin: 0;
    padding:0;
    list-style: none;
    justify-content: space-between;
    align-items: center;

}
.ht-article .ht-article-footer ul{
    margin-top:10px;
}
.ht-article .ht-article-title ul li h1{
    padding-left:10px;
}
.ht-article .ht-article-footer{

}
.ht-article .ht-article-body{
    padding:15px 10px;
}
.ht-line {
    height: 1px;
    width: 100%;
    border-top: 1px solid #fefefe;
    border-bottom: 1px solid #d9d9d9;
}
.ht-report-footer ul{
    justify-content: right;
}
.email-verification ul li{
    text-align: center;
}
.email-verification ul li span.user-email{
    color:var(--main);
}
#send-verification-code{
    padding-right:15px;
}
#send-verification-code i.fa{
    visibility: hidden;
}
.ht-inline-btn{
    display: flex;
    justify-content: start;
    align-items: end;
}
.ht-inline-btn button{
    padding:9px 10px;
}
.list-info-container{
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 20px;
}
.list-info-container .list-info{
  background: #f6f6f6;
}
.list-info h5{
    background: #ebebeb;
    padding: 10px 20px;
    border-bottom: 1px solid #cecccc;
}
.list-info h6{
    padding: 10px 20px;
    background: #efefef;
    border-bottom: 1px solid #d7d7d7;
}
.list-info h6 i.fa-check-circle{
    color: var(--main);
}
.list-info h6 i.fa-question-circle{
   color: #c28307;
}
.list-info h6 i.fa-exclamation-triangle{
    color: #c2070d;
}
.list-info ul{
    list-style: none;
    padding: 10px 20px;
}
.list-info ul li{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.list-info ul li label{
    font-weight: 600;
}
.no-data-notice{
    padding: 10px 20px;
    text-align: center;
}
.no-data-notice span{
    font-size: 1rem;
    font-weight: 500;
    color: #650707
}
.user-phones-list{
    list-style: none;
    padding:0;
    margin:0;
}
.user-phones-list li{
    display: flex;
    justify-content: start;
    align-items: baseline;
    gap:1rem;
}
.user-phones-list li label{
    white-space: nowrap;
    font-size: 0.8rem;
    font-weight: 500;
    color: #555;
    margin: 0;
}
.user-phones-list li span{
    font-size: 0.9rem;
    font-weight: 400;
    white-space: nowrap;
}
.export-btn-container{
padding-bottom: 10px;
}
.transaction-type-refunded{
    color:#e0a800;
}
.export-btn-container .dt-buttons{
    float: right;
}
.buttons-csv{
    background: #263979;
    padding:5px 20px
}
.buttons-csv:hover{
    background: #2b408a;
}
.buttons-csv span{
    color:#fff;
}
.small-fee-tip{
    font-size: 0.7rem;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.small-fee-tip strong:first-child{
    margin-right: 5px;
}
.small-fee-tip strong{
    font-weight: 600;
}
.widget-text-content{
    list-style: none;
    display: flex;
    flex-direction: column;
    width:100%;
    flex-wrap: wrap;
    padding:10px 0;
}
.widget-text-content li{
    padding: 2px 5px;
    display: flex;
}
.widget-text-content li+li{
    margin-bottom: 3px;
}
.widget-text-content li label{
    font-weight: 600;
    font-size: 0.8rem;
    margin-right:5px;
}
.widget-text-content li span:last-child{
    font-size: 0.8rem;
}

.fee-info{
    list-style: none;
    display: flex;
    flex-direction: column;
    height:135px;
    width:100%;
    flex-wrap: wrap;
    padding:0;
}
.fee-info li{
    padding: 2px 20px 2px 5px;
    display: flex;
}
.fee-info li+li{
    margin-bottom: 3px;
}
.fee-info li label{
    font-weight: 600;
    font-size: 0.8rem;
    margin-right:5px;
}

.fee-info li span:last-child{
    font-size: 0.8rem;
}
.fee-info li span.badge{
    line-height: 1.5;
}
.time-selector{
    display:flex;
    justify-content: flex-start;
    align-items: baseline;
}
.time-selector label{
    white-space: nowrap;
    margin-right: 10px;
}

.cron-holder .week-controls{
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: baseline;
    column-gap: 1rem;
    padding:0;
}
.cron-holder .week-controls li{
    display: flex;
    justify-content: center;
    align-items: baseline;
    column-gap: 1rem;
}
.cron-holder .week-controls li label{
white-space: nowrap;
    font-weight: 600;
}
.cron-holder .monthly-controls{
    list-style: none;
    padding: 0;
    width: 65%;
    margin:0 auto;
}
.cron-holder .monthly-controls li{
    padding:2px 0;
}
.cron-holder .monthly-controls li+li{
    margin-top:2px;
}
.cron-holder .monthly-controls li ul{
    list-style:none;
    padding:0;
}
.cron-holder .monthly-controls li.monthly-date-to-pay ul li span{
    flex-grow: 1;
}
.cron-holder .monthly-controls li ul li{
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    column-gap: 1rem;
}

.cron-holder .monthly-controls li ul li div#by-week-control, .cron-holder .monthly-controls li ul li div#by-week-control span{
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    column-gap: 1rem;
    flex-grow: 1;
}
.cron-holder .semimonthly-container{
    display: flex;
    justify-content: center;
    column-gap:1rem;
    align-items: baseline;
    flex-flow: wrap;
}
.cron-holder .semimonthly-container ul{
    list-style: none;
    padding:0;
    margin:0;
}
.cron-holder .semimonthly-container ul li+li{
    margin-top:10px;
}
.cron-holder .semimonthly-container ul li.semimonthly-day-header{
    font-weight: 600;
    font-size: 0.8rem;
    text-align: center;
}
.scheduler-controls .dates-wrapper{
    display:flex;
    flex-direction: column;
    align-items: center;
}
.scheduler-controls li#amount-container{
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 0.5rem;
}

.change-status{
    padding:5px 10px;
}
.user-table-column-format{
    list-style: none;
    padding:0;
    margin:0;
}
.user-table-column-format li+li{
    margin-top:5px;
}
.user-table-column-format li:last-child span{
    color: #7c816e;
    font-weight: 500;
}
#payment-accepted .card-body .alert small{
    display: block;
    margin-top:10px;
    font-style: italic;
}
.toggle-sidebar-container{
    margin-top: -20px;
    margin-bottom: 20px;
    padding: 10px;
    background: #fff;
    border-bottom: 1px solid #cfcfcf;
    box-shadow: 0 2px 3px 0 rgb(0 0 0 / 5%);
    display: flex;
    justify-content: end;
}
.toggle-sidebar-container button{
    outline: none;
    border: 1px solid #999;
}
#sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(155, 155, 155, 0.5);
    z-index: 1049;
}
body.sidebar-open #sidebar-overlay {
    display: block;
}
.toggle-sidebar-container{
    visibility: hidden;
}
@media (min-width: 992px) {
    .default-payment-method-content ul{
        justify-content: right;
    }
}
@media (max-width: 992px) {
    .ui-dialog{
        width: 90% !important;
    }
}
@media (max-width: 950px) {
    .toggle-sidebar-container{
        visibility: visible;
    }
    .admin-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        background: #fff; /* adjust to match your theme */
        transform: translateX(-100%);
        z-index: 1050;
    }
    /* When open, slide in */
    .admin-sidebar.open {
        transform: translateX(0);
    }

}