/* Extracted from Home/PayNew.cshtml. */
.payment-page {
        max-width: 1180px;
        margin: 20px auto 40px;
        padding: 24px 28px 30px;
        border: 1px solid #e0eaf7;
        border-radius: 14px;
        background: linear-gradient(135deg, #f4f8ff, #fff 55%, #eef5ff);
        box-shadow: 0 10px 30px rgba(34, 78, 145, .14);
        color: #24324a;
        font-family: 'Be Vietnam Pro', 'Segoe UI', Arial, sans-serif;
    }

    .payment-page > div:first-child h2 {
        margin: 0 0 24px;
        padding: 16px 20px;
        border-radius: 12px;
        color: #fff !important;
        background: linear-gradient(135deg, #2457c5, #4385ed);
        box-shadow: 0 7px 18px rgba(36, 87, 197, .25);
        font-size: clamp(21px, 2.4vw, 30px);
        font-weight: 700;
    }

    .payment-page .section,
    .payment-page > form > .row > div,
    .payment-page .fieldset,
    .payment-page #section-payment-method {
        border-radius: 12px;
    }

    .payment-page .section-header {
        margin-bottom: 12px;
        padding: 15px 18px;
        border-radius: 12px 12px 0 0;
        background: linear-gradient(135deg, #eef5ff, #fff);
        border-bottom: 1px solid #dce7f5;
    }

    .payment-page .section-title {
        margin: 0;
        color: #173b78;
        font-size: 19px;
        font-weight: 700;
    }

    .payment-page .col-lg-7 > .fieldset,
    .payment-page #section-payment-method {
        padding: 12px;
        border: 1px solid #dce7f5;
        background: #fff;
        box-shadow: 0 7px 12px rgba(34, 78, 145, .1);
    }

    .payment-page .field-label {
        display: block;
        margin-bottom: 7px;
        color: #344563;
        font-size: 14px;
        font-weight: 600;
    }

    .payment-page .form-control {
        min-height: 44px;
        border: 1px solid #cbdaf2;
        border-radius: 9px;
        box-shadow: none;
    }

    .payment-page .form-control:focus {
        border-color: #5590ee;
        box-shadow: 0 0 0 3px rgba(85, 144, 238, .14);
    }

    .payment-page .form-check {
        display: flex;
        align-items: center;
        min-height: 48px;
        margin: 8px 0;
        padding: 10px 13px;
        border: 1px solid #e0eaf7;
        border-radius: 9px;
        background: #f8fbff;
        transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    }

    .payment-page .form-check:hover {
        transform: translateY(-2px);
        border-color: #8ab2ed;
        box-shadow: 0 5px 13px rgba(36, 87, 197, .12);
    }

    .payment-page .form-check-input {
        margin: 0 10px 0 0;
        accent-color: #2457c5;
    }

    .payment-page .radio-label-primary {
        color: #344563;
        font-weight: 600;
    }

    .payment-page .boxContent {
        margin-top: 12px;
        padding: 14px;
        border: 1px solid #f1d7a0;
        border-radius: 10px;
        background: #fffaf0;
    }

    .payment-page .boxContent p { color: #856404; line-height: 1.6; }

    .payment-page .cardList {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin: 12px 0 0;
        padding: 0;
    }

    .payment-page .bank-online-methods {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 78px;
        min-height: 58px;
        padding: 6px;
        border: 1px solid #e0eaf7;
        border-radius: 8px;
        background: #fff;
        box-shadow: 0 3px 8px rgba(34, 78, 145, .08);
    }

    .payment-page .bank-online-methods input { margin: 4px; accent-color: #2457c5; }

    .payment-page > form > div:last-child {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        margin-top: 12px !important;
        padding-top: 0;
        text-align: center;
    }

    .payment-page .btn {
        flex: 1 1 0;
        max-width: 280px;
        min-height: 42px;
        padding: 10px 16px;
        border: 0;
        border-radius: 9px;
        font-weight: 600;
        box-shadow: 0 5px 13px rgba(34, 78, 145, .18);
        transition: transform .2s ease, box-shadow .2s ease;
    }

    .payment-page .btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 18px rgba(34, 78, 145, .28);
    }

    .payment-page .btn-success { background: linear-gradient(135deg, #198754, #2fb878); }
    .payment-page .btn-danger { background: linear-gradient(135deg, #d9534f, #ef7770); }

    @media (max-width: 767px) {
        .payment-page { margin: 10px 8px 24px; padding: 15px 10px 20px; }
        .payment-page .col-lg-7 > .fieldset,
        .payment-page #section-payment-method { padding: 14px; }
        .payment-page > form > div:last-child { gap: 8px; }
        .payment-page > form > div:last-child .btn { width: 50%; max-width: none; padding-left: 8px; padding-right: 8px; }
        .payment-page .cardList { justify-content: center; }
    }