:root {
    --ap-title-color: #2E3A59;
}
@font-face {
    font-family: Inter;
    src: url(fonts/inter/Inter-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Inter;
    src: url(fonts/inter/Inter-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Inter;
    src: url(fonts/inter/Inter-SemiBold.woff2) format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Inter;
    src: url(fonts/inter/Inter-Bold.woff2) format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Material Icons Round";
    font-style: normal;
    font-weight: 400;
    src: url(fonts/material-icons/MaterialIconsRound-Regular.woff2) format("woff2");
}
@font-face { font-family: 'Material Icons Round'; font-style: normal; font-weight: 400; src: url('fonts/material-icons/MaterialIconsRound-Regular.woff2') format('woff2'); }
.material-icons-round { font-family: 'Material Icons Round'; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; -webkit-font-feature-settings: 'liga';font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; }

.ap-form-label {
    font-weight: 500;
}

::placeholder{
    color: var(--ap-placeholder-color) !important;
    font-size: var(--ap-place-holder-font-size) !important;    
}

.ap-form-control .el-input__inner::placeholder, .ap-form-control .el-textarea__inner::placeholder, .ap-form-control .el-range-input::placeholder {
    color: var(--ap-front-border-color) !important;
    font-weight: 400;
}

.el-input--large.ap-form-control .el-textarea__inner{
    border-radius: var(--ap-field-radious);
    box-shadow: unset;
}
.ap-form-control input[type=color], .ap-form-control input[type=date], .ap-form-control input[type=datetime-local], .ap-form-control input[type=datetime], .ap-form-control input[type=email], .ap-form-control input[type=month], .ap-form-control input[type=number], .ap-form-control input[type=password], .ap-form-control input[type=search], .ap-form-control input[type=tel], .ap-form-control input[type=text], .ap-form-control input[type=time], .ap-form-control input[type=url], .ap-form-control input[type=week], .ap-form-control select, .ap-form-control textarea, .ap-form-control--number input[type=number] {
    color: var(--ap-front-content-color);
}

.ap-affiliate-creative-img-preview img{
    max-height: 250px;
}
.ap-form-label {
    font-size: var(--ap-subtitle-font-size);
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-content-color);
    font-weight: 400;
}
.ap-main-reg-frm-body.ap-single-form .ap-form-label{
    color: var(--ap-field-label-color);
}
.ap-simple--file-upload .ap-fu__placeholder{
    color:var(--ap-front-content-color);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.ap-combine-field-upload .ap-fu__icon{
    margin-bottom: 12px;
}
.ap-simple--file-upload{
    flex-direction: column; 
    text-align: center;
}
.ap-form-date-range-control{
    padding-left: 0px !important;
}
/* WP Menu Page Icon CSS Over */
.el-button .ap-btn--loader__circles,
.ap-tsd--loader .ap-btn--loader__circles{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: var(--ap-radius-8px);
    align-items: center;
    justify-content: center;
}
.ap-btn--is-loader .ap-btn--loader__circles, .ap-tsd--loader.__ap-is-active .ap-btn--loader__circles {
    display: flex;
}
.ap-table-status-dropdown-wrapper{
    position: relative;
}
.ap-table-status-dropdown-wrapper.__ap-is-loader-active .el-select.ap-form-control{
    opacity: 0.6;
}
.ap-table-status-dropdown-wrapper .ap-tsd--loader{
    position: absolute;
    top: 0;
    left: 1px;
    width: 100%;
    height: 100%;
    border-radius: var(--ap-radius-6px);
    z-index: 1;
    cursor: pointer;
    background-color: rgba(255,255,255,0.55);
}
.el-button .ap-btn--loader__circles div,
.ap-tsd--loader .ap-btn--loader__circles div{
    animation: stretch running 0.5s infinite ease-out alternate;
    border-radius: 50%;
    display: block;
    height: 8px;
    width: 8px;
    animation-delay: .1s;
    margin: 0 4px;
}
.el-button .ap-btn--loader__circles div:first-child,
.ap-tsd--loader .ap-btn--loader__circles div:first-child{
    animation-delay: 0s;
    margin: 0;
}
.el-button .ap-btn--loader__circles div:last-child,
.ap-tsd--loader .ap-btn--loader__circles div:last-child{
    animation-delay: .2s;
    margin: 0;
}
.el-button .ap-btn--loader__circles  div,
.ap-tsd--loader .ap-btn--loader__circles div{
    animation-name: stretch-reverse;
}

.el-button.ap-red-btn .ap-btn--loader__circles  div{
    animation-name: stretch-reverse-red;
}


@keyframes stretch-reverse-red {
    0% {
        transform: scale(.5);
        background-color: rgb(235, 140, 140,0.2);
    }
    50% {
        background-color: rgb(235, 140, 140,0.5);
    }
    100% {
        transform: scale(1);
        background-color: rgba(235, 140, 140, 1);
    }
}
@-webkit-keyframes stretch-reverse-red {
    0% {
        transform: scale(.5);
        background-color: rgba(235, 140, 140, 0.2);
    }
    50% {
        background-color: rgba(235, 140, 140, 0.5);
    }
    100% {
        transform: scale(1);
        background-color: rgba(235, 140, 140, 1);
    }
}

@keyframes stretch-reverse {
    /* 0% {
        transform: scale(.5);
        background-color: rgba(var(--ap-primary-r,255), var(--ap-primary-g,255), var(--ap-primary-b,255), 1);
    }
    50% {
        background-color: rgba(var(--ap-primary-r,255), var(--ap-primary-g,255), var(--ap-primary-b,255), 1);
    }
    100% {
        transform: scale(1);
        background-color: rgba(var(--ap-primary-r,255), var(--ap-primary-g,255), var(--ap-primary-b,255), 1);
    } */
    0% {
        transform: scale(.5);
        background-color: rgba(255, 255, 255, 1);
    }
    50% {
        background-color: rgba(255, 255, 255, 1);
    }
    100% {
        transform: scale(1);
        background-color: rgba(255, 255, 255, 1);
    }
}
@-webkit-keyframes stretch-reverse {
    0% {
        transform: scale(.5);
        background-color: rgba(255, 255, 255, 1);
    }
    50% {
        background-color: rgba(255, 255, 255, 1);
    }
    100% {
        transform: scale(1);
        background-color: rgba(255, 255, 255, 1);
    }
}
@-moz-keyframes stretch-reverse {
    0% {
        transform: scale(.5);
        background-color: rgba(255, 255, 255, 1);
    }
    50% {
        background-color: rgba(255, 255, 255, 1);
    }
    100% {
        transform: scale(1);
        background-color: rgba(255, 255, 255, 1);
    }
}
@-o-keyframes stretch-reverse {
    0% {
        transform: scale(.5);
        background-color: rgba(255, 255, 255, 1);
    }
    50% {
        background-color: rgba(255, 255, 255, 1);
    }
    100% {
        transform: scale(1);
        background-color: rgba(255, 255, 255, 1);
    }
}

.ap-front-loader-container{
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99;
}
.ap-front-loader-container .ap-front-loader{
    width: 77px;
    height: 77px;
    background: url("data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCIgd2lkdGg9Ijg1IiBoZWlnaHQ9Ijg1IiBzdHlsZT0ic2hhcGUtcmVuZGVyaW5nOiBhdXRvOyBkaXNwbGF5OiBibG9jazsgYmFja2dyb3VuZDogcmdiKDI1NSwgMjU1LCAyNTUpOyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnPjxjaXJjbGUgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBmaWxsPSJub25lIiBzdHJva2UtZGFzaGFycmF5PSI1MC4yNjU0ODI0NTc0MzY2OSA1MC4yNjU0ODI0NTc0MzY2OSIgc3Ryb2tlPSIjNjg1OGUwIiBzdHJva2Utd2lkdGg9IjYiIHI9IjMyIiBjeT0iNTAiIGN4PSI1MCI+CiAgPGFuaW1hdGVUcmFuc2Zvcm0gdmFsdWVzPSIwIDUwIDUwOzM2MCA1MCA1MCIga2V5VGltZXM9IjA7MSIgZHVyPSIyLjEyNzY1OTU3NDQ2ODA4NXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiB0eXBlPSJyb3RhdGUiIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSI+PC9hbmltYXRlVHJhbnNmb3JtPgo8L2NpcmNsZT48Zz48L2c+PC9nPjwhLS0gW2xkaW9dIGdlbmVyYXRlZCBieSBodHRwczovL2xvYWRpbmcuaW8gLS0+PC9zdmc+") no-repeat left top; background-size: 100%;
    background-size: 72px auto;
}

/* Register Page Form Start */
.ap-front-creative-container{
    display: flex;
    width: auto;
    font-family: var(--ap-front-primary-font);
    max-width: 100% !important;
    width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;       
}
.ap-main-creative-card-container{
    padding: 30px;
    margin-top: 44px;
    overflow: hidden;
    width: 616px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 2px 24px 0px #7362F914;
    border-radius: var(--ap-radius); 
    min-height: 300px;   
}

.ap-main-creative-card-container .ap-main-reg-frm-body{
    max-width: 100% !important;
}
/* Register Page Form End  */


.ap-main-reg-card-container .ap-main-reg-card-inside{
    width: 100%;
}

/* Register Page Form Start */
.ap-front-reg-container{
    display: flex;
    width: auto;
    font-family: var(--ap-front-primary-font);
}
[v-cloak] .ap-main-reg-card-container,[v-cloak] .ap-vue-main-front-container,[v-cloak] .ap-main-creative-card-container{
    display: none;
}
.ap-main-reg-card-container, .ap-front-loader-container{
    min-height: 500px;
}
.ap-main-reg-card-container div.ap-main-reg-frm-body{
    width: 100%;
}
.ap-acnt-link-forgot{
    text-align: right;
}
.ap-main-reg-card-container{
    padding: 73px 48px 28px 48px;
    margin-top: 44px;
    overflow: hidden;
    width: 616px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--ap-front-cl-white);
    margin-bottom: 44px;
    border: 1px solid var(--ap-gt-gray-700);
}
.ap-main-reg-card-container{
    border-radius: var(--ap-radius);
}
.ap-single-field__form{
    margin-top:24px;
}
.ap-single-field__form .el-form-item{
    display: block;
}
.ap-front-page-title{
    font-size: var(--ap-front-title-font-size);
    font-family: var(--ap-front-primary-font);
    font-weight: 700;
    color: var(--ap-front-title-color);
}
.ap-front-page-sub-title{
    font-weight: 400;
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-content-color);
    font-size: var(--ap-front-subtitle-font-size);
}
.ap-single-form .ap-front-page-title, .ap-single-form .ap-front-page-sub-title{
    text-align: center;
}
.ap-single-form .ap-front-page-sub-title{
    margin-bottom: 48px;
}
.ap-single-form .ap-frm-btn{
    margin-top: 48px;
}
.ap-frm-account-link-upper{
    font-weight: 500;
    font-family: var(--ap-primary-color);
    font-size: var(--ap-front-subtitle-font-size);
    color: var(--ap-front-content-color);
    margin-top: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 24px;
}
.ap-acnt-link{
    font-weight: 500;
    text-decoration: underline;
    font-size: var(--ap-front-subtitle-font-size);
}
.ap-single-field__form .ap-form-label{
    display: inline-flex;
}

.el-checkbox.el-checkbox--large .el-checkbox__inner{
    height: 20px;
    width: 20px;
}

.ap-checkbox-control-single .el-checkbox__label{
    line-height: 24px;
    font-weight: 500;
    display: block;
    color: var(--ap-front-content-color);
    position: relative;
    font-family: var(--ap-front-primary-font);
}
.el-checkbox__input.is-checked + .el-checkbox__label{
    color: var(--ap-front-content-color) !important;
}
.ap-acnt-link:focus,
.ap-acnt-link:hover{
    cursor: pointer;
    color: var(--ap-front-title-color);
}
.ap-default-card{
    background-color: var(--ap-front-cl-white);
    border: 2px solid var(--ap-gt-gray-300);
    border-radius: var(--ap-radius-8px);
    padding: 0;
    position: relative;
}

/* Register Page Form End */
.ap-text--primary-color{
    color: var(--ap-primary-color) !important;
}
.ap-title-text-color{
    color: var(--ap-front-title-color);
}
.ap-text--danger-color{
    color: var(--ap-sc-danger) !important;
}
.ap-text--success-color{
    color: var(--ap-sc-success) !important;
}
.ap-form-full-width-control{
    width: 100% !important;
    height: 54px;
    box-sizing: border-box;
}
/* Registeration Page Form End */
/* Login Page Form Start */
.ap-disp-flex-box{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.ap-single-form .ap-front-page-title{
    margin-bottom: 12px;
}
.ap-custom-checkbox--is-label{
    display: flex;
    align-items: center;
}
.ap-custom-checkbox--is-label .el-checkbox__inner:after {
    border: 2px solid transparent;
    border-left: 0;
    border-top: 0;
    box-sizing: content-box;
    content: "";
    height: 9px;
    left: 7px;
    position: absolute;
    top: 2px;
    transform: rotate(45deg) scaleY(0);
    transform-origin: center;
    transition: transform 0.15s ease-in 0.05s;
    width: 3px;
}
.ap-checkbox-control-single .el-checkbox{
    margin-bottom: 0px !important;
}
.ap-term-condition-box{
    margin-top: 28px;
}
.ap-front-toast-notification{
    position: relative;
    z-index: 5;
    width: calc(100% - 48px);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.ap-front-toast-notification.--ap-success{
	background-color: var(--ap-front-cl-white);
	border-left: 4px solid var(--ap-sc-success);
	box-shadow: 0 4px 12px rgba(114, 124, 149, 0.16);
	padding: 8px 16px;
	border-radius: var(--ap-radius-4px);
	-webkit-animation-name: apFadeInUp;
    animation-name: apFadeInUp;
    animation-timing-function: cubic-bezier(.51,.92,.24,1.15);    
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;    
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.ap-front-toast-notification.--ap-success .bpgc-front-tn-body{
	display: flex;
	align-items: center;
}
.ap-front-toast-notification.--ap-success p{
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	font-family: var(--ap-front-primary-font);
	color: var(--ap-sc-success);
    margin: 0px !important;
    padding: 0px !important;    
}
.ap-front-toast-notification.--ap-error{
    background-color: var(--ap-front-cl-white);
    border-left: 4px solid var(--ap-sc-danger);
    box-shadow: 0 4px 12px rgba(114, 124, 149, 0.16);
    padding: 8px 16px;
    border-radius: var(--ap-radius-4px);
    -webkit-animation-name: apFadeInUp;
    animation-name: apFadeInUp;
    animation-timing-function: cubic-bezier(.51,.92,.24,1.15);    
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;    
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.ap-front-toast-notification.--ap-error .ap-front-tn-body{
    display: flex;
    align-items: center;
}
.ap-front-toast-notification.--ap-error p{
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    font-family: var(--ap-front-primary-font);
    color: var(--ap-sc-danger);
    margin: 0px !important;
    padding: 0px !important;
}
.ap-main-forgot-password-container{
    min-height: 410px;  
}
.ap-vue-main-front-container{
    display: contents;
}

/* Affiliate Panel Design Start Here */
.ap-affiliate-panel-main{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.affiliatepress-affiliate-panel{
    display: flex;
    flex-direction: column;        
    width: 100%;  
    max-width: 1200px;  
} 
.ap-affiliate-panel{
    width: 100%;
    display: flex;
    min-height: 65vh;
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-8px);
    margin-bottom: 34px;
}
.ap-front-reg-container{
    max-width: 100% !important;
    width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;   
    margin-top: 48px; 
}

.el-dialog .el-date-editor.el-input__wrapper,
.ap-panel-detail .ap-affiliat-panel-pading .el-date-editor.el-input__wrapper{
    box-shadow: unset;
    border: 1px solid var(--ap-gt-gray-700);
    height: 40px;
}
.ap-edit-profile-avatar-container .ap-edit-profile-avatar .el-upload.el-upload--text span,
.ap-panel-detail .ap-affiliat-panel-pading .ap-form-control .el-tooltip__trigger,
.ap-affiliate-panel-content .ap-form-control .el-input__wrapper,
.ap-affiliate-panel-content .ap-form-control .el-textarea__inner{
    box-shadow: unset;
    border: 1px solid var(--ap-gt-gray-700);
}
.el-dialog .el-date-editor.el-input__wrapper:hover,
.ap-affiliate-panel-content .el-dialog .ap-affiliate-dialog .el-date-editor.el-input__wrapper:hover,
.el-dialog .ap-form-control .el-select__wrapper.is-focused,
.ap-panel-detail .ap-affiliat-panel-pading .el-date-editor.el-input__wrapper:hover,
.ap-panel-detail .ap-affiliat-panel-pading .ap-form-control .el-tooltip__trigger:hover,
.ap-affiliate-panel-content .ap-form-control .el-input__wrapper:hover,
.ap-affiliate-panel-content .ap-form-control .el-textarea__inner:hover{ 
    background: var(--ap-color-primary-color-opacity-5);
    border: 1px solid var( --ap-front-primary-color );
}
.ap-affiliate-panel-content .ap-form-control .el-input__wrapper:hover .el-input__inner{
    background-color: transparent !important;
}
.el-dialog .el-date-editor.el-input__wrapper:focus-within,
.ap-panel-detail .ap-affiliat-panel-pading .el-date-editor.el-input__wrapper:focus-within,
.ap-panel-detail .ap-affiliat-panel-pading .ap-form-control .el-tooltip__trigger:focus-within,
.ap-affiliate-panel-content .ap-form-control .el-input__wrapper:focus-within{
    background: var( --ap-front-cl-white );
    border: 1px solid var( --ap-front-primary-color );
    box-shadow: 0px 0px 0px 4px var( --ap-color-primary-color-opacity-1 );
}
.ap-affiliate-panel-content .ap-form-control .el-textarea__inner:hover{
    background-color: var(--ap-color-primary-color-opacity-1) !important;
}
.ap-affiliate-panel-content .ap-form-control .el-textarea__inner:focus-within{
    background-color: var( --ap-front-cl-white ) !important;
}

/* Affiliatepress Top Bar Design */

.ap-welcome-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background-color: var(--ap-front-cl-white);
    border-radius: 8px;
    border: 1px solid var(--ap-front-border-color);    
    margin-bottom: 34px;
}
.ap-welcome-text {
    font-size: var(--ap-front-title-font-size);
    font-weight: 600;
    color: var(--ap-front-title-color);
    line-height: 28px;
    font-family: var(--ap-front-primary-font);
}
.ap-filter-icon,
.ap-social-button,
.ap-side-menu-button{
    border: unset;
    padding: unset;
}
.ap-filter-icon:hover,
.ap-social-button:hover,
.ap-side-menu-button:hover{
    background-color: unset;
}
.ap-avatar-container {
    display: flex;
    align-items: center;
}
.ap-avatar-container img {
    border-radius: 50%;
    width: 44px;
    height: 44px;
}
.ap-droup-down-arrow {
    margin-left: 10px;
    cursor: pointer;
}

/* Affiliate Container design */
.ap-affiliate-panel-container {
    display: flex;
    min-height: 65vh;
    width: 100%;
    max-width: 100%;
}
.ap-affiliate-panel-sidebar {
    padding: 48px 32px 32px 32px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;  
    border-right: 1px solid var(--ap-front-border-color);
    background-color: var(--ap-panel-sidebar-color);
}
.ap-affiliate-panel-sidebar a.ap-affiliate-menu-item {
    margin-bottom: 24px;
    font-size: 16px;
    color: var(--ap-front-content-color);
    padding: 12px 20px 12px 20px;   
    display: flex;
    flex-direction: row; 
    align-items: center;
    border-radius: var(--ap-front-radius-8px);
    font-weight: 500;
    font-family: var(--ap-front-primary-font);
    cursor: pointer;
    text-decoration: none;
    max-width: 100%;
}
.ap-affiliate-panel-sidebar a.ap-affiliate-menu-item-active, .ap-affiliate-panel-sidebar .ap-affiliate-menu-item:hover, .ap-affiliate-panel-sidebar a.ap-affiliate-menu-item-active:hover{
    background-color: var(--ap-primary-color);
    color: var(--ap-front-cl-white);
}

.ap-affiliate-panel-sidebar .ap-affiliate-menu-item-active .ap-front-menu-fill,.ap-affiliate-panel-sidebar .ap-affiliate-menu-item:hover .ap-front-menu-fill{
    fill: var(--ap-front-cl-white);
}

.ap-affiliate-panel-sidebar .ap-front-menu-fill:hover{
    fill: var(--ap-front-content-color);
}

.ap-affiliate-menu-item-icon{
    margin-right: 10px;
    display: flex;
    align-items: center;
}
.ap-affiliate-panel-content {
    flex: 1;
    padding-top: 48px;
    padding-bottom: 64px;
    width: calc(100% - 300px);
    background-color: var(--ap-front-cl-white);
    border-top-right-radius: var(--ap-front-radius-8px);
    border-bottom-right-radius: var(--ap-front-radius-8px);
    border-top-left-radius: var(--ap-front-radius-8px);
    border-bottom-left-radius: var(--ap-front-radius-8px);
}
.ap-affiliate-panel-content .ap-affiliat-panel-pading{
    padding-left: 48px;
    padding-right: 48px;
}
.ap-affiliate-panel-content-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
}
.ap-affiliate-panel-content-header h2 {
    margin: 0;
}
.ap-tab-heading{
    font-size: var(--ap-front-main-title-font-size);
    font-weight: 500;
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-title-color);
}
.ap-tf-btn-group {
    display: flex;
    /* justify-content: flex-end; */
}
.ap-front-filter-btn{
    display: flex !important;
    align-items: end;
}
.ap-front-filter-btn .ap-tf-btn-group{
    width: 100%;
}
.ap-table-filter{
    margin-bottom: 35px;
}

/* Table Style Added  */
.el-table{
    --el-table-border-color: var(--ap-front-border-color);
    --el-table-border: 1px solid var(--ap-front-border-color);    
}
.ap-aff-panel-table .el-table__cell{
    padding-top: 13px;
    padding-bottom: 13px;
}
.ap-aff-panel-table thead .el-table__cell .cell{
    font-family: var(--ap-front-primary-font);
    color: var( --ap-front-content-color);
    font-weight: 600;
    line-height: 24px;
    font-size: var(--ap-front-subtitle-font-size);
}
.ap-aff-panel-table tbody .el-table__cell .cell{
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-title-color);
    font-weight: 400;
    line-height: 24px;
    font-size: var(--ap-front-content-font-size);    
}

.ap-pagination{
    margin: 45px 40px 27px;
    align-items: center;
    position: relative;
    font-family: var(--ap-front-primary-font);
}
.ap-pagination-nav {
    display: flex;
    justify-content: flex-end;
}
.ap-pagination-nav .el-pagination.is-background .el-pager li {
    background-color: var(--ap-front-cl-white);
    border: 1px solid var(--ap-front-border-color);
    font-size: var(--ap-front-button-text-size);
    border-radius: var(--ap-radius-6px);
}
.ap-pagination-nav .el-pagination .btn-prev, .el-pagination.is-background .btn-prev:disabled { margin-right: 4px; }
.ap-pagination-nav .el-pagination .btn-prev, .el-pagination.is-background .btn-prev:disabled, .ap-pagination-nav .el-pagination .btn-next, .el-pagination.is-background .btn-next:disabled{
    box-shadow: none;
    background-color: var(--ap-cl-white);
    color: var(--ap-title-color);
    min-width: 16px;
    height: 16px;
}
.ap-pagination-nav .el-pagination .btn-next .el-icon, .ap-pagination-nav .el-pagination .btn-prev .el-icon{
    font-size: 15px;
    font-weight: bold;
}
.ap-pagination-nav .el-pagination.is-background .el-pager li.is-active{
    background-color: var(--ap-front-primary-color);    
}
.ap-pagination-left,.ap-pagination-left p{
    color: var(--ap-front-content-color);
    font-size: var(--ap-front-subtitle-font-size);
}
.ap-pagination-left strong{
    color: var(--ap-front-title-color);
    font-weight: 500;
}

/* Button Min Height Set Here */
.el-button {
    min-height: 42px;
}

/* Dashboard design add */
.ap-cards-container {

}
/*
.ap-cards-container .el-row{
    width: 100%;
}
*/
.ap-box-card{    
    font-family: var(--ap-front-primary-font);
    border: 1px solid var(--ap-front-border-color) !important;
    box-shadow: 0px 4px 24px 0px var(--ap-front-header-box-shadow) !important;
    border-radius: var(--ap-front-radius-12px);
    min-height: 100px;
    margin-bottom: 24px;
}
.ap-box-card .header{
    font-family: var(--ap-front-primary-font);
    font-size: var(--ap-front-subtitle-font-size);
    color: var(--ap-front-content-color);
    font-weight: 400;
    line-height: 24px;
}
.ap-box-card-value{
    font-weight: 600;
    font-family: var(--ap-front-primary-font);
    font-size: var(--ap-subheading-font-size);
    color: var(--ap-front-title-color); 
    margin-top: 7px; 
}
.ap-box-card-flex {
    display: flex;
    align-items: center;
}
.ap-box-right{
    margin-left: 12px;
}
.ap-affiliate-panel-content .el-card__body{
    padding: 22px 20px;
}
.ap-dash-user{
    color: var(--ap-front-content-color);
    font-size: var(--ap-subtitle-font-size);
    font-weight: 400;
    margin-bottom: 32px;
}
.ap-commission-rate-color{
    background-color: var(--ap-color-primary-color-opacity-5);
    border-color: var(--ap-color-primary-color-opacity-5) !important;
}
.ap-commission-cookie-color{
    background-color: var(--ap-cookie-box-yello-color);
    border-color:var(--ap-cookie-box-yello-color) !important;
}

.ap-program-detail-card .header{
    color: var(--ap-front-title-color);
    font-weight: 600;
}
.ap-program-detail-card .ap-box-card-value{
    color: var(--ap-front-content-color);
    font-size: var(--ap-front-medium-text-size);
}
.ap-program-detail-card .ap-box-card-value b{
    font-weight: bold;
}
.ap-box-payment-cards{
    margin-top: 30px;
}
.ap-box-payment-cards .ap-tab-heading{
    margin-bottom: 20px;
}
/* Affliate Link Design Start Here */
.ap-tab-detail-txt{
    color: var(--ap-front-title-color);
    font-size: var(--ap-subtitle-font-size);
    font-weight: 400;
    line-height: 24px;
    font-family: var(--ap-front-primary-font);
    margin-bottom: 15px;
    margin-top: 20px;
}
.ap-default-link-field-heading{
    margin-top: 20px;
    margin-bottom: 5px;
}
.ap-front-copy-field{
    position: relative;
}
.ap-copy-button{
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 1;
    right: 0;    
}
.ap-copy-button .ap-btn__label{
    font-weight: normal;
}
.ap-btn__icon{
    display: flex;
    align-items: center;
    justify-content: center;
}
.ap-affiliate-generated-link-header{
    display: flex;
    justify-content: space-between;
}
.ap-affiliate-link-table{
    margin-top: 13px;
}
.ap-affiliate-link-table .el-table{
    font-family: var(--ap-front-primary-font);
}
.ap-affiliate-link-table thead tr th .cell{
    font-size: var(--ap-front-subtitle-font-size);
    color: var(--ap-content-color);
    font-weight: 600;
    line-height: 24px;
}
.ap-affiliate-link-table .cell{
    padding-top: 5px;
    padding-bottom: 5px;
}
.ap-affiliate-link-table tbody .cell{
    font-size: var(--ap-front-content-font-size);
    color: var(--ap-front-title-color);
    font-weight: 500;
    line-height: 24px;
}
.ap-tax-link-copier{    
    border-radius: var(--ap-front-radius-6px);
    background-color: var(--ap-front-color-primary-light-10);
    position: relative;
    border: 1px solid var(--ap-front-color-primary-light-5);
    max-width: 100%;
}
.ap-tax-link-copier .ap-copy-txt-btn{
    display: none;
}
.ap-tax-link-copier:hover{
    border-color:var(--ap-front-color-primary-light-5);
}
.ap-tax-link-copier:hover .ap-copy-txt-btn,
.ap-tax-link-copier:focus .ap-copy-txt-btn {
    display: flex;
    width: 100%;
}
.ap-tax-link-copier .ap-copy-data{
    min-height: 25px;
    display: flex;
    align-items: center;
    padding: 4px 16px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--ap-front-mobile-text-size);
    font-family: var(--ap-front-primary-font);
    font-weight: 500;
}
.ap-tax-link-copier:hover .ap-copy-data{
    visibility: hidden;
}
.ap-copy-txt-btn{
    min-height: auto !important;
    line-height: normal !important;
    padding: 6px 16px 6px 16px !important;
    min-height: 20px !important;
    position: absolute;
    height: 100%;
    top: 0;
    width: 100%;   
    border-radius: var(--ap-front-radius-4px); 
}
.ap-affiliate-dialog-header{
    display: flex;
    justify-content: space-between;
    position: relative;
}
.ap-dialog-close{
    position: absolute;
    right: 20px;
    top: 20px;   
    cursor: pointer;     
}
.ap-affiliate-dialog .el-dialog__close{
    display: none;
}
.ap-affiliate-dialog-subtitle{
    color: var(--ap-front-content-color);
    font-size: var(--ap-front-content-font-size);
    font-weight: 500;
    line-height: 24px;
    font-family: var(--ap-front-primary-font); 
    margin-top: 15px;   
    margin-bottom: 5px;
}
.ap-cursor-pointer{
    cursor: pointer;
}
.ap-affiliate-dialog{
    padding: 10px;
}
.ap-affiliate-dialog .el-dialog{
    border-radius: var(--ap-front-radius-8px);
}
.ap-flex-start-right{
    display: flex;
    justify-content: end;
}

/* Creative Style */
.ap-creative-box{
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-12px);
}
.ap-creative-image{
    height:180px;
}
.ap-creative-image .el-image{
    height: 100%;
    border-radius: var(--ap-front-radius-12px) var(--ap-front-radius-12px) 0 0;
}
.ap-creative-image .el-image, .ap-creative-image .el-image img{
    width: 100%;    
    height: auto;
    object-fit: cover;
    max-height: 180px;
}
.ap-creative-detail{
    padding: 12px 12px 12px 24px;
}
.ap-creative-type-label{
    margin-top: 8px;
    margin-bottom: 15px;
    font-size: var(--ap-front-mobile-text-size);
    color: var(--ap-front-content-color);
}
.ap-creative-name{
    font-weight: 400;
    font-size: var(--ap-subtitle-font-size);
    font-family: var(--ap-front-primary-font); 
    color: var(--ap-front-content-color);
    word-break: break-word; 
    overflow-wrap: break-word; 
    white-space: normal; 
}
.ap-creative-dwld-btn{
    display: flex;
    align-items: center;
    justify-content: center;
}
.ap-creative-dwld-btn .ap-btn--primary .ap-download-icon-fill{
    fill: var(--ap-front-content-color);
}
.ap-preview-dwld-btn:hover .is-plain.ap-btn--primary .ap-copy-icon,
.ap-preview-dwld-btn:hover .ap-icon-plain-btn .ap-download-icon-fill,
.ap-creative-dwld-btn:hover .ap-btn--primary .ap-download-icon-fill{
    fill: var(--ap-front-cl-white);
}
.ap-creative-box-col{
    margin-bottom: 24px;
}
.ap-creative-txt-img{
    background-color: var(--ap-color-primary-light-10);
    height:180px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ap-front-radius-12px);
}
.ap-affiliate-creative-detail{
    font-weight: 400;
}
.ap-affiliate-small-title{
    font-size: var(--ap-front-small-title-font-size);
    color: var(--ap-front-title-color);
    font-weight: 500;
    font-family: var(--ap-front-primary-font);
}
.ap-affiliate-creative-preview{
    margin-top: 20px;
}
.ap-affiliate-creative-img-preview{
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-8px);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}
.ap-preview-dwld-btn{
    display: flex;
    justify-content: end;   
    margin-top: 15px; 
}
.ap-affiliate-creative-source-code{
    margin-top: 15px;
}
.ap-affiliate-html-code{
    
    margin-top: 10px;
}
.ap-creative-code-block{
    padding: 15px;
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-8px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background-color: var(--ap-color-primary-light-10);
    height: 100%;
}
.ap-icon-plain-btn .ap-download-icon-fill{
    fill: var(--ap-front-content-color)
}
.ap-icon-plain-btn .ap-download-icon-stoke{
    stroke: var(--ap-front-primary-color);
}
.is-plain.ap-btn--primary {
    background-color: var(--ap-color-primary-light-10);
}
.is-plain.ap-btn--primary:hover, .is-plain.ap-btn--primary:focus{
    color: var(--ap-front-primary-color);
}
.is-plain.ap-btn--primary .ap-copy-icon{
    fill: var(--ap-front-content-color);
    stroke: var(--ap-front-primary-color);
}
pre.ap-creative-code-block {
    white-space: pre-wrap;       
    word-wrap: break-word;       
    overflow-x: auto;            
    max-width: 100%;             
}
.ap-front-menu-seperator{
    border: 1px solid var(--ap-border-color);
    margin-top: 20px;
    margin-bottom: 20px;
}
.ap-affiliate-panel-sidebar .ap-menu-red-item .ap-affiliate-menu-item-txt{
    color:var(--ap-front-status-reject-border);
}
.ap-affiliate-panel-sidebar .ap-menu-red-item:hover{
    background-color:var(--ap-front-status-reject-border);
}
.ap-affiliate-panel-sidebar .ap-menu-red-item:hover .ap-affiliate-menu-item-txt{
    color: var(--ap-front-cl-white);
}
.ap-edit-profile-avatar-container{
    margin-top: 15px;
}
.ap-edit-profile-avatar-img{
    border-radius: 50%;
    width: 80px;
    height: 80px;
    object-fit: cover;
}
.ap-change-pass-frm{
    margin-top: 40px;
}
.ap-delete-account-text{
    color: var(--ap-content-color);
    font-size: var(--ap-content-font-size);
    font-weight: 400;
    line-height: 22px;
    margin-top: 8px;
}
.ap-close-account-image, .ap-close-account-detail{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.ap-close-account-detail{
    margin-bottom: 40px;
}
.ap-close-account-detail .ap-close-account-title{
    font-weight: 600;
    font-size: var(--ap-front-title-font-size);
    margin-top: 15px;
    color: var(--ap-front-title-color);
    text-align: center;
}
.ap-close-account-txt{
    font-family: var(--ap-front-primary-font);
    font-size: var(--ap-front-content-font-size);
    font-weight: 400;
    line-height: 24px;
    text-align: center;    
    color: var(--ap-front-content-color);
    margin-top: 5px;
}
.ap-delete-account-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ap-delete-account-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ap-border-btn{
    background-color: var(--ap-front-cl-white) !important;
    border: 1px solid var(--ap-front-border-color);
    color: var(--ap-front-content-color);
}
.ap-red-btn{
    background-color: var( --ap-front-status-rejected-color) !important;
    color:var(--ap-front-cl-white) !important;
    border: 1px solid var( --ap-front-status-rejected-color) !important;
}
.ap-cancel-close-btn{
    margin-top: 30px;
}
.ap-horizontal-scroll {
    overflow-x: auto; 
    white-space: nowrap;
    max-width: 100%;
    width: 100%; 
}
.ap-mobile-menu .ap-affiliate-panel-sidebar{
    background-color: var(--ap-front-cl-white) !important;
    width: auto !important;
    padding: 0px;
    margin-top: 20px;
    padding: 10px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    border-right: unset;
}
.ap-mobile-menu .ap-front-menu-seperator{
    margin-top: 7px;
}
.ap-drawer-close{
    display: flex;
    align-items: center;
    justify-content: end;
}
.ap-mobile-menu{
    width: 100% !important;
    display: flex;
    flex-direction: column;
}
.ap-mobile-menu-opner{
    display: none;
    cursor: pointer;    
}
.ap-menu__drawer-main .el-drawer{
    width: 358px !important;
}
.ap-menu__drawer-main .el-drawer__header{
    margin-bottom: 0px;
    display: none;
}
.ap-status-red{
    color: var(--ap-front-status-rejected-color);
    background-color: var(--ap-front-status-reject-background-color);
    padding: 0px 12px;
    min-width: 70px;
    display: inline-block;
}
.ap-status-green{
    color: var(--ap-front-status-active-color);
    background-color: var(--ap-front-status-active-background-color);
    padding: 0px 12px;
    min-width: 70px;
    display: inline-block;
}
.ap-status-orange{
    color: var(--ap-front-status-pending-color);
    background-color: var(--ap-front-status-pending-background-color);
    padding: 0px 12px;
    min-width: 70px;
    display: inline-block;
}
.ap-status-blue{
    color: var(--ap-front-status-unpaid-color);
    background-color: var(--ap-front-status-unpaid-background-color);
    padding: 0px 12px;
    min-width: 70px;
    display: inline-block;
}
/* Inner Loader */
.ap-panel-data-container{
    position: relative;
}
.ap-panel-inner-loader{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;    
}
.el-notification, .el-notification__title, .el-notification__content{
    font-family: var(--ap-front-primary-font);
}
.ap-frm-btn{
    margin-top: 24px;
}
.ap-other-prof-setting{
    margin-top: 35px;
}
.ap-program-detail-card{
    padding: 20px;    
}
.ap-commission-rate-color{
    margin-right: 10px;
    border-radius: var(--ap-front-radius-4px);    
}
.ap-commission-cookie-color{
    margin-left: 10px;
    border-radius: var(--ap-front-radius-4px);
}
.ap-commissiontion-box-data{
    font-size: var(--ap-front-content-font-size);
    font-family: var(--ap-front-primary-font);
    font-weight: 500;
    line-height: 24px;
    color: var(--ap-front-content-color);
}
.ap-commissiontion-box-data b{
    font-size: var(--ap-front-content-font-size);
    font-family: var(--ap-front-primary-font);
    font-weight: 600;
    line-height: 24px;    
    color: var(--ap-front-content-color);
}
.ap-canvas-chart-data{
    min-height: 360px;
    margin-top: 15px;
}
.ap-chart-data-card{
    border: 1px solid var(--ap-front-border-color);
    margin: 8px 48px 32px 48px;
    padding: 24px;
    border-radius: var(--ap-radius-8px);
    color: rgb(115, 98, 249);
    max-width: 100%;
}
.ap-dashboard-content .ap-table-filter{
    margin-bottom: 48px;
}
.ap-canvas-chart-data{
    max-width: 100%;
}
.ap-top-profile-menu-item{
    display: flex;
    align-items: center;
    justify-content: center;
}
.ap-top-profile-menu-icon{
    margin-right: 10px;
}
.el-dropdown-menu__item:hover .ap-front-menu-fill{
    fill: var(--ap-front-primary-color);
}
.ap-flex-center{
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Empty View Data Start */
.ap-data-empty-view{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 32px 0;
    height: 450px;
    margin-bottom: 60px;
}
.ap-ev-left-vector{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.ap-ev-right-content{
    margin-left: 40px;
}
.ap-ev-right-content h4{
    font-size: 18px;
    line-height: 20px;
    color: var(--ap-front-title-color);
    font-weight: 600;
    margin: 0;
    margin-bottom: 16px;
    font-family: var(--ap-front-primary-font);
}
.no-data-found-text{
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-title-color);
    font-weight: 400;
    font-size: var(--ap-subheading-font-size);
    margin-top: 20px;
    text-align: center;
    line-height: 100%;
    color: var(--ap-front-content-color);
}
.no-data-found-description{
    margin-top: 20px;
    font-size: var(--ap-subtitle-font-size);
    font-family: var(--ap-front-primary-font);
    font-weight: 400;
    color: var(--ap-front-content-color);
}
.ap-front-content-data{
    min-height: 500px;
}
.ap-header-filter-right{
    display: none !important;
}

.ap-affiliate-filter-dialog .el-dialog__header{
    display: none;
}
.ap-expand-top-row{
    display: flex;  
    flex-direction: column;  
}
.ap-expand-top-row-data{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ap-expan-top-data{
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-content-color);
    font-weight: 500;
    font-size: var(--ap-front-mobile-text-size);
    display: flex;
    align-items: center;
    justify-content: center;
}
.ap-mr-3{
    margin-right: 3px;
}
.ap-mr-8{
    margin-right: 8px;
}
.ap-date-cal-icon{
    display: flex;    
    margin-right: 8px;
}
.ap-com-date{    
    display: flex;
    align-items: center;
}
.ap-mb-5{
    margin-bottom: 5px;
}
.ap-mb-10{
    margin-bottom: 10px;
}
.ap-mt-20{
    margin-top: 20px !important;
}
.ap-affiliate-not-allow-msg{
    text-align: center;
}
.ap-data-single-line{
    word-wrap: break-word;
    word-break: break-all;
    overflow-wrap: break-word;
    white-space: normal;    
}
.ap-expand-top-price{
    font-weight: 600;
    color: var(--ap-front-title-color);
    margin-right: 20px;
}
.el-table__expand-icon > .el-icon{
    font-size: 16px;
    font-weight: bold;
    color: var(--ap-front-title-color);
}
.ap-expand-row{
    border: 1px solid var(--ap-front-gt-gray-300);
    box-shadow: 0px 4px 24px 0px #727C952E;
    padding: 16px;
    margin: 13px;
    border-radius: var(--ap-front-radius-8px);
}

.ap-expand-sub-row{
    display: flex;
    justify-content: space-between;
}
.ap-expand-row-title{
    font-family: var(--ap-front-primary-font);
    font-size: var(--ap-front-mobile-text-size);
    color:var(--ap-front-title-color);
    font-weight: 500;
}
.ap-expand-value{
    font-family: var(--ap-front-primary-font);
    font-size: var(--ap-front-mobile-text-size);
    color:var(--ap-front-content-color);
    font-weight: 500;
}
.ap-expan-price-data{
    background-color: var(--ap-front-primary-color);
    color: var(--ap-front-cl-white);
    font-weight: 600;
    padding: 4px;
    padding-left: 8px;
    padding-right: 8px;
    border-radius: var(--ap-front-radius-4px);
}
.ap-expand-top-head-right{
    margin-right: 15px;
}
.ap-expand-title-col .cell{
    padding: 0px !important;
}
.ap-mobile-view-table{
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-8px);
    margin-top: 20px;
}
.ap-mobile-view-table thead{
    display: none;
}
.ap-mobile-diplay{
    display: none;
}
.ap-status-dot{
    height: 10px;
    width: 10px;
    border-radius: 100%;    
    margin-right: 10px;
}
.ap-status-dot-red{
    background-color: var(--ap-front-status-reject-border);
}
.ap-status-dot-green{
    background-color: var(--ap-front-status-active-border);
}
.ap-border-seperator{
    display: flex;
    flex-direction: column;
    height: 1px;
    background-color: var(--ap-front-border-color);
}
.ap-expand-top-row-padding{
    padding-left: 15px;
    padding-right: 5px;
}
.ap-form-date-range-control.el-date-editor .el-range__icon, .ap-form-date-picker-control .el-input__icon{
    left: 8px;
}
.ap-front-filter-btn .ap-tf-btn-group .ap-btn--second, .ap-front-filter-btn .ap-tf-btn-group .ap-btn--primary{
    min-width: unset !important;
}
.ap-avatar-container .el-tooltip__trigger{
    display: flex;
    align-items: center;
    justify-content: center;
    outline-width: 0px;
    cursor: pointer;
}
.ap-top-profile-menu .el-dropdown-menu__item{
    padding: 6px 28px 6px 17px;
}
.ap-top-profile-menu .el-dropdown-menu{
    padding-top: 10px;
    padding-bottom: 10px;
}
.ap-front-msg-panel{
    margin-bottom: 20px;
}
.ap-flex-between{
    display: flex;
    align-items: center;
    justify-content: space-between;    
}
.ap-flex-center{
    display: flex;
    align-items: center;
    justify-content: center;    
}
.ap-img-info{
    font-family: var(--ap-front-primary-font);
    font-size:var(--ap-front-mobile-text-size);
    color: var(--ap-front-content-color);
    font-weight: 500;
}
.ap-dot-between{
    background-color:var(--ap-front-content-color);
    height: 4px;
    width: 4px;
    margin-left: 10px;
    margin-right: 10px;
    border-radius: 100%;    
}
.ap-tbl-inside-label{
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-title-color);
    font-weight: 500;
}
.ap-hidden-table{
    visibility: hidden;
}
.ap-field-desc{
    font-family: var(--ap-front-primary-font);
    color: var(--ap-front-content-color);
    font-size: var(--ap-medium-font-size);
    font-weight: 400;
    margin-top: 10px;
}
.ap-padding-right-cls .cell{
    padding-right: 65px;
}
.__ap-is-sticky{
    position: sticky;
    bottom: 0px;
    background: var(--ap-front-cl-white);
    z-index: 999;
    margin: 0px !important;  
    padding-bottom: 20px;
}
.ap-front-content-with-scroll{
    margin-bottom: 88px;
}
.el-input--large .el-input__wrapper{
    height: auto;
    padding: 0;
    background-color: transparent;
    margin: 0;
    text-decoration: none;
    border: unset;
}
.el-input__wrapper input.el-input__inner{
    margin: 0px;
    width: 100% !important;
    height: 40px !important;
    line-height: 40px !important;  
    padding: 0px 15px;
    border: 1px solid var(--el-input-border-color, var(--el-border-color));
    border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
}
.el-input__prefix-inner>:first-child,.el-input__prefix-inner>:first-child.el-input__icon{margin-right:0;}
.ap-form-date-picker-control .el-input__wrapper input.el-input__inner{
    padding: 0px 15px 0px 38px;
}
.el-input__prefix, .el-input__suffix {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
}
.el-input__suffix {
    left: unset;
    right: 15px;
}
/* Add Conflit CSS Start */
.el-date-range-picker__header .el-picker-panel__icon-btn{
    margin: 0px !important;
    margin-top: 4px !important;
}
.el-date-range-picker__header .el-picker-panel__icon-btn{
    display: flex;
    align-items: center;
}
.el-table__inner-wrapper .el-table__body td,.el-table__inner-wrapper .el-table__body th, .el-picker-panel td, .el-picker-panel th{
    background-color: var(--ap-front-cl-white);
}
.el-picker-panel table{
    border-width: 0px !important;
}
.el-picker-panel td, .el-picker-panel th{
    border: none !important;
    background-color: var(--ap-front-cl-white) !important;
}
.el-picker-panel .el-picker-panel__icon-btn{
    padding: 6px;
}
.el-picker-panel .el-picker-panel__icon-btn:hover{
    background-color: var(--ap-front-cl-white) !important;

}
.el-table td, .el-table th{
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border: unset !important;
}
.el-table td.el-table__cell,
.el-table th.el-table__cell.is-leaf {
    border-bottom: var(--el-table-border) !important;
}
.el-table table{
    margin-block-end: unset !important;
    border-width: 0px !important;
}
.ap-flex-col{
    display: flex;
    flex-direction: column;
}

.el-picker-panel__shortcut{
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
}

.el-picker-panel__shortcut:hover {
    color: var(--el-datepicker-text-color) !important;
    background-color: var(--ap-front-cl-white);
}

/* Add Conflit CSS Over */

/* Fixed Popup Height Issue */
.el-dialog__headerbtn:focus, .el-dialog__headerbtn:hover{
    background-color:transparent !important;
    border: none !important;
}
.ap-term-condition-box a{
    color: var(--ap-front-title-color);
}
.ap-hide-form{
    display: none !important;
}
.ap-panel-visits-table .el-table--fit{
    height: 700px;
}
.ap-success-register-message{
    font-size: var(--ap-front-small-title-font-size) !important;
    line-height: 25px !important;
}
.ap-creative-txt-img svg path{
    fill: var(--ap-color-primary-light-7);
}
.ap-affiliate-panel-sidebar .ap-affiliate-menu-item svg .ap-front-menu-fill, .ap-top-profile-menu-icon .ap-front-menu-fill{
    fill: var(--ap-front-content-color);
}
.ap-affiliate-panel-sidebar .ap-affiliate-menu-item-active svg .ap-front-menu-fill{
    fill: var(--ap-front-cl-white) !important;
}
/* .ap-form-control input.el-input__inner, .ap-form-control .el-textarea__inner{
    background-color: transparent !important;
} */
.ap-panel-bonus-progress-bar-text{
    color: var(--ap-front-content-color);
}
.ap-dialog-close svg path{
    fill: var(--ap-front-title-color);
}

/*
.ap-aff-panel-table .el-table .sort-caret.ascending {
    border-bottom-color: var(--ap-front-title-color);
}
.ap-aff-panel-table .el-table .sort-caret.descending{
    border-top-color: var(--ap-front-title-color);
}
*/

.ap-pagination-nav .el-pager li{
    color:var(--ap-front-content-color);
}

button.el-picker-panel__shortcut{
    box-shadow: unset !important;
    border-bottom: 1px solid var(--ap-front-border-color) !important;
    border-radius: 0px !important;
    padding-top: 2px;
    padding-bottom: 2px;
}

.ap-panel-detail .el-table__empty-text {
    color: var(--ap-front-content-color);
}
.ap-droup-down-arrow svg path{
    stroke: var(--ap-front-content-color);
}

.ap-affiliate-panel-sidebar .ap-menu-red-item svg .ap-front-menu-fill {
    fill: var(--ap-front-status-reject-border);
}

.el-table .descending .sort-caret.descending {
    border-top-color: var(--ap-front-title-color);
}
.el-table .sort-caret.descending {
    border-top-color: var(--ap-front-title-color);
}
.el-table .sort-caret.ascending {
    border-bottom-color: var(--ap-front-title-color);
}
.el-table .ascending .sort-caret.ascending {
    border-bottom-color: var(--ap-front-title-color);
}
.ap-tax-link-copier .ap-copy-data{
    color: var(--ap-primary-color);
    background-color: var(--ap-color-primary-color-opacity-5);
}
.ap-creative-txt-img circle{
    fill: var(--ap-color-primary-light-10);
}
.el-checkbox__inner:hover, .el-radio__inner:hover{
    border-color: var(--ap-front-border-color);
}
.ap-main-creative-card-container{
    background-color: var(--ap-front-cl-white);
}
.affiliatepress-affiliate-panel input, .affiliatepress-affiliate-panel select, .ap-main-reg-card-container input, .ap-main-reg-card-container select{
    font-family: var(--ap-front-primary-font);
}

.ap-single-field__form input.el-input__inner{
    background-color: var(--ap-front-cl-white);
}
.ap-single-field__form input.el-input__inner::placeholder,
.ap-single-field__form textarea.el-textarea__inner::placeholder{ 
    color: var(--ap-placeholder-color) !important;
}
.el-input__wrapper:hover input.el-input__inner, .ap-form-control .el-textarea__inner:hover{
    background: var(--ap-color-primary-color-opacity-5);
    border: 1px solid var(--ap-front-primary-color); 
}
.ap-affiliate-panel-container .ap-form-control .el-input__wrapper,.ap-affiliate-panel-content .ap-edit-profile-frm .ap-form-control .el-input__wrapper, .ap-affiliate-panel-content .ap-edit-profile-frm .ap-form-control .el-input__wrapper:hover,.ap-affiliate-panel-content .ap-affiliate-dialog .el-input__wrapper:hover,.ap-affiliate-panel-content .ap-affiliate-dialog .el-input__wrapper.is-focus,.ap-affiliate-panel-content.ap-panel-form-content .ap-form-control .el-input__wrapper,.ap-affiliate-panel-content.ap-panel-form-content .ap-form-control .el-input__wrapper:hover{ 
    border: 0; 
}
.ap-affiliate-panel-content .el-form-item.is-error .ap-form-control .el-input__wrapper:hover{
    background-color: #EB51601A;
}
.el-input__wrapper:not(.is-focus):hover input.el-input__inner {
    background-color: var(--ap-color-primary-color-opacity-5);
}
.el-upload.el-upload--text .ap-simple--file-upload:hover{
    background-color: var(--ap-color-primary-color-opacity-5);
    border: 1px solid var(--ap-front-primary-color); 
}
.el-checkbox__inner:hover, .el-radio__inner:hover{
    border-color: var(--ap-front-primary-color);
}
.ap-simple--file-upload{
    background-color: var(--ap-front-cl-white);
    border: 1px solid var(--ap-front-border-color);
}

.el-form-item.is-error .el-input__wrapper input.el-input__inner, .el-form-item.is-error .el-input__wrapper:hover input.el-input__inner, .el-form-item.is-error .el-select__wrapper input.el-input__inner, .el-form-item.is-error .el-select__wrapper.is-focus input.el-input__inner, .el-form-item.is-error .el-select__wrapper:focus input.el-input__inner, .el-form-item.is-error .el-select__wrapper:hover input.el-input__inner, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner:hover, .el-form-item.is-error .el-textarea__inner.is-focus, .el-form-item.is-error .el-textarea__inner:focus, .el-form-item.is-error .el-upload.el-upload--text .ap-simple--file-upload, .el-form-item.is-error .el-upload.el-upload--text .ap-simple--file-upload:hover{
    border: 1px solid var(--ap-sc-danger);
    border-radius: var(--ap-radius-6px);
}
.el-form-item.is-error .el-textarea__inner:hover, .el-form-item.is-error .el-input__wrapper:hover input.el-input__inner, .el-form-item.is-error .el-upload.el-upload--text .ap-simple--file-upload:hover {
    background-color: #EB51601A;
}
.el-form-item.is-error .el-textarea__inner.is-focus, .el-form-item.is-error .el-textarea__inner:focus, .el-form-item.is-error .el-textarea__inner.is-focus:hover, .el-form-item.is-error .el-input__wrapper.is-focus, .el-form-item.is-error .el-input__wrapper:focus, .el-form-item.is-error .el-input__wrapper.is-focus:hover, .el-form-item.is-error .el-upload.el-upload--text:focus .ap-simple--file-upload {
    box-shadow: 0 0 0 4px #EB51601A;
    z-index: 10;
    position: relative;
    background-color: unset;
}

.el-pagination.is-background .btn-next.is-active, .el-pagination.is-background .btn-prev.is-active, .el-pagination.is-background .el-pager li.is-active {
    color: var(--ap-front-cl-white);
}
.ap-affiliate-panel-sidebar a.ap-affiliate-menu-item-active, .ap-affiliate-panel-sidebar .ap-affiliate-menu-item:hover, .ap-affiliate-panel-sidebar .ap-affiliate-menu-item-active:hover {
    background-color: var(--ap-primary-color);
    /*color: #ffffff;*/
}
.ap-affiliate-panel-sidebar .ap-affiliate-menu-item:hover{
    background-color: var(--ap-primary-hover-bg-color);
    color: var(--ap-front-content-color);
}
.el-select-dropdown .el-select-dropdown__list .el-select-dropdown__item, .el-select__placeholder{
    color: var(--ap-front-content-color) !important;
}
.el-select-dropdown__item.is-hovering{
    background-color:var(--ap-color-primary-light-10)
}
input.el-input__inner{
    color: var(--ap-front-title-color) !important;
    font-size: var(--ap-content-font-size) !important;
}
.el-button--primary.ap-border-btn .ap-btn__label {
    color: var(--ap-front-content-color) !important;
}

.el-button--primary.ap-red-btn .ap-btn__label{
    color: var(--ap-front-cl-white) !important;
}

.ap-tab-heading-flex{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.ap-payout-date-title{
    color: var(--ap-front-title-color);
    font-family: var(--ap-front-primary-font);
    font-size: 16px;
    font-weight: 500;
}
.ap-payout-date-detail{
    color: var(--ap-front-content-color);
    font-family: var(--ap-front-primary-font);
    font-size: 16px;
    font-weight: 500;
}
.ap-affiliate-menu-item-active.ap-affiliate-menu-item svg path{
    stroke: var(--ap-front-cl-white);
}
.ap-affiliate-panel-container .ap-affiliate-panel-content .ap-front-content-data table .el-table__row{
    height: 62px;
}
.ap-affiliate-panel-container .ap-affiliate-link-table table .el-table__cell,
.ap-affiliate-panel-container .ap-affiliate-link-table table .el-table__row{
    height: 88px;
}
.ap-affiliate-panel .ap-profile-edit-wrapper .is-plain.ap-btn--primary,
.ap-affiliate-panel .ap-table-filter .is-plain.ap-btn--primary{
    color: var(--ap-content-color);
    border-color: var(--ap-gt-gray-700);
    background-color: var(--ap-front-cl-white);
}
.ap-preview-dwld-btn .el-button.el-button--primary.ap-btn--primary:hover,
.ap-creative-detail .ap-creative-dwld-btn .el-button.el-button--primary.ap-btn--primary:hover,
.ap-affiliate-panel .ap-profile-edit-wrapper .is-plain.ap-btn--primary:hover,
.ap-affiliate-panel .ap-table-filter .is-plain.ap-btn--primary:hover{
    color: var(--ap-front-cl-white);
    background-color: var(--ap-content-color);
    border-color: var(--ap-content-color);
}
.ap-affiliate-panel .ap-profile-edit-wrapper .ap-btn--second,
.ap-affiliate-panel .ap-table-filter .ap-btn--second {
    color:  var(--ap-content-color);
    background-color: unset;
    border: unset;
    box-shadow: none;
}
.ap-affiliate-panel .ap-profile-edit-wrapper .ap-btn--second:hover,
.ap-affiliate-panel .ap-table-filter .ap-btn--second:hover{
    background-color: var(--ap-front-border-color);
}
.ap-form-date-range-control .el-range-separator {
    font-size: 0;
    position: relative;
}
.ap-form-date-range-control .el-range-separator::after {
    content: '';
    display: inline-block;
    width: 16px;
    height: 22px;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.33331 12.5H16.6666L11.6667 7.5' stroke='%239CA7BD' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}
.ap-form-date-range-control.is-active:hover, .ap-form-date-range-control.is-active{
    border: 1px solid var(--ap-front-primary-color);
    box-shadow: 0 0 0 4px var(--ap-color-primary-rgb-border);
}
.ap-form-date-picker-control .el-input__wrapper.is-focus, .ap-form-control .el-input__wrapper.is-focus, .ap-form-control .el-textarea__inner.is-focus, .el-range-editor.is-active,.ap-form-control--number .el-input__wrapper.is-focus, .ap-form-control .el-select__wrapper.is-focused, .el-range-editor.is-active{
    border: 0px solid var(--ap-front-primary-color);
    box-shadow: 0 0 0 4px var(--ap-color-primary-rgb-border);
    z-index: 10; 
    position: relative;
}
.ap-form-date-picker-control .el-input__wrapper.is-focus .el-input__inner, .ap-form-control .el-input__wrapper.is-focus .el-input__inner, .ap-form-control .el-textarea__inner.is-focus .el-input__inner, .el-range-editor.is-active .el-input__inner,.ap-form-control--number .el-input__wrapper.is-focus .el-input__inner, .ap-form-control .el-select__wrapper.is-focused .el-input__inner, .el-range-editor.is-active, .ap-simple-upload-form-control .el-upload--text:focus .ap-simple--file-upload{
    border: 1px solid var(--ap-front-primary-color);
}
.ap-simple-upload-form-control ul{
    margin: 3px 0;
    padding-left: 0;
}
.ap-simple-upload-form-control ul .el-upload-list__item{
    margin-top: 5px;
}
.affiliatepress_panel_separator{
    border-bottom: 1px solid var(--ap-front-border-color);
    padding-bottom: 32px;
}
.ap-affiliate-generated-link{
    padding-top: 32px;
}
.ap-profile-edit-wrapper{
    border: 1px solid var(--ap-front-border-color);
    border-radius: var(--ap-front-radius-8px);
    padding: 32px;
    margin-top: 32px;
}
.ap-profile-sub-heading{
    color: var(--ap-front-title-color);
    font-weight: 500;
    font-size: var(--ap-subheading-font-size);
    font-family: var(--ap-front-primary-font);
}
.ap-delete-account-btn{
    background-color: var(--ap-front-status-rejected-color);
    border-color: var(--ap-front-status-rejected-color);
}
.ap-delete-account-btn:hover,
.ap-delete-account-btn:focus{
    background-color: var(--ap-front-status-rejected-color);
    border-color: var(--ap-front-status-rejected-color);
}
.ap-edit-profile-save{
    text-align: right;
    padding-top: 20px;
}
.ap-delete_account,
.ap-profile-avtar-wrapper{
    margin-top: 10px;
    color: var(--ap-front-content-color);
    font-size: var(--ap-medium-font-size);
}
.ap-sidebar-profile-section{
    text-align: center;
    color: var(--ap-front-content-color);
}
.ap-sidebar-profile-section img{
    height: 48px;
    width: 48px;
    margin-top: 10px;
    border-radius: 50px;
    object-fit: cover;
}
.ap-sidebar-profile-action{
    gap: 20px;
    display: flex;
    justify-content: center;
    margin-top: 32px;
    height: 38px;
}
.ap-sidebar-profile-detais{
    margin-top: 20px;
    font-weight: 400;
    font-size: var(--ap-font-size-medium);
    font-family: var(--ap-front-primary-font);
}
.ap-sidebar-username{
    font-weight: 500;
    font-size: var(--ap-medium-font-size);
}
.ap-affiliate-menu-item svg path{
    stroke: var(--ap-front-content-color);
}
.ap-preview-dwld-btn .el-button.el-button--primary.ap-btn--primary,
.ap-creative-detail .ap-creative-dwld-btn .el-button.el-button--primary.ap-btn--primary{
    color: var(--ap-front-content-color);
    background-color: var(--ap-front-cl-white);
    border-color: var(--ap-front-border-color);
    font-weight: 600;
    font-size: var(--ap-front-content-font-size);
}
.ap-btn--primary .ap-btn__icon svg{
    fill: var(--ap-front-content-color);
}
::placeholder, .el-select__placeholder.is-transparent{
    color: var(--ap-front-border-color) !important;
}
.ap-sidebar-profile-section .ap-sidebar-profile-action svg{
    cursor: pointer;
}
.ap-edit-icon.ap-affiliate-menu-active svg,
.ap-edit-icon:focus svg,
.ap-edit-icon svg:hover{
    background-color:var(--ap-primary-color); ;
    border-radius: var(--ap-front-radius-8px);
}
.ap-logout-icon:focus svg,
.ap-logout-icon svg:hover{
    background-color:var(--ap-front-status-rejected-color);
    border-radius: var(--ap-front-radius-8px);
}
.ap-logout-icon:hover svg rect,
.ap-logout-icon:focus svg rect{
    stroke: var(--ap-front-status-rejected-color);
}
.ap-edit-icon.ap-affiliate-menu-active svg path,
.ap-logout-icon:hover svg path,
.ap-logout-icon:focus svg path,
.ap-edit-icon:focus svg path,
.ap-edit-icon:hover svg path{
    stroke: var(--ap-front-cl-white);
}
.ap-edit-icon.ap-affiliate-menu-active svg rect,
.ap-edit-icon:focus svg rect,
.ap-edit-icon:hover svg rect{
    stroke: var(--ap-primary-color);
}
.ap-edit-icon:focus,
.ap-logout-icon:focus {
    outline: none;
}
.ap-delete-account-button-col {
    display: flex;
    justify-content: flex-end;
}

.ap-affiliate-panel-content .ap-cards-container .ap-box-card .el-card__body .ap-box-card-icon svg{ vertical-align: middle; }

.ap-affiliate-panel-content .el-date-editor .el-range-input {color: var(--ap-placeholder-color) !important; }
.ap-affiliate-panel-content .el-date-editor .el-range-input::placeholder,
.ap-affiliate-panel-content .el-select__placeholder.is-transparent,
.ap-affiliate-panel-content .ap-form-control .el-input__wrapper .el-input__inner::placeholder,
.ap-affiliate-panel-content .ap-form-control .el-textarea__inner::placeholder {
    color: var(--ap-placeholder-color) !important;
}
.ap-affiliate-panel-content .ap-chart-data-card{ padding: 24px; }
.ap-affiliate-panel-content .ap-chart-data-card .ap-tab-heading{
    font-size: var(--ap-subheading-font-size);
    font-weight: 600;
    color: var(--ap-heading-color);
}
.ap-edit-profile-avatar-container .el-upload-list__item.is-success .el-upload-list__item-status-label,
.ap-edit-profile-avatar-container .el-upload-list__item-info{
    display: none;
}
.ap-edit-profile-avatar-container .ap-edit-profile-avatar{
    min-height: 42px;
    margin-top: 8px;
    margin-right: 6px;
}
.ap-edit-profile-avatar-container .ap-edit-profile-avatar .ap-btn--primary.is-plain{
    cursor: pointer;
}
.ap-btn--is-loader .ap-btn__label{
    opacity: 0;
}
.ap-btn--big .ap-btn__label{
    font-size: var(--ap-medium-font-size);
}
.ap-disp-flex-box .el-checkbox.el-checkbox--large{
    height: unset;
}
.ap-edit-profile-avatar-container{
    display: flex;
    align-items: center;
    gap: 24px;
}
.ap-panel-detail .el-button.ap-btn--primary{
    padding: 10px 32px;
}
.ap-social-facebook svg rect:hover {
    fill: #2A4EC7;
}
.ap-social-twitter svg rect:hover {
    fill: black;
}
.ap-social-linkdin svg rect:hover {
    fill: #1F4E9A;
}
.ap-social-whatsapp svg rect:hover {
    fill: #18A859;
}
.ap-social-mail svg rect:hover {
    fill: #BA5452;
}
.ap-welcome-text{
    display: none;
}
.ap-duration-data{
    display: flex;
    align-items:center;
    gap: 16px;
    margin-bottom: 12px;
    font-size: var(--ap-subtitle-font-size);
    font-weight: 400;
    line-height: 24px;
    color: var(--ap-front-title-color);
    font-family: var(--ap-front-primary-font);
}
.ap-cookie-duration-wrapper{
    background-color: #FFFBF2;
    padding: 16px;
    margin-top: 24px;
}
.ap-cookie-description{
    font-size: var(--ap-content-font-size);
    color: var(--ap-front-content-color);
    font-weight: 400;
    line-height: 22px;
    font-family: var(--ap-front-primary-font);
}
.el-button.ap-side-menu-button:focus,
.el-button.ap-side-menu-button:focus{
    background-color: unset;
}
.el-notification.success_notification,
.ap-add__drawer-main.ap-menu__drawer-main{
    z-index: 99999 !important;
}
@media (max-width: 1199px){
    .ap-commission-rate-color{
        margin-right: 0px; 
        margin-bottom: 15px;         
    }
    .ap-commission-cookie-color{
        margin-left: 0px;        
    }    
}

@media (max-width: 1240px){
    .ap-mobile-menu-opner{
        display: flex;
        cursor: pointer;
    }    
    .ap-welcome-container{
        padding: 12px 20px 12px 20px;
    }
    .ap-avatar-container img{
        height: 40px;
        width: 40px;
    }
    .ap-close-account-detail .ap-close-account-title{
        font-size: var(--ap-subheading-font-size);
    }
}

@media (max-width: 512px){
    .ap-menu__drawer-main .el-drawer{
        width: 100% !important;
    }
}

@media (min-width:1200px) and (max-width:1350px){
    .ap-table-filter .ap-form-date-range-control.el-date-editor .el-range__icon{
        left: 8px;
    }
    .ap-close-account-detail .ap-close-account-title{
        font-size: var(--ap-subheading-font-size);
    }

}

@media (max-width: 1500px){
    .ap-front-filter-btn .ap-tf-btn-group .ap-btn--second, .ap-front-filter-btn .ap-tf-btn-group .ap-btn--primary{
        min-width: unset !important;
    }
}

@media (max-width: 1199px){
    .ap-table-filter .el-col{
        margin-bottom: 15px;
    }
    .ap-table-filter .ap-front-filter-btn{
        margin-top: 5px;
    }
}

@media (max-width: 576px) {	
    .ap-pagination{
        margin: 26px 20px 37px;
    }
    .ap-desktop-diplay{
        display: none;
    }
    .ap-mobile-diplay{
        display: block;
    }    
    .ap-affiliate-dialog .ap-tab-heading{
        font-size: var(--ap-front-mobile-title-size);
    }
    .ap-mobile-full-screen-dialog{
        width: 100vw !important; 
        height: 100vh !important; 
        max-width: 100vw !important; 
        max-height: 100vh !important; 
        margin: 0 !important; 
        border-radius: 0 !important;     
        background-color: var(--ap-front-cl-white);    
    }
    .ap-mobile-full-screen-dialog .el-dialog{
        margin: 0px;
    }
    .ap-mobile-full-screen-dialog .ap-dialog-close{
        position: absolute;
    }
    .ap-mobile-full-screen-dialog .el-overlay-dialog{
        display: flex;
        margin: 0;
    }
    .ap-mobile-full-screen-dialog .el-dialog__body {
        height: calc(100vh - 35px); 
        overflow-y: auto; 
    }    
    .ap-header-filter-right{
        display: flex !important;
    }
    .ap-table-filter{
        display: none;
    }
    .ap-affiliate-filter-dialog .ap-affiliate-dialog-body,.ap-affiliate-filter-dialog .el-dialog__body{
        position: relative;        
    }
    .ap-affiliate-filter-dialog .el-dialog__body{
        max-height: 100% !important;
        overflow: hidden;
    }
    .ap-filter-popup-btn-group{
        position: absolute;
        bottom: 25px;
        width: 100%;
    }    
    .ap-affiliate-filter-dialog .ap-affiliate-dialog{
        padding: 0px;
    }
    .ap-affiliate-filter-dialog .el-dialog{
        padding: 30px;
    }
    .ap-remove-m-b-title .ap-btn__label{
        display: none;
    }
    .ap-remove-m-b-title{
        min-width:auto;        
        padding: 19px 20px;
    }
    .ap-remove-m-b-title .ap-btn__icon{
        margin-right: 0px;
    }
}

@media (max-width: 991px){
    .ap-pagination-left{
        text-align: center;
    }
    .ap-pagination-nav{
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media (max-width: 768px){
    .ap-front-page-sub-title{
        font-size: var(--ap-front-medium-text-size);
    }    

    .ap-mobile-center-popup .el-dialog__body{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .ap-mobile-detail-txt{
        font-size: var(--ap-front-mobile-text-size);
        font-weight: 400;
        color: var(--ap-front-content-color);
    }
    .ap-tax-link-copier .ap-copy-data{
        font-size: var(--ap-front-mobile-text-size);        
    }
    .ap-single-row-table .cell{
        padding: 15px;
    }    
    .ap-affiliate-default-link,.ap-tab-detail-txt{
        margin-top: 8px;
        font-size: var(--ap-front-mobile-text-size);
        font-weight: 400;        
    }
    .ap-tab-detail-txt{
        margin-top: 15px;
    }
    .ap-affiliate-generated-link-header{
        display: flex;
        align-items: center;
    }
    .ap-affiliate-generated-link-header .ap-tab-heading{
        font-size: var(--ap-front-subtitle-font-size);
    }
    .ap-form-label,.ap-commissiontion-box-data,.ap-commissiontion-box-data b{
        font-size: var(--ap-front-mobile-text-size);
    }
    .ap-single-field__form{
        margin-top: 20px;
    }
    .ap-program-detail-card{
        padding: 12px;
    }
    .el-form--default.el-form--label-top .el-form-item .el-form-item__label{
        margin-bottom: 2px;
    }
    .ap-edit-profile-title{
        margin: 8px 0px;
    }
    .ap-creative-list{
        margin-top: 24px;
    }
    .ap-date-range-picker-sidebar-widget-wrapper .el-picker-panel__sidebar{
        display: none;
    }
    .ap-affiliate-panel-content-header{
        margin-bottom: 4px;
    }
    .ap-box-card{
        min-height: 0px;
        margin-top: 20px;
    }
    .ap-box-card-value{
        margin-top: 5px;
    }
    .ap-chart-data-card .ap-tab-heading{
        margin-left: 16px;
    }
    .ap-welcome-container{
        margin-bottom: 24px;
    }
    .ap-date-range-picker-sidebar-widget-wrapper .el-picker-panel__sidebar + .el-picker-panel__body{
        margin-left: 0px;
    }
    .ap-affiliate-panel-dashboard-header .ap-header-right{
        margin-top: 12px;
    }
    .ap-affiliate-panel-content{
        padding-top: 10px;
        padding-bottom: 10px;
        max-width: 100%;
    }
    .ap-chart-data-card{
        margin: 0px;
        margin-top: 24px;
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .ap-chart-data-card .ap-tab-heading{
        margin-bottom: 16px;
    }
    .ap-affiliate-panel{
        border: none !important;
    }
    .ap-box-card{
        padding: 16px;
    }
    .ap-box-card-value{
        font-size: var(--ap-front-mobile-title-size);   
    }
    .ap-cards-container .el-col{
        padding-left: 8px;
        padding-right: 8px;
    }
    .ap-box-card .header{
        font-size: var(--ap-front-mobile-text-size);
    }
    .ap-box-card .el-card__body{
        padding: 0px;
    }
    .ap-affiliate-panel-dashboard-header{
        flex-direction: column;
    }
    .ap-affiliate-panel-dashboard-header{
        
    }
    .ap-affiliate-panel-content .ap-affiliat-panel-pading{
        padding-left: 0px;
        padding-right: 0px;
    }
    .ap-form-date-range-control{
        
    }
    .ap-affiliate-dialog .el-dialog{
        width: 100% !important;
    }
    .ap-front-page-title{
        font-size: var(--ap-title-font-size);        
    }
    .ap-main-reg-card-container{
        width: 100% !important;
        padding: 20px !important;
        margin: 0px;
    }
    .ap-single-form .ap-frm-btn {
        margin-top: 30px;
    }
    .ap-acnt-link-forgot{
        text-align: center;
    }

}

@media (min-width: 720px) and (max-width: 768px) {
    .ap-creative-box-col.ap-creative-tab {
        flex: 0 0 50%;
        max-width: 50%;
    }
  }

@media (max-width: 420px){
    .ap-disp-flex-box{
        flex-direction: column;
    }
}

@media (min-width: 950px) and (max-width: 1199px) {
    .ap-creative-image{
        height: 265px;
    }
}