/* trackpipe/public/css/fan/signup/fan_signup_common_phone_extra.css */
/* common buttons */
.signup-common-form button,
.ui-dialog.nu-dialog .signup-common-form button {
    background: rgb(0,161,198);
    border-radius: 4px;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border: none;

    height: auto;
    min-height: 36px;
    padding: 0.2em 1em;
    vertical-align: top;
}
.signup-common-form button:hover,
.ui-dialog.nu-dialog .signup-common-form button:hover {
    background: rgb(0,161,198);
    border: none;
}
.signup-common-form button:active,
.ui-dialog.nu-dialog .signup-common-form button:active {
    background: rgb(0,161,198);
    border: none;
}
.signup-common-form button[disabled],
.ui-dialog.nu-dialog .signup-common-form button[disabled],
.signup-common-form button[disabled]:hover,
.ui-dialog.nu-dialog .signup-common-form button[disabled]:hover {
    background: #555;
    color: #ccc;
    opacity: 0.3;
    border: none;
}

.ui-widget-content .signup-common-form a,
.signup-common-form a {
    color: rgb(0,161,198);
}

.ui-dialog.nu-dialog.blank-title .ui-dialog-titlebar {
    border: none;
    background-color: #FFF;
}

.ui-dialog.nu-dialog.blank-title .ui-dialog-content {
    padding-top: 0;
}

/* fan action form */

.action-form {
    font-size: 16px;
    line-height: 20px;
}

.action-form .buttons {
    margin: 20px auto 0 auto;
}

.action-form .buttons button {
    width: 47%;
    margin-right: 0;
}

.action-form .buttons button.signup {
    margin-right: 4%;
}

.ui-dialog.nu-dialog .signup-common-form button.submit {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
}

.ui-dialog.nu-dialog .action-form button.login {
    background-color: #FFF;
    color: rgb(0,161,198);
    border: 1px solid rgb(0,161,198);
}

.modal-welcome-message {
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.welcome-form .buttons {
    margin: 20px auto 0 auto;
}

.welcome-form .buttons button {
    width: 47%;
    margin-right: 0;
}

.welcome-form .buttons button.signup {
    margin-right: 4%;
}

.welcome-form .buttons button.ok-button {
    background-color: #FFF;
    color: rgb(0,161,198);
    border: 1px solid rgb(0,161,198);
}

.welcome-form .buttons {
    display: inline-block;
    width: 100%;
}

.welcome-form .buttons .get-app {
    margin-right: 4%;
}

.welcome-form .buttons .ok-button.unsupported {
    display: block;
    margin: 0 auto;
}

.verify-nag.signup-common-form {
     width: auto; 
}

.verify-nag button.nag-send-again,
.verify-nag button.nag-cancel {
    width: 46%;
}

.verify-nag .nag-fan-email {
}

.verify-nag .nag-email-change {
    display: block;
    margin: 24px 0 24px 0;
}

.signup-common-form .signup-common-form button.nag-send-again,
.ui-dialog.nu-dialog .signup-common-form button.nag-send-again {
    padding: 0.2em 0.6em;
}


/* invisible recaptcha used by captcha.js */

#global-invisible-recaptcha .grecaptcha-badge {
    z-index: 2000; /* this needs to be above modal dialog backdrop */
}

/* don't show tooltips on mobile */

.signup-tooltip-outer {
    display: none;
}

#menubar-verify-banner {
    display: none;
}


/* account chooser form */
.choose-account-form ul.accounts-list {
    list-style: none;
    margin: 18px auto 35px auto;
    padding: 0;
    width: 100%;
}

.choose-account-form ul.accounts-list .account {
    display: block;
    font-size: 0;
    padding-bottom: 26px;
    border-bottom: none;
}
.choose-account-form ul.accounts-list .account:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}

.choose-account-form .account.artist,
.choose-account-form .account.artist a {
    color: #6E943B;
}

.choose-account-form .account.label,
.choose-account-form .account.label a {
    color: #6F49A1;
}

.choose-account-form .account > * {
    display: inline-block;
    font-size: 12px;
    vertical-align: top;
}

.choose-account-form .account .icon {
    width: 50%;
    height: 126px;
}
.choose-account-form .account.label .icon {
    background: url('https://s4.bcbits.com/img/icon-labels.svg') 50% 50% no-repeat;
}
.choose-account-form .account.fan .icon {
    background: url('https://s4.bcbits.com/img/icon-fans.svg') 50% 50% no-repeat;
}
.choose-account-form .account.artist .icon {
    background: url('https://s4.bcbits.com/img/icon-artists.svg') 50% 50% no-repeat;
}

.choose-account-form .account .description {
    color: #818285;
    width: 86%;
    line-height: 17px;
    font-size: 14px;
    margin: -18px auto 0px auto;
    display: flex;
    flex-direction: column-reverse;
    text-align: justify;
}
.choose-account-form .account .description .text {
    padding: 0px 10px;
}

.choose-account-form .account .signup-button {
    width: 100%;
    text-align: center;
    display: block;
    border-radius: 3px;
    border: 1px solid rgb(0,161,198);
    color: rgb(0,161,198);
    font-size: 15px;
    font-weight: 600;
    padding: 8px 0 7px 0;
    margin: 24px auto 0px auto;
    box-sizing: border-box;
}
#signup-vm.choose-account-form.signup-common-form .description .text a,
#signup-vm.choose-account-form.signup-common-form .description .text a:active,
#signup-vm.choose-account-form.signup-common-form .description .text a:visited {
    text-decoration: none;
    font-weight: normal;
}

.choose-account-form .account .signup-button:hover,
.choose-account-form .account a:hover {
    text-decoration: underline;
}

.choose-account-form .account.artist .signup-button {
    border-color: #6E943B;
}

.choose-account-form .account.label .signup-button {
    border-color: #6F49A1;
}

.choose-account-form .account.artist .circle {
    background: rgba(110,148,59, 0.1);
}

.choose-account-form .account.label .circle {
    background: rgba(111,73,161, 0.1);
}

.signup-common-title {
    font-size: 18px;
    font-weight: 600;
    color: #2e3332;
}
.signup-common-form.standalone{
    opacity: 1;
}