
/*
      MD bootstrap form components styles override START
*/

.custom-material-form .md-form label {
    left: 10px !important;
    color: #000 !important;
    text-align: left;
    font-weight: 500;
    transform: translateY(14px);
}

.custom-material-form .md-form label.active {
    left: 10px !important;
    transform: translateY(-4px) scale(.7) !important;
}

.custom-material-form .md-form {
    margin-bottom: 2rem !important;
    margin-top: 0 !important;
}

.custom-material-form .md-form.no-bottom-margin{
    margin-bottom: 0 !important;
}   

.custom-material-form .md-form.checkout-checkbox{
    margin-bottom: 0!important;
}

.custom-material-form .md-form.checkout-checkbox label {
    left: 0px !important;
    transform: translateY(5px) !important;
}

.custom-material-form #p2pShareByEmailRows .md-form {
    margin-bottom: 0 !important;
}

.custom-material-form .new-design-controls .md-form-block {
    margin-bottom: 24px;
}

.custom-material-form .new-design-controls .md-form,
.custom-material-form .new-design-controls .md-form .form-control {
    margin-bottom: 0 !important;
}

.custom-material-form .new-design-controls .divider {
    margin: 20px 0;
}

.custom-material-form .new-design-controls .form-control:focus ~ .inputLabel,
.custom-material-form .new-design-controls .inputLabel.active {
    visibility: hidden;
}

.custom-material-form .new-design-controls .form-control.invalid ~ .inputLabel.active::after,
.custom-material-form .new-design-controls .form-control.invalid ~ .input-error,
.custom-material-form .new-design-controls .input-error.active {
    display: block;
}

.custom-material-form .new-design-controls .form-control.invalid ~ .input-error ~ .input-subtitle,
.custom-material-form .new-design-controls .input-error.active ~ .input-subtitle {
    display: none;
}

.custom-material-form .new-design-controls .input-error {
    display: none;
    margin-top: 6px;
    color: var(--colors-text-text-error-primary-600, #D92D20);
    font-family: var(--Font-family-font-family-body, Inter, Roboto, sans-serif);
    font-size: var(--Font-size-text-sm, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Line-height-text-sm, 20px);
    transition: .2s opacity ease-out,.2s color ease-out;
}

.custom-material-form .new-design-controls .input-error.input-error--select {
    visibility: visible
}

.custom-material-form .new-design-controls textarea:hover,
.custom-material-form .new-design-controls textarea:focus,
.custom-material-form .new-design-controls .md-form input:hover,
.custom-material-form .new-design-controls .md-form input:focus {
    background-color: white !important;
}
.custom-material-form .new-design-controls .md-form input.valid {
    background-color: white !important;
}
.custom-material-form .new-design-controls .md-form input.invalid {
    background-color: white !important;
}
.custom-material-form .new-design-controls .md-form input.disabled {
    background-color: rgba(249, 250, 251, 1) !important;
    border-color: rgba(208, 213, 221, 1) !important;
    color: rgba(102, 112, 133, 1) !important;
}

.custom-material-form .new-design-controls .select-wrapper input.select-dropdown {
    border-radius: var(--radius-md, 8px) !important;
    border: 1px solid var(--Colors-Border-border-primary, #D0D5DD) !important;
    background: var(--Colors-Background-bg-primary, #FFF) !important;
    color: var(--colors-text-text-primary-900, #101828) !important;
}
.custom-material-form .new-design-controls .select-wrapper input + li.disabled {
    color: #9c9c9c;
}

.custom-material-form .new-design-controls .select-wrapper .caret{
    top: 14px;
    right: 16px;
    z-index: 3;
}

.custom-material-form .new-design-controls .form-control {
  background-color: white !important;
  border: 1px solid #D0D5DD !important;
  padding: 10px 14px !important;
  color: var(--colors-text-text-primary-900, #101828) !important;
  box-shadow: 0px 1px 2px 0px var(--Colors-Effects-Shadows-shadow-xs, rgba(16, 24, 40, 0.05));
}
.custom-material-form .new-design-controls .form-control::placeholder {
    color: #9c9c9c;
}

.custom-material-form .new-design-controls .form-control:focus {
    border: 2px solid var(--Colors-Border-border-brand, #9E77ED) !important;
}
.custom-material-form .new-design-controls .form-control.invalid {
    border: 1px solid var(--Colors-Border-border-error_subtle, #FDA29B) !important;
}
.custom-material-form .new-design-controls .form-control.invalid:focus {
    border: 2px solid var(--Colors-Border-border-error, #F04438) !important;
}

.custom-material-form .new-design-controls input.form-control.form-control--dark {
    color: var(--colors-text-text-primary-900, #101828) !important;
}

.custom-material-form .new-design-controls input.form-control ,
.custom-material-form .new-design-controls .form-control.appGoogleMapsAutocomplete{
  height: 46px !important;
  border-radius: 8px !important;
}

.custom-material-form .new-design-controls input.form-control.form-control--icon-left {
    padding-left: 40px !important;
}
.custom-material-form .new-design-controls input.form-control.form-control--icon-right {
    padding-right: 40px !important;
}

.custom-material-form .new-design-controls .input-icon {
    position: absolute;
    top: 24px;
    transform: translateY(-50%);
}

.custom-material-form .new-design-controls input.form-control.form-control--icon-left ~ .input-icon {
    left: 12px;
}
.custom-material-form .new-design-controls input.form-control.form-control--icon-right ~ .input-icon {
    right: 12px;
}

.custom-material-form .new-design-controls .input-currency {
    display: flex;
    padding: 8px var(--spacing-lg, 12px) 8px 14px;
    align-items: center;
    border: 1px solid #D0D5DD;
    border-right: none;
    border-radius: var(--spacing-md, 8px) var(--spacing-none, 0px) var(--spacing-none, 0px) var(--spacing-md, 8px);

    color: var(--colors-foreground-fg-tertiary-600, #475467);
    font-family: var(--Font-family-font-family-body, Inter, Roboto, sans-serif);
    font-size: var(--Font-size-text-md, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Line-height-text-md, 24px);
}

.custom-material-form .new-design-controls .md-form .form-control.currency {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.custom-material-form .new-design-controls .form-outline .form-control {
  padding: 10px !important
}

.custom-material-form .new-design-controls .input-title {
    color: var(--colors-text-text-secondary-700, #344054);
    margin-bottom: 6px;
    font-family: var(--Font-family-font-family-body, Inter, Roboto);
    font-size: var(--Font-size-text-sm, 14px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--Line-height-text-sm, 20px);
}
.custom-material-form .new-design-controls .input-title .asterisk {
    color: var(--colors-text-text-brand-tertiary-600, #7F56D9);
}

.custom-material-form .new-design-controls .input-title .asterisk.invalid,
.custom-material-form .new-design-controls .md-form-block:has(.form-control.invalid) .input-title .asterisk,
.campaign-form-container .item-field:has(.form-control.invalid) .input-title .asterisk {
    color: red;
}

.custom-material-form .new-design-controls .input-subtitle {
    margin-top: 6px;
    color: var(--colors-text-text-tertiary-600, #475467);
    font-family: var(--Font-family-font-family-body, Inter, Roboto, sans-serif);
    font-size: var(--Font-size-text-sm, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Line-height-text-sm, 20px);
    transition: .2s opacity ease-out,.2s color ease-out;
}

.custom-material-form .new-design-controls .input-title p,
.custom-material-form .new-design-controls .input-subtitle p {
    margin-bottom: 6px;
}

.custom-material-form .new-design-controls .inputLabel {
    transform: translateY(10px);
    color: #667085 !important;
    text-overflow: ellipsis;

    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.15px !important;
}

.custom-material-form .new-design-controls .inputLabel:after {
    top: 60px !important;
    left: -12px;
}
.custom-material-form .new-design-controls .inputLabel.right-top-error:after {
    top: -20px !important;
    right: -215px; 
    left: auto;
}
.custom-material-form .new-design-controls .select-wrapper input.select-dropdown {
    margin-bottom: 0;
}

.custom-material-form textarea,
.custom-material-form .md-form input,
.custom-material-form .select-wrapper input.select-dropdown {
    border-radius: 5px!important;
    border: solid 0.5px rgba(0, 0, 0, 0.14) !important;
    background-color: #f1f2f5!important;
    font-weight: 400 !important;
    font-size: 15px !important;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    line-height: 1.6 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-top: 20px !important;
    box-sizing: border-box !important;
    height: 55px;
    color: #676767!important;
}

.custom-material-form.smaller-inputs .md-form input{
    height: 35px !important;
    padding-top: 0px !important;
}

.custom-material-form.angular-custom-material-form .select-wrapper input.select-dropdown,
.custom-material-form.angular-custom-material-form .md-form input,
.custom-material-form.angular-custom-material-form .md-form input:hover,
.custom-material-form.angular-custom-material-form .md-form input:focus{
    border: none !important;
    background-color:#f1f2f5!important;
}

.custom-material-form .md-form input.pac-target-input {
    padding-top: 7px !important;
}

.custom-material-form .md-form input.pac-target-input.clear {
    padding-right: 36px !important;
}

.custom-material-form textarea:hover,
.custom-material-form textarea:focus,
.custom-material-form .md-form input:hover,
.custom-material-form .md-form input:focus {
    background-color: #F1F2F5 !important;
    border: 1px solid rgba(0, 0, 0, 0.14) !important;
    border-radius: 5px !important;
    color: #000 !important;
    box-shadow: none !important;
}

.custom-material-form .md-form input.valid {
    background-color: #F1F2F5 !important;
    border: 1px solid rgba(0, 0, 0, 0.14) !important;
    box-shadow: none !important;
}

.custom-material-form .md-form input.invalid {
    background-color: #F1F2F5 !important;
    border: 1px solid #f44336 !important;
    box-shadow: none !important;
}

.custom-material-form .md-form label:after {
    top: 4.5rem !important;
}

.custom-material-form.updated-dropdown .select-wrapper input.select-dropdown{
    padding: 12px !important;
    height: 35px !important;
}
.custom-material-form.updated-dropdown .caret{
    top: 12px!important;
    right: 16px !important;
    z-index: 3 !important;
}
.select-wrapper.mdb-select--paybee span.caret {
    right: 16px;
    z-index: 3;
    top: 20px;
}
.custom-material-form.updated-dropdown .search-wrap input{
    padding-top: 5px!important;
}

.form-check-input[type=checkbox].filled-in:not(:checked) + label:after,
.form-check-input[type=checkbox].filled-in:checked + label:after,
label.btn input[type=checkbox].filled-in:not(:checked) + label:after,
label.btn input[type=checkbox].filled-in:checked + label:after {
    top: 0 !important;
}

.custom-material-form .md-form > input[type=time]:not(.browser-default) + label,
.custom-material-form .md-form > input[type]:-webkit-autofill:not(.browser-default):not([type=search]) + label {
    font-size: 15px !important;
    transform-origin: bottom left !important;
}

input:-webkit-autofill {
    background-color: #F1F2F5 !important;
}

.custom-material-form .select-wrapper input.select-dropdown,
.angular-custom-material-form .select-wrapper input.select-dropdown {
    padding-bottom: 20px !important;
}

.custom-material-form .dropdown-content {
    border-radius: 5px !important;
}

.custom-material-form .inputCustom {
    padding-bottom: 0;
}

.custom-material-form .card-body {
    padding: 1.25rem 1.25rem 0 !important;
}

.custom-material-form .card-body.card-body--auction-option {
    padding: 12px !important;
}

.custom-material-form .card-body.card-body--bid-section {
    padding: 20px !important;
}

.custom-material-form h6 {
    /*font-size: 1.693vmin;!*13px; *!*/
    font-size: 13px;
    font-weight: 500;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    color: rgba(0, 0, 0, 0.36);
}

/*
     MD bootstrap form components styles override END
*/

.custom-material-form .amount-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
}

.custom-material-form .amount-wrapper .md-form {
    min-width: 80%;
    margin-bottom: 0!important;
    padding-right: 10px;
}

.custom-material-form .auction-amount-wrapper {
    width: calc(100% - 170px);
    margin-bottom: 10px;
}

.custom-material-form .auction-amount-wrapper .md-form {
    margin-bottom: 0!important;
    padding-right: 10px;
    width: 100%;
}

.custom-material-form .amount-wrapper h6.min-bid-inc {
    font-weight: 500;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    /*font-size: 1.693vmin;!*13px; *!*/
    font-size: 13px;
    color: rgba(0, 0, 0, 0.36);
    text-align: left;
}

.custom-material-form .card-footer {
    background-color: white!important;
    border: none;
}

.custom-material-form hr.dilimeter {
    align-self: center;
    border-top: 1px solid rgba(0,0,0,.06);
    margin-bottom: 1.5rem!important;
    margin-top: 1rem!important;
}

.custom-material-form .winner-name {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

.item-value {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

#register .custom-material-form .md-form,
#rsvpConfirm .custom-material-form .md-form {
    margin-bottom: 1.5rem !important;
    margin-top: 0 !important;
}

#register .custom-material-form .md-form .validate,
#rsvpConfirm .custom-material-form .md-form .validate {
    margin-bottom: 1.5rem !important;
}
#register .custom-material-form textarea,
#register .custom-material-form .md-form input,
#register .custom-material-form .select-wrapper input.select-dropdown,
#rsvpConfirm .custom-material-form textarea,
#rsvpConfirm .custom-material-form .md-form input,
#rsvpConfirm .custom-material-form .select-wrapper input.select-dropdown {
    height: 50px;
}

.form-check-input.form-check-input--purple {
    display: none !important;
}

.form-check-label.form-check-label--purple {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
    padding-left: 50px !important;
    color: #344054 !important;
}

.form-check-label.form-check-label--purple::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 36px !important;
    height: 20px !important;
    margin-top: 0 !important;
    background-color: var(--Colors-Background-bg-quaternary, #E4E7EC);
    border-radius: 15px !important;
    border: none !important;
    transition: background-color 0.3s !important;
}
@media (hover: hover) {
    .form-check-label.form-check-label--purple:hover::before,
    .form-check-input.form-check-input--purple:checked + .form-check-label.form-check-label--purple:hover::before {
        background: var(--Colors-Background-bg-brand-solid_hover, #6941C6);
    }
}

.form-check-label.form-check-label--purple::after {
    content: '' !important;
    position: absolute !important;
    left: 3px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    margin-top: 0 !important;
    background-color: #ffffff !important;
    box-shadow: 0px 1px 3px 0px var(--Colors-Effects-Shadows-shadow-sm_01, rgba(16, 24, 40, 0.10)), 0px 1px 2px 0px var(--Colors-Effects-Shadows-shadow-sm_02, rgba(16, 24, 40, 0.06));
    border-radius: 50% !important;
    transition: transform 0.3s !important;
}

.form-check-input.form-check-input--purple:checked + .form-check-label.form-check-label--purple::before {
    background: var(--Colors-Background-bg-brand-solid, #7F56D9);
}
.form-check-input.form-check-input--purple:checked + .form-check-label.form-check-label--purple::after {
    transform: translate(14px, -50%) !important;
}

/* Purple Checkbox styles start */

.form-check-input.form-check-input--redesign {
    inset: 0 0 0 0;
    width: 16px;
    height: 16px;
}
label.form-check-label.form-check-label--redesign {
    padding-left: 24px;
    height: auto;
    line-height: normal;
}

/* Checkbox box */
.form-check-input.form-check-input--redesign + label.form-check-label.form-check-label--redesign:after {
    content: "";
    position: absolute;
    margin-top: 0;
    left: 0;
    top: 50% !important;
    transform: translateY(-50%);   
    width: 16px;
    height: 16px;
    background-color: #FFF;
    border-radius: var(--spacing-xs, 4px);
    border: 1px solid var(--Colors-Border-border-primary, #D0D5DD);
    box-sizing: border-box;
}

.form-check-input.form-check-input--redesign:checked + .form-check-label.form-check-label--redesign::after {
    top: 0;
    width: 16px;
    height: 16px;
    border: none;
    border-radius: var(--spacing-xs, 4px);
    background: var(--Colors-Background-bg-brand-solid, #7F56D9);
}

/* Checkbox mark */
label.form-check-label.form-check-label--redesign::before {
    margin-top: 0;
    width: auto;
    height: auto;
    border: none;
    transition: none;
    z-index: 1;
}

.form-check-input.form-check-input--redesign:checked + .form-check-label.form-check-label--redesign::before {
    margin-top: 0;
    top: 50% ;
    transform: translateY(-50%);   
    left: 3px;
    width: auto;
    height: auto;
    border: none;
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="8" viewBox="0 0 10 8" fill="none"><path d="M9 1L3.5 6.5L1 4" stroke="white" stroke-width="1.6666" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}

/* Purple Checkbox styles end */