/* Payment methods — V2 cards, controls, and states. */

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
    background: transparent;
}

#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
    margin: 0;
    padding: 0;
    border: 0;
}

#add_payment_method #payment ul.payment_methods li,
.woocommerce-cart #payment ul.payment_methods li,
.woocommerce-checkout #payment ul.payment_methods li {
    margin: 0 0 10px;
    line-height: inherit;
}

#add_payment_method #payment div.form-row,
.woocommerce-cart #payment div.form-row,
.woocommerce-checkout #payment div.form-row {
    padding: 0;
}

.osp-3sc-payment-method {
    overflow: hidden;
    border: 0;
    border-radius: var(--osp-radius-card);
    background: var(--osp-surface-floating);
    cursor: pointer;
    transition: background-color 160ms ease;
}

.osp-3sc-payment-method:hover {
    background: color-mix(in srgb, var(--osp-surface-floating) 90%, var(--osp-foreground));
}

.osp-3sc-payment-method:has(.osp-3sc-payment-method-input:checked) {
    background: var(--osp-option-selected-background);
    box-shadow: none;
}

.osp-3sc-payment-method:has(.osp-3sc-payment-method-input:checked):hover {
    background: var(--osp-option-selected-background);
}

.osp-3sc-payment-method-content {
    min-height: 62px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
}

.osp-3sc-payment-radio {
    flex: 0 0 auto;
    display: flex;
}

.osp-3sc-payment-method-input {
    width: 20px;
    height: 20px;
    margin: 0;
    appearance: none;
    border: 1px solid var(--osp-glass-border);
    border-radius: var(--osp-radius-full);
    background: var(--osp-surface);
    cursor: pointer;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.osp-3sc-payment-method-input:hover {
    border-color: var(--osp-border-hover);
}

.osp-3sc-payment-method-input:checked {
    border-color: var(--osp-action);
    background-color: var(--osp-surface);
    background-image: radial-gradient(circle, var(--osp-action) 0 5px, transparent 5px);
}

.osp-3sc-payment-method-input:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--osp-focus-ring) 18%, transparent);
}

.osp-3sc-payment-title {
    min-width: 0;
    flex: 1;
}

.osp-3sc-payment-title {
    margin: 0;
    color: var(--osp-text-primary);
    font-size: 15px;
    font-weight: 650;
    line-height: 1.35;
    cursor: inherit;
}

.osp-3sc-payment-icons {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 4px;
}

.osp-3sc-payment-icons img {
    max-height: 20px;
    width: auto;
}

.woocommerce-checkout #payment .payment_method_coinbase img {
    max-width: 20px;
}

.woocommerce-checkout #payment .osp-3sc-payment-icons img[alt="Maestro"],
.woocommerce-checkout #payment .osp-3sc-payment-icons img[alt="JCB"],
.woocommerce-checkout #payment .osp-3sc-payment-icons img[alt="Discover"] {
    display: none !important;
}

.woocommerce-checkout #payment .osp-3sc-payment-icons img[alt="PayPal"] {
    max-width: 82px;
}

#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
    margin: 0;
    padding: 2px 18px 18px;
    border: 0;
    background: transparent;
    color: var(--osp-text-secondary);
    font-family: var(--osp-font-sans);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
}

#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
    display: none;
}

#add_payment_method #payment div.payment_box p,
.woocommerce-cart #payment div.payment_box p,
.woocommerce-checkout #payment div.payment_box p {
    color: var(--osp-text-secondary);
}

#add_payment_method #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number),
.woocommerce-cart #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number),
.woocommerce-checkout #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number) {
    width: 100% !important;
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid var(--osp-border);
    border-radius: var(--osp-radius-card);
    background: var(--osp-surface) !important;
    background-image: none !important;
    color: var(--osp-text-primary) !important;
    font-size: 15px;
    transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

#add_payment_method #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number):is(:hover, :focus, :active),
.woocommerce-cart #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number):is(:hover, :focus, :active),
.woocommerce-checkout #payment div.payment_box :is(input.input-text, textarea, select, .wc-credit-card-form-card-cvc, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-number):is(:hover, :focus, :active) {
    border-color: var(--osp-border-strong);
    background: var(--osp-surface) !important;
}

#nmi-card-cvc {
    width: 100% !important;
}

.woocommerce-SavedPaymentMethods li {
    display: flex;
}

.woocommerce-SavedPaymentMethods-saveNew {
    display: none !important;
}

#wc-nmi-new-payment-method {
    height: 20px;
    margin-right: 9px;
}

.osp-3sc-checkout-container.payment-step {
    display: grid;
}

.secure-payment-message {
    margin-top: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--osp-accent);
    font-size: 13px;
    font-weight: 550;
    line-height: 1.4;
    text-align: center;
}

.secure-payment-message svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.woocommerce-checkout .fp-get-funded-btn {
    display: none !important;
}

.woocommerce-checkout .recurring-total th,
.woocommerce-checkout .recurring-total td {
    color: var(--osp-text-secondary) !important;
    font-size: 15px !important;
}

@media (max-width: 477px) {
    .osp-3sc-payment-method-content {
        padding: 13px 14px;
        gap: 10px;
    }

    .osp-3sc-payment-icons {
        gap: 3px;
    }

    .osp-3sc-payment-icons img {
        width: auto !important;
        max-height: 18px !important;
    }

    .woocommerce-checkout #payment .osp-3sc-payment-icons img[alt="PayPal"] {
        max-width: 76px !important;
    }

    .woocommerce-checkout #payment .payment_method_coinbase .osp-3sc-payment-icons img {
        max-width: 20px !important;
    }

    #add_payment_method #payment div.payment_box,
    .woocommerce-cart #payment div.payment_box,
    .woocommerce-checkout #payment div.payment_box {
        padding: 2px 14px 16px;
    }
}
