.virtual-wallet-container {
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
    background-color: #e6e8ec;
}

.virtual-wallet-fields .form-row {
    margin: 0 0 15px !important;
    padding: 0 !important;
}

/* Specific selector for labels */
.virtual-wallet-fields .form-row .form-row-wide label {
    font-size: 18px !important; /* Set label font size to 18px */
    display: block !important; /* Ensure labels are on their own line */
    margin-bottom: 8px !important; /* Add some spacing between label and input */
    line-height: 1.5 !important; /* Adjust line height to match your design */
}

/* Specific selector for input fields */
.virtual-wallet-fields .form-row .form-row-wide input[type="text"] {
    width: 100% !important; /* Ensure input fields are 100% width */
    padding: 12px !important;
    margin-bottom: 10px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 16px !important; /* Input field font size */
    box-sizing: border-box !important; /* Ensure padding doesn't affect width */
}

/* Specific selector for the Send OTP button */
.virtual-wallet-fields .form-row .form-row-wide #send-otp button {
    width: 100% !important; /* Ensure button is 100% width */
    margin-top: 15px !important; /* Set top margin to 15px */
    padding: 12px !important;
    background-color: #1b8edb !important;
    color: white !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: background-color 0.3s !important;
    font-size: 16px !important; /* Button font size */
    box-sizing: border-box !important; /* Ensure padding doesn't affect width */
}

#send-otp:hover {
    background-color: #4f6ef5 !important;
}

#send-otp:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    background-color: #368bb3 !important;
}

/* Balance Info Styling */
.balance-info {
    margin: 15px 0 !important;
    padding: 12px !important;
    background: #f8fff0 !important;
    border-left: 4px solid #1692cc !important;
    color: #4d4d4d !important;
    font-size: 14px !important;
}

.balance-info strong {
    color: #0e131a !important;
}

.balance-amount {
    color: #0b81cf !important;
    font-weight: 700 !important;
    margin-left: 5px !important;
}

/* Notices Styling */
.place-order-notice {
    margin: 10px 0 !important;
    padding: 15px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
}

/* Custom style for "Click PLACE ORDER" notice */
.virtual-wallet-container .general-notice .woocommerce-message {
    background-color: #ffffff !important; /* White background */
    color: #17b5f3 !important; /* Blue text */
    border-radius: 10px !important; /* Rounded corners */
    padding: 12px !important;
    border-left: none !important; /* Remove the left border */
    margin: 10px 0 !important;
    font-weight: bold !important;
    font-size: 16px !important; /* Larger font size for better readability */
}

/* Ensure error messages are visible */
.virtual-wallet-container .woocommerce-error {
    display: block !important;
    color: #b81c23 !important; /* Red text for errors */
    background-color: #ffffff !important; /* White background */
    padding: 12px !important;
    border-radius: 4px !important;
    margin: 10px 0 !important;
    font-size: 16px !important; /* Larger font size for better readability */
}

.woocommerce-message,
.woocommerce-error {
    padding: 1em 2em 1em 3.5em !important;
    margin: 0 0 2em !important;
    position: relative !important;
    background-color: #ffffff !important; /* White background */
    color: #515151 !important;
    border-top: 3px solid #1b8cae !important;
    list-style: none outside !important;
    width: auto !important;
    word-wrap: break-word !important;
}

.woocommerce-error {
    background: #ffffff !important; /* White background */
    border-top-color: #b81c23 !important;
}

.woocommerce-message {
    background: #ffffff !important; /* White background */
    border-top-color: #ebebeb !important;
}

/* Loading Spinner Styling */
.loading-spinner {
    display: none !important;
    font-weight: bold !important;
    color: #0073aa !important; /* Blue color */
    margin-top: 10px !important;
}

.loading-spinner::after {
    content: '...';
    animation: typing 1.5s infinite;
}

@keyframes typing {
    0%, 20% { content: '.'; }
    40% { content: '..'; }
    60%, 100% { content: '...'; }
}

/* OTP Field Validation */
#virtual-wallet-otp.valid {
    border-color: #1b8cae !important;
}

#virtual-wallet-otp.invalid {
    border-color: #b81c23 !important;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .place-order-notice .woocommerce-message,
    .place-order-notice .woocommerce-error {
        padding: 1em !important;
        font-size: 14px !important;
    }

    #send-otp {
        width: 100% !important;
        margin-top: 15px !important;
    }
}