/* General CSS */
.swpm-margin-10{
    margin: 10px;
}
.swpm-margin-top-10{
    margin-top: 10px;
}
.swpm-margin-bottom-10{
    margin-bottom: 10px;
}
.swpm-hidden{
    display: none;
}
.swpm-red-error-text{
    font-weight: bold;
    color: red;
}
.swpm-box-shadow {
    box-shadow: 0 1px 1px rgba(0,0,0,.04);
}

.swpm-yellow-box{
    margin: 10px 0px;
    padding: 10px;
    background-color: #FFFFE0;
    border-color: #E6DB55;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;
}

.swpm-red-box {
    margin: 10px 0px;
    padding: 10px;
    background-color: #FFEBE8;
    border-color: #CC0000;
    color: #333333;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;
}

/* Wrap directly with this class (not to be used with a paragraph tag) */
.swpm-orange-box{
    margin: 10px 0px;
    padding: 15px 10px;
    color: #3F2502;
    text-shadow: 1px 1px #FFFFFF;
    background-color: #FFF6D5;
    border-color: #D1B655;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;
}

/* Wrap directly with this class (not to be used with a paragraph tag) */
.swpm-white-box{
    margin: 10px 0px;
    padding: 15px 10px;
    color: #3c434a;
    background-color: #fff;
    border-color: #c3c4c7;
    border-width: 1px;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
}

/* Wrap directly with this class (not to be used with a paragraph tag) */
.swpm-grey-box{
    margin: 10px 0px;
    padding: 15px 10px;
    background-color: #DDDDDD;
    border-color: #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;
}

/* Wrap directly with this class (not to be used with a paragraph tag) */
.swpm-green-box {
    margin: 10px 0px;
    padding: 15px 10px;
    background-color: #CCF4D6;
    border-color: #059B53;
    color: #043B14;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;
}

/* Default button style that we can use on registration, login, profile, password reset, form's submit button. */
.swpm-submit-btn-default-style {
    min-width: 150px;
    padding: 0.5em 1em;
    cursor: pointer;
}

/* Block related */
.swpm-payment-block-ic-wrapper{
    padding: 16px;
}

/* Membership buy buttons */
.swpm-button-wrapper input[type="submit"]{
    width: auto !important;
    height: auto !important;
}
.swpm-button-wrapper input[type="image"]{
    width: auto !important;
    height: auto !important;    
}

/* Login form CSS */
.swpm-login-widget-form, .swpm-login-widget-logged{
    text-align: center;
    border: solid 1px gray;
    width: 25em;
    padding: 2em 1em;
}
/* 适配手机端样式 */
@media screen and (max-width:768px) {
    .swpm-login-widget-form,.swpm-login-widget-logged {
        border: 0;
        width: 100%;
        padding: 0;
    }
    .swpm-username-input, .swpm-password-input{
        flex-direction: column;
        align-items: flex-start !important;
    }
    .swpm-username-label, .swpm-password-label{
        width: 6em;
        flex-shrink: 0;
        margin-bottom: .5em;
    }
    .swpm-username-value,
    .swpm-password-value{
        flex-shrink: 0;
        width: 100%;
    }
    .swpm-username-value>input,
    .swpm-password-value>input{
        width: 100% !important;
    }
    .swpm-text-field{
        border-radius: 0.3em;
        border: 1px solid rgb(118,118,118);
    }
    
    .swpm-login-widget-form,.swpm-login-widget-logged,.swpm-registration-widget-form,.swpm-pw-reset-widget-form,.swpm-edit-profile-form{
        width: 100%;
        padding: 0 var(--wp--preset--spacing--40) !important;
        box-sizing: border-box;
        overflow: hidden;
    }
    input{
        box-sizing: border-box;
    }

}
.swpm-login-widget-logged div{
    margin: 1em 0;
}
.swpm-login-widget-logged div div{
    margin: 0;
}
.swpm-username-label,.swpm-password-label{
    text-align: left;
}
.swpm-login-widget-form input,.swpm-login-widget-form checkbox{
    width: auto;
}
.swpm-username-input, .swpm-password-input{
    margin: 0.5em 0 1em 0;
}
.swpm-username-input input, .swpm-password-input input{
    height: 2em;
}
.swpm-username-input, .swpm-password-input{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.login-title, .profile-title{
    text-align: left;
    font-size: xx-large;
    font-weight: bold;
    margin-bottom: 1em;
    color: #0693e3;
}
.swpm-login-form-submit{
    padding: 0.5em 3em;
    background: orange;
    color: #fff;
    font-size: 18px;
    border-radius: 0.5em;
}
.swpm-login-submit{
    margin: 1em 0;
}
.swpm-login-widget-action-msg{
    font-weight: bold;    
}
.swpm-logged-label{
    font-weight: bold;
}
.swpm-join-us-link{
    margin-top: 1em;
}

/* Password reset form CSS */
.swpm-pw-reset-widget-form{
    text-align: center;
    width: fit-content;
}
@media screen and (max-width:768px) {
    .swpm-pw-reset-widget-form{
        width: 100%;
    }
    .swpm-pw-reset-widget-inside .swpm-text-field{
        width: 100%;
        height: 2em;
    }
}
.swpm-pw-reset-email{
    text-align: left;
}
.swpm-pw-reset-submit-button{
    margin: 10px 0px;
}
.swpm-pw-reset-widget-form table{
    border: none;
}
.swpm-pw-reset-widget-form tr{
    border: none;
}
.swpm-pw-reset-widget-form td{
    border: none;
}
.swpm-reset-pw-error{
    font-weight: bold;
    color: red;
}
.swpm-reset-pw-success-box{
    margin: 10px 0px;
    padding: 15px 10px;
    background-color: #CCF4D6;
    border-color: #059B53;
    color: #043B14;
    border-radius: 3px 3px 3px 3px;
    border-style: solid;
    border-width: 1px;    
}

/* Registration form CSS */
.swpm-registration-widget-form{
    text-align: center;
    width: fit-content;
}
.swpm-registration-widget-form td{
    min-width: 100px;
    text-align: left;
}
.swpm-registration-widget-form input[type="text"], .swpm-registration-widget-form input[type="password"]{
    width: 95%;
    position: relative;
}
@media screen and (max-width:768px) {
    .swpm-registration-widget-form input[type="text"],.swpm-registration-widget-form input[type="password"]{
        height: 1.5em;
    }
}
#swpm-accept-terms{
    position: relative;/* needed for the validation message positioning */
}
#swpm-accept-pp{
    position: relative;/* needed for the validation message positioning */
}
.swpm_already_used_registration_complete_link_msg{
    font-weight: bold;
}
.swpm_registration_hidden_to_logged_users_msg{
    font-weight: bold;
}
.swpm_registration_complete_link_invalid_msg{
    font-weight: bold;
}
/* Edit profile form CSS */
.swpm-edit-profile-form{
    border: solid 1px gray;
    width: 35em;
    padding: 2em 1em 0 1em;
}
.swpm-edit-profile-form table{
    width: 100%;
    border-collapse: collapse;
}
.swpm-edit-profile-form table tr td:first-child{
    height: 2em;
    background-color: deepskyblue;
}
.swpm-edit-profile-form input[type="text"], .swpm-edit-profile-form input[type="password"] {
    height: 2em;
    border: 0;
    outline: 0;
    position: relative; /* needed for the validation message positioning */
}
.swpm-edit-profile-form select {
    width: 100%;
    border: 0;
    outline: 0;
    height: 2em;
}
@media screen and (max-width:768px) {
    .swpm-edit-profile-form{
        width: 100%;
        padding: 0;
        overflow: hidden;
        border: 0;
    }
    .profile-title{
        font-size: 1.5em;
        padding: .2em;
        margin-bottom: 0;
        border: solid 1px gray;
        border-bottom: 0;
    }
    .swpm-edit-profile-form table{
        table-layout: fixed;
    }
    .swpm-edit-profile-form table tr td:first-child{
        width: 8em;
    }
    .swpm-edit-profile-form table tr td:last-child{
        overflow: hidden;
    }
    .swpm-edit-profile-form table tr td:last-child input{
        width: 98%;
    }
}
.swpm-edit-profile-submit-section{
    text-align: center;
}
.swpm-profile-account-delete-section{
    text-align: center;
}
.swpm-profile-account-delete-section a{
    color: red !important;
}
.swpm-profile-update-success{
    font-weight: bold;
    color: green;    
}
.swpm-profile-update-error{
    font-weight: bold;
    color: red;    
}
.swpm-edit-profile-submit{
    padding: 0.5em 3em;
    background: orange;
    color: #fff;
    font-size: 18px;
    border-radius: 0.5em;
}

/* Misc CSS */
.swpm-restricted{
    font-weight: bold;
    color:red;
}
.swpm-select-box-left{
    margin: 0;
    padding-bottom: 5px;
}

/* Payments menu CSS */
.swpm_status_completed{
	padding: 7px 15px;
	width: auto;
	display: inline-block;
	text-align: center;
	min-width: 80px;
	border-radius: 4px;
	background-color: #b6e4b6;
}

.swpm_status_refunded{
	padding: 7px 15px;
	width: auto;
	display: inline-block;
	text-align: center;
	min-width: 80px;
	border-radius: 4px;
	background-color: #e4d4b6;
}

.swpm_status_general{
	padding: 7px 15px;
	width: auto;
	display: inline-block;
	text-align: center;
	min-width: 80px;
	border-radius: 4px;
	background-color: #dedede;
}

.swpm_status_subscription, .swpm_status_subscription_created{
	padding: 7px 15px;
	width: auto;
	display: inline-block;
	text-align: center;
	min-width: 80px;
	border-radius: 4px;
	background-color: #b6dee4;
}
