/* _content/Ex_Feedback/Areas/Signup/Pages/Index.cshtml.rz.scp.css */
.form-container[b-1dy2eefrc8] {
    max-width: 420px;
    width: 100%;
}

    .form-container input[b-1dy2eefrc8] {
        border: 1px solid #1BB76D;
    }

    .form-container select[b-1dy2eefrc8] {
        border: 1px solid #1BB76D;
    }

.btn-success[b-1dy2eefrc8] {
    background-color: #1BB76D !important;
    font-weight: bold;
    font-size: 1.125rem;
    border: none;
}

    .btn-success:hover[b-1dy2eefrc8] {
        background-color: #198754 !important;
    }

.form-check-input[b-1dy2eefrc8] {
    width: 40px;
    height: 20px;
    background-color: #1BB76D;
}

.text-success[b-1dy2eefrc8] {
    color: #1BB76D !important;
}

[b-1dy2eefrc8] .verify-email-btn {
    background: transparent !important;
    border: none !important;
}

[b-1dy2eefrc8] .verfiy-otp-btn {
    padding: 10.53px 16px !important;
}

.email-input[b-1dy2eefrc8] {
    position: relative;
}

#email-check[b-1dy2eefrc8] {
    color: #1bb76d;
    position: absolute;
    right: 5px;
    top: 6px;
    font-size: 12px;
}

/* Enhanced Mobile Responsiveness */
@media (max-width: 768px) {
    .container[b-1dy2eefrc8] {
        padding: 0 1rem;
    }

    .form-container[b-1dy2eefrc8] {
        max-width: 100%;
        margin: 0 auto;
        padding: 1rem;
    }

    /* Larger form inputs for better touch targets */
    .form-control[b-1dy2eefrc8] {
        padding: 0.75rem 1rem;
        font-size: 1rem;
        min-height: 48px; /* Minimum touch target size */
        border-radius: 8px;
    }

    .form-control-lg[b-1dy2eefrc8] {
        padding: 1rem 1.25rem;
        font-size: 1.1rem;
        min-height: 52px;
    }

    /* Button improvements */
    .btn[b-1dy2eefrc8] {
        min-height: 48px;
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
        border-radius: 8px;
        transition: all 0.2s ease;
    }

    .btn-success[b-1dy2eefrc8] {
        font-size: 1.125rem;
        font-weight: 600;
        min-height: 52px;
    }

    .btn-sm[b-1dy2eefrc8] {
        min-height: 40px;
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }

    /* Form labels */
    .form-label[b-1dy2eefrc8] {
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 0.5rem;
        color: #212529;
    }

    /* Input groups for email verification */
    .input-group[b-1dy2eefrc8] {
        border-radius: 8px;
        overflow: hidden;
    }

    .input-group .form-control[b-1dy2eefrc8] {
        border-right: none;
    }

    .input-group-text[b-1dy2eefrc8] {
        padding: 0.75rem 1rem;
        font-size: 1rem;
        border-left: none;
    }

    /* Better spacing for form sections */
    .mb-2[b-1dy2eefrc8] {
        margin-bottom: 1.5rem !important;
    }

    /* Row spacing adjustments */
    .row .col-6[b-1dy2eefrc8] {
        margin-bottom: 1rem;
    }

    .row .col-6:last-child[b-1dy2eefrc8] {
        margin-bottom: 0;
    }

    /* OTP section improvements */
    .d-flex.gap-1[b-1dy2eefrc8] {
        gap: 0.75rem !important;
    }

    /* Verify email button */
    .verify-email-btn[b-1dy2eefrc8] {
        min-height: 40px;
        padding: 0.5rem 1rem;
        white-space: nowrap;
    }

    /* Alert messages */
    .alert[b-1dy2eefrc8] {
        font-size: 0.95rem;
        padding: 1rem;
        border-radius: 8px;
        margin-bottom: 1.5rem;
    }

    /* Validation messages */
    .text-danger[b-1dy2eefrc8] {
        font-size: 0.9rem;
        margin-top: 0.5rem;
        display: block;
    }

    /* Footer adjustments */
    .text-center[b-1dy2eefrc8] {
        font-size: 0.95rem;
        line-height: 1.5;
    }

    /* Image adjustments */
    .img-fluid[b-1dy2eefrc8] {
        max-height: 300px;
        object-fit: contain;
    }
}

@media (max-width: 576px) {
    .container[b-1dy2eefrc8] {
        padding: 0 0.75rem;
    }

    .form-container[b-1dy2eefrc8] {
        padding: 0.75rem;
    }

    /* Stack form elements on smaller screens */
    .row[b-1dy2eefrc8] {
        margin: 0;
    }

    .row .col-6[b-1dy2eefrc8] {
        padding: 0;
        margin-bottom: 1rem;
    }

    .row .col-6.pe-1[b-1dy2eefrc8] {
        padding-right: 0.5rem;
    }

    .row .col-6.ps-1[b-1dy2eefrc8] {
        padding-left: 0.5rem;
    }

    /* Full width buttons on mobile */
    .btn[b-1dy2eefrc8] {
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .btn:last-child[b-1dy2eefrc8] {
        margin-bottom: 0;
    }

    /* Smaller text on mobile */
    h5.display-5[b-1dy2eefrc8] {
        font-size: 1.75rem;
        margin-bottom: 1.5rem;
    }

    /* OTP input improvements */
    .input-group .btn[b-1dy2eefrc8] {
        min-width: 80px;
        font-size: 0.9rem;
    }

    /* Hide image on very small screens */
    .col-lg-6:has(.img-fluid)[b-1dy2eefrc8] {
        display: none;
    }

    /* Full width form container */
    .col-lg-6:has(.form-container)[b-1dy2eefrc8] {
        max-width: 100%;
        flex: 0 0 100%;
    }
}

@media (max-width: 400px) {
    .form-container[b-1dy2eefrc8] {
        padding: 0.5rem;
    }

    .form-control[b-1dy2eefrc8], .form-control-lg[b-1dy2eefrc8] {
        font-size: 0.95rem;
    }

    .btn[b-1dy2eefrc8] {
        font-size: 0.95rem;
        padding: 0.75rem 1rem;
    }

    /* Compact spacing on very small screens */
    .mb-2[b-1dy2eefrc8] {
        margin-bottom: 1rem !important;
    }

    h5.display-5[b-1dy2eefrc8] {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }
}

/* Focus states for better accessibility */
.form-control:focus[b-1dy2eefrc8] {
    border-color: #1BB76D;
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
    outline: none;
}

.btn:focus[b-1dy2eefrc8] {
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
    outline: none;
}

/* Loading states */
.btn:disabled[b-1dy2eefrc8] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn.loading[b-1dy2eefrc8] {
    position: relative;
    color: transparent;
}

.btn.loading[b-1dy2eefrc8]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: button-loading-spinner-b-1dy2eefrc8 1s ease infinite;
}

@keyframes button-loading-spinner-b-1dy2eefrc8 {
    from { transform: translate(-50%, -50%) rotate(0turn); }
    to { transform: translate(-50%, -50%) rotate(1turn); }
}

/* Improved error styling */
.form-control.is-invalid[b-1dy2eefrc8] {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.form-control.is-valid[b-1dy2eefrc8] {
    border-color: #1BB76D;
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
}

/* Toast/notification positioning for mobile */
@media (max-width: 768px) {
    .toast-container[b-1dy2eefrc8] {
        top: 1rem !important;
        right: 1rem !important;
        left: 1rem !important;
    }

    .toast[b-1dy2eefrc8] {
        max-width: none;
        width: 100%;
    }
}

/* Accessibility Enhancements */
.sr-only[b-1dy2eefrc8] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.form-text[b-1dy2eefrc8] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Enhanced focus styles for accessibility */
input:focus[b-1dy2eefrc8],
select:focus[b-1dy2eefrc8],
button:focus[b-1dy2eefrc8],
textarea:focus[b-1dy2eefrc8] {
    outline: 3px solid #1BB76D !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px #fff, 0 0 0 4px #1BB76D !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    input:focus[b-1dy2eefrc8],
    select:focus[b-1dy2eefrc8],
    button:focus[b-1dy2eefrc8],
    textarea:focus[b-1dy2eefrc8] {
        outline-color: #000 !important;
        box-shadow: 0 0 0 1px #fff, 0 0 0 4px #000 !important;
    }
    
    .text-danger[b-1dy2eefrc8] {
        color: #000 !important;
        font-weight: bold !important;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *[b-1dy2eefrc8],
    *[b-1dy2eefrc8]::before,
    *[b-1dy2eefrc8]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Error summary styling */
#error-summary[b-1dy2eefrc8] {
    border: 2px solid #dc3545;
    border-radius: 0.375rem;
    padding: 1rem;
    margin-bottom: 1rem;
}

#error-summary h4[b-1dy2eefrc8] {
    color: #dc3545;
    margin-bottom: 0.5rem;
    font-size: 1.1rem;
}

#error-summary ul[b-1dy2eefrc8] {
    margin-bottom: 0;
    padding-left: 1.5rem;
}

#error-summary a[b-1dy2eefrc8] {
    color: #dc3545;
    text-decoration: underline;
}

#error-summary a:hover[b-1dy2eefrc8],
#error-summary a:focus[b-1dy2eefrc8] {
    color: #b02a37;
    text-decoration: none;
}

/* Fieldset styling */
fieldset[b-1dy2eefrc8] {
    border: none;
    padding: 0;
    margin: 0;
}

fieldset[aria-disabled="true"][b-1dy2eefrc8] {
    opacity: 0.6;
    pointer-events: none;
}

legend[b-1dy2eefrc8] {
    font-weight: 600;
    margin-bottom: 0.5rem;
    padding: 0;
}

/* Skip links */
.skip-links[b-1dy2eefrc8] {
    position: absolute;
    top: -40px;
    left: 6px;
    z-index: 1000;
}

.skip-link[b-1dy2eefrc8] {
    position: absolute;
    top: -40px;
    left: 6px;
    background: #000;
    color: #fff;
    padding: 8px 12px;
    text-decoration: none;
    border-radius: 3px;
    z-index: 1001;
    font-weight: 600;
}

.skip-link:focus[b-1dy2eefrc8] {
    top: 6px;
    color: #fff;
}

/* Announce regions */
[aria-live][b-1dy2eefrc8] {
    position: relative;
}

/* Group styling */
[role="group"][b-1dy2eefrc8] {
    position: relative;
}

/* Button loading states */
.btn.loading[b-1dy2eefrc8] {
    position: relative;
    color: transparent !important;
}

.btn.loading[b-1dy2eefrc8]::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-1dy2eefrc8 1s linear infinite;
    color: #fff;
}

@keyframes spin-b-1dy2eefrc8 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Simple Progress Indicator */
.signup-progress-simple[b-1dy2eefrc8] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 2rem;
}

.progress-steps[b-1dy2eefrc8] {
    position: relative;
}

.progress-steps[b-1dy2eefrc8]::before {
    content: '';
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    height: 2px;
    background: #e9ecef;
    z-index: 1;
}

.step[b-1dy2eefrc8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
    background: #f8f9fa;
    padding: 0 0.5rem;
}

.step-number[b-1dy2eefrc8] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #e9ecef;
    border: 2px solid #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    margin-bottom: 0.5rem;
    transition: all 0.3s ease;
}

.step-title[b-1dy2eefrc8] {
    font-size: 0.9rem;
    font-weight: 500;
    text-align: center;
    color: #6c757d;
    transition: color 0.3s ease;
}

.step.active .step-number[b-1dy2eefrc8] {
    background: #007bff;
    border-color: #007bff;
    color: white;
}

.step.active .step-title[b-1dy2eefrc8] {
    color: #007bff;
    font-weight: 600;
}

.step.completed .step-number[b-1dy2eefrc8] {
    background: #28a745;
    border-color: #28a745;
    color: white;
}

.step.completed .step-title[b-1dy2eefrc8] {
    color: #28a745;
    font-weight: 600;
}

@media (max-width: 576px) {
    .step-title[b-1dy2eefrc8] {
        font-size: 0.8rem;
    }
    
    .step-number[b-1dy2eefrc8] {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }
    
    .signup-progress-simple[b-1dy2eefrc8] {
        padding: 0.75rem;
        margin-bottom: 1.5rem;
    }
}
/* _content/Ex_Feedback/Areas/Signup/Pages/Payment.cshtml.rz.scp.css */
.card[b-i5pdbouirq] {
    background-color: #E6EEF8;
    border-radius: 1rem;
}

    .card .card-header[b-i5pdbouirq] {
        background-color: #0C2D7A !important;
        border-radius: 1rem 1rem 0 0;
        color: white;
        text-align: center;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1rem;
    }

    .card .card-body[b-i5pdbouirq] {
        background-color: #1BB76D;
        border-color: #1BB76D;
        border-radius: 0 0 1rem 1rem;
        color: white;
    }

    .card span[b-i5pdbouirq] {
        color: white !important;
    }

.subscription-select[b-i5pdbouirq] {
    background-color: #D1EADD;
    border-radius: 5px;
    border: none;
    padding: 5px;
    font-size: 12px;
}

.form-check-input[b-i5pdbouirq] {
    background-color: #D4E0DB;
    font-size: 14px;
}

.subtotal-text span[b-i5pdbouirq] {
    font-size: 14px;
    font-weight: 500;
    color: #1A1A1A;
}

.btn-promotion[b-i5pdbouirq] {
    background-color: #D1EADD;
    color: #414644;
}

.total-trail span[b-i5pdbouirq] {
    font-size: 12px;
    font-weight: 400;
    color: #1A1A1A;
}

.border-end[b-i5pdbouirq] {
    border-color: #1BB76D !important;
}

.form-container input[b-i5pdbouirq], .form-container select[b-i5pdbouirq] {
    border: 1px solid #1BB76D;
    font-size: 14px;
}

.form-container[b-i5pdbouirq] {
    max-width: 520px;
    width: 100%;
}

.form-label[b-i5pdbouirq] {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

/* Modern dropdown styling */
.form-select[b-i5pdbouirq] {
    border: 2px solid #e0e0e0;
    border-radius: 12px !important;
    padding: 12px 16px;
    font-size: 15px;
    font-weight: 500;
    color: #333;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%231BB76D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 20px 20px;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.form-select:hover[b-i5pdbouirq] {
    border-color: #1BB76D;
    box-shadow: 0 4px 8px rgba(27, 183, 109, 0.15);
    transform: translateY(-1px);
}

.form-select:focus[b-i5pdbouirq] {
    border-color: #1BB76D;
    outline: none;
    box-shadow: 0 0 0 4px rgba(27, 183, 109, 0.1), 0 4px 8px rgba(27, 183, 109, 0.15);
}

.form-select option[b-i5pdbouirq] {
    padding: 12px;
    font-size: 15px;
}

.input-group input[b-i5pdbouirq] {
    border-right: none;
}

.input-group span[b-i5pdbouirq] {
    border: 1px solid #1BB76D;
}

.form-control .cvc-input[b-i5pdbouirq] {
    border-top: none;
}

.card-input-group[b-i5pdbouirq] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.card-number[b-i5pdbouirq], .card-exp-cvc[b-i5pdbouirq] {
    display: flex;
    justify-content: space-between;
    padding: 2px 8px 2px 0px;
    font-size: 14px;
    color: #777;
}

    .card-number #card-number-element[b-i5pdbouirq], .card-exp-cvc #card-expiry-element[b-i5pdbouirq], .card-exp-cvc #card-cvc-element[b-i5pdbouirq] {
        border: none;
        outline: none;
        font-size: 14px;
        color: #333;
        flex-grow: 1;
    }

.card-number-icon[b-i5pdbouirq], .cvc-icon[b-i5pdbouirq] {
    display: flex;
    align-items: center;
}

.card-group[b-i5pdbouirq] {
    border: 1px solid #1BB76D;
    border-radius: 5px;
}

.border-right[b-i5pdbouirq] {
    border-right: 1px solid #1BB76D;
}

.expiry-input[b-i5pdbouirq] {
    width: 100%;
}

.cvc-input[b-i5pdbouirq] {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-left: 10px;
}

    .cvc-input input[b-i5pdbouirq], .expiry-input input[b-i5pdbouirq] {
        width: 60%;
    }

.card-number input[b-i5pdbouirq]::placeholder, .card-exp-cvc input[b-i5pdbouirq]::placeholder, .form-container input[b-i5pdbouirq]::placeholder {
    color: #bbb;
}

.secure-input[b-i5pdbouirq] {
    border: 2px solid #E7E7E7;
    border-radius: 5px;
}

.secure-checkbox[b-i5pdbouirq], .purchase-checkbox[b-i5pdbouirq] {
    width: 16px;
    height: 16px;
    margin-right: 5px;
}

.subscription-text[b-i5pdbouirq] {
    font-size: 13px;
}

.privacy-term-text[b-i5pdbouirq] {
    font-size: 12px;
    color: gray;
}

#submit-button[b-i5pdbouirq] {
    background-color: #1BB76D !important;
}

/* Enhanced Mobile Responsiveness */
@media (max-width: 768px) {
    .container[b-i5pdbouirq] {
        padding: 0 1rem;
    }

    /* Stack payment sections vertically on mobile */
    .row > .col-lg-6[b-i5pdbouirq] {
        margin-bottom: 2rem;
    }

    .border-end[b-i5pdbouirq] {
        border-right: none !important;
        border-bottom: 2px solid #1BB76D !important;
        padding-bottom: 2rem;
        margin-bottom: 2rem;
    }

    /* Card styling improvements */
    .card[b-i5pdbouirq] {
        margin-bottom: 1.5rem;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        border: none;
    }

    .card .card-header[b-i5pdbouirq] {
        padding: 1.25rem;
        font-size: 1.1rem;
    }

    .card .card-body[b-i5pdbouirq] {
        padding: 1.5rem;
        text-align: center;
    }

    /* Form improvements */
    .form-container[b-i5pdbouirq] {
        max-width: 100%;
        padding: 1rem;
    }

    .form-control[b-i5pdbouirq], .form-select[b-i5pdbouirq] {
        padding: 0.75rem 1rem;
        font-size: 1rem;
        min-height: 48px;
        border-radius: 8px;
    }

    .form-label[b-i5pdbouirq] {
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 0.5rem;
    }

    /* Button improvements */
    .btn[b-i5pdbouirq] {
        min-height: 48px;
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
        border-radius: 8px;
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .btn-lg[b-i5pdbouirq] {
        min-height: 52px;
        font-size: 1.125rem;
    }

    /* Card input group */
    .card-group[b-i5pdbouirq] {
        border-radius: 8px;
        overflow: hidden;
    }

    .card-number[b-i5pdbouirq], .card-exp-cvc[b-i5pdbouirq] {
        padding: 0.75rem;
        min-height: 48px;
        display: flex;
        align-items: center;
    }

    .card-number #card-number-element[b-i5pdbouirq], 
    .card-exp-cvc #card-expiry-element[b-i5pdbouirq], 
    .card-exp-cvc #card-cvc-element[b-i5pdbouirq] {
        font-size: 1rem;
        padding: 0.5rem 0;
    }

    /* Package selection */
    .form-select[b-i5pdbouirq] {
        background-size: 16px 12px;
    }

    /* Spacing improvements */
    .mb-2[b-i5pdbouirq], .mb-3[b-i5pdbouirq] {
        margin-bottom: 1.5rem !important;
    }

    /* Subtotal section */
    .subtotal-text[b-i5pdbouirq] {
        font-size: 1rem;
        line-height: 1.5;
    }

    /* Links */
    .btn-link[b-i5pdbouirq] {
        min-height: unset;
        padding: 0.25rem 0;
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .container[b-i5pdbouirq] {
        padding: 0 0.75rem;
    }

    .border-end[b-i5pdbouirq] {
        border: none !important;
        padding-bottom: 1.5rem;
        margin-bottom: 1.5rem;
    }

    /* Compact card styling */
    .card .card-header[b-i5pdbouirq] {
        padding: 1rem;
        font-size: 1rem;
    }

    .card .card-body[b-i5pdbouirq] {
        padding: 1.25rem;
    }

    /* Form improvements */
    .form-container[b-i5pdbouirq] {
        padding: 0.75rem;
    }

    /* Package and billing selection */
    .row .col-md-6[b-i5pdbouirq] {
        margin-bottom: 1rem;
    }

    /* Card input responsive layout */
    .card-exp-cvc[b-i5pdbouirq] {
        flex-direction: column;
        gap: 1rem;
    }

    .card-exp-cvc .col-6[b-i5pdbouirq] {
        width: 100%;
        max-width: none;
        flex: none;
        padding: 0;
    }

    .border-right[b-i5pdbouirq] {
        border-right: none !important;
        border-bottom: 1px solid #1BB76D;
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    .expiry-input[b-i5pdbouirq], .cvc-input[b-i5pdbouirq] {
        width: 100%;
        padding: 0.75rem;
    }

    /* Button group adjustments */
    .d-flex.gap-1[b-i5pdbouirq] {
        flex-direction: column;
        gap: 0.75rem !important;
    }

    .d-flex.gap-1 .btn[b-i5pdbouirq] {
        width: 100%;
    }

    /* Text sizing */
    .subscription-text[b-i5pdbouirq] {
        font-size: 0.9rem;
        line-height: 1.4;
    }

    .privacy-term-text[b-i5pdbouirq] {
        font-size: 0.85rem;
        line-height: 1.4;
    }

    /* Subtotal adjustments */
    .subtotal-text[b-i5pdbouirq] {
        font-size: 0.95rem;
    }

    /* Package selection improvements */
    .form-select[b-i5pdbouirq] {
        font-size: 0.95rem;
    }
}

@media (max-width: 400px) {
    .container[b-i5pdbouirq] {
        padding: 0 0.5rem;
    }

    .form-container[b-i5pdbouirq] {
        padding: 0.5rem;
    }

    .card .card-header[b-i5pdbouirq] {
        font-size: 0.95rem;
        padding: 0.75rem;
    }

    .card .card-body[b-i5pdbouirq] {
        padding: 1rem;
    }

    /* Compact spacing */
    .mb-2[b-i5pdbouirq], .mb-3[b-i5pdbouirq] {
        margin-bottom: 1rem !important;
    }

    /* Smaller buttons on very small screens */
    .btn[b-i5pdbouirq] {
        font-size: 0.95rem;
        padding: 0.75rem 1rem;
    }

    .btn-lg[b-i5pdbouirq] {
        font-size: 1rem;
    }
}

/* Enhanced focus states */
.form-control:focus[b-i5pdbouirq], .form-select:focus[b-i5pdbouirq] {
    border-color: #1BB76D;
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
    outline: none;
}

/* Stripe elements focus styling */
.card-group:focus-within[b-i5pdbouirq] {
    border-color: #1BB76D;
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
}

/* Loading states */
.btn:disabled[b-i5pdbouirq] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn.loading[b-i5pdbouirq] {
    position: relative;
    color: transparent;
}

.btn.loading[b-i5pdbouirq]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: button-loading-spinner-b-i5pdbouirq 1s ease infinite;
}

@keyframes button-loading-spinner-b-i5pdbouirq {
    from { transform: translate(-50%, -50%) rotate(0turn); }
    to { transform: translate(-50%, -50%) rotate(1turn); }
}

/* Card validation states */
.card-group.invalid[b-i5pdbouirq] {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.card-group.valid[b-i5pdbouirq] {
    border-color: #1BB76D;
    box-shadow: 0 0 0 0.2rem rgba(27, 183, 109, 0.25);
}

/* Accessibility improvements */
@media (prefers-reduced-motion: reduce) {
    .btn.loading[b-i5pdbouirq]::after {
        animation: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .card[b-i5pdbouirq] {
        border: 2px solid;
    }
    
    .form-control[b-i5pdbouirq], .form-select[b-i5pdbouirq] {
        border: 2px solid;
    }
}
/* _content/Ex_Feedback/Components/Billing/SelectOrAddPaymentMethods.razor.rz.scp.css */
.payment-method-container[b-ekyr63kwn6] {
    margin: 20px auto;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

h6[b-ekyr63kwn6] {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
    color: #333;
}
.card-fields-container .form-control[b-ekyr63kwn6] {
    padding: 0.75rem 1rem;
    min-height: 40px;
}

    /* Override Stripe iframe padding */
    .card-fields-container .form-control iframe[b-ekyr63kwn6] {
        margin: -4px 0;
    }

/* Add some spacing between fields on mobile */
@media (max-width: 767px) {
    .card-fields-container .col-md-6:first-child[b-ekyr63kwn6] {
        margin-bottom: 0.5rem;
    }
}
.existing-cards[b-ekyr63kwn6] {
    overflow: auto;
    max-height: 200px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
}

    .existing-cards[b-ekyr63kwn6]::-webkit-scrollbar {
        width: 6px;
    }

    .existing-cards[b-ekyr63kwn6]::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 10px;
    }

    .existing-cards[b-ekyr63kwn6]::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 10px;
        transition: background-color 0.3s;
    }

        .existing-cards[b-ekyr63kwn6]::-webkit-scrollbar-thumb:hover {
            background-color: rgba(0, 0, 0, 0.3);
        }

.card-option[b-ekyr63kwn6] {
    display: flex;
    align-items: center;
    /*justify-content:space-between;*/
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .card-option:hover[b-ekyr63kwn6] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    }

    .card-option.selected[b-ekyr63kwn6] {
        border-color: #007bff;
        background-color: #f0f8ff;
    }

.card-info[b-ekyr63kwn6] {
    display: flex;
    flex-direction: column;
}

.card-last4[b-ekyr63kwn6] {
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

.card-expiry[b-ekyr63kwn6] {
    font-size: 14px;
    color: #555;
}
.card-network[b-ekyr63kwn6] {
    font-style: italic;
    font-size: 20px;
}
.default-badge[b-ekyr63kwn6] {
    margin-left: auto;
    font-size: 12px;
    color: #fff;
    background-color: #007bff;
    padding: 3px 6px;
    border-radius: 12px;
}

.action-buttons[b-ekyr63kwn6] {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}
/* _content/Ex_Feedback/Components/Containers/PageCardContainer.razor.rz.scp.css */

/* Billing Containers */
.main-container[b-gq85qkhbv1] {
    /*min-height: calc(100vh - 48px);*/
}

/* Headers */
.card-header-custom[b-gq85qkhbv1] {
    background-color: #0C2D7A !important;
    border-radius: 1rem 1rem 0 0 !important;
    padding: 1rem;
    color: white;
    text-align: center;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
}

.card-container[b-gq85qkhbv1] {
    background-color: #E6EEF8;
    border-radius: 1rem;
    height: 100%
}

/* Responsive Design */
@media (max-width: 768px) {
    .card-container[b-gq85qkhbv1] {
        padding: 1rem;
    }

    .card-header-custom[b-gq85qkhbv1] {
        font-size: 1.2rem;
    }
}   
/* _content/Ex_Feedback/Pages/Billing/Invoices.razor.rz.scp.css */
.details-card[b-znhp63ngjb] {
    height: 90px;
}

.grid-div[b-znhp63ngjb] {
    height: calc(100% - 100px);
}

.filter-dropdown[b-znhp63ngjb] {
    z-index: 1001;
}
/* _content/Ex_Feedback/Pages/Billing/PaymentMethods.razor.rz.scp.css */

.card-body[b-ydjijre6vp] {
    /*height: 80vh;*/
}
/* Buttons */
.button-new-card[b-ydjijre6vp] {
    background: white !important;
    color: #0C2D7A;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    font-weight: bold;
    transition: all 0.3s ease-in-out;
}

    .button-new-card:hover[b-ydjijre6vp] {
        background: #FFC107;
        color: #0C2D7A;
        transform: scale(1.05);
    }


/* _content/Ex_Feedback/Pages/Billing/SMSCredits.razor.rz.scp.css */
.sms-container[b-n71dmc60j3] {
    overflow-x: hidden;
    overflow-y: auto;
}

.sms-header[b-n71dmc60j3] {
    background-color: #0C2D7A !important;
    border-radius: 1rem 1rem 0 0;
    padding: 1rem;
    color: white;
    text-align: center;
    font-weight: bold;
}

/*Cards*/
.credits-card[b-n71dmc60j3], .sms-history-card[b-n71dmc60j3] {
    background: white;
    border-radius: 1rem;
    padding: 1rem;
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    transition: all 0.3s ease-in-out;
}

    .credits-card:hover[b-n71dmc60j3], .sms-history-card:hover[b-n71dmc60j3] {
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
        transform: translateY(-3px);
    }

/*SMS History*/
.sms-history-list[b-n71dmc60j3] {
    height: 280px;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
/* Target the Syncfusion Grid's scrollbar */
[b-n71dmc60j3]::-webkit-scrollbar {
    width: 2px;
}

[b-n71dmc60j3]::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 10px;
}

[b-n71dmc60j3]::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    transition: background-color 0.3s;
}

.sms-history-list .e-gridcontent e-yscroll[b-n71dmc60j3]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.3);
}

/* Fix for scrollbar display inside the grid */
.sms-history-list .e-gridcontent[b-n71dmc60j3] {
    overflow-y: auto !important;
}

.list-group-item[b-n71dmc60j3] {
    border: none;
    padding: 1rem;
    border-bottom: 1px solid #eee;
    transition: all 0.3s ease-in-out;
}

    .list-group-item:hover[b-n71dmc60j3] {
        background: #f9f9f9;
    }

/*Invoice Button*/
.view-invoice-button[b-n71dmc60j3] {
    background: white;
    border: 1px solid #ddd;
    padding: 0.5rem 1rem;
    border-radius: 1rem;
    font-weight: bold;
    transition: all 0.3s ease-in-out;
    color: #0C2D7A;
}

    .view-invoice-button:hover[b-n71dmc60j3] {
        background: #FFF8E1;
        border-color: #0C2D7A;
    }


.view-all-section[b-n71dmc60j3] {
    margin-top: 0;
}

    .view-all-section .btn-outline-dark[b-n71dmc60j3] {
        text-decoration: none;
        width: 100%;
        border-radius: 1rem;
        border-color: #0C2D7A;
        color: #0C2D7A;
        font-size: 1rem;
        font-weight: bold;
    }

        .view-all-section .btn-outline-dark:hover[b-n71dmc60j3] {
            background-color: #0C2D7A;
            color: white;
        }


/*SMS Movement Indicators*/
.sms-movement[b-n71dmc60j3] {
    font-size: 1rem;
    font-weight: bold;
}

    .sms-movement.text-success[b-n71dmc60j3] {
        color: #28a745;
        Green for added credits
    }

    .sms-movement.text-danger[b-n71dmc60j3] {
        color: #dc3545;
        Red for used credits
    }

/*SMS Plans*/
.sms-plans[b-n71dmc60j3] {
    background: white;
    border-radius: 1rem;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    padding: 1rem;
}

    .sms-plans:hover[b-n71dmc60j3] {
        transform: translateY(-3px);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
    }

/*Top-Up Icons*/
.top-up-icon[b-n71dmc60j3] {
    width: 80px;
    height: 80px;
    font-size: 2rem;
    color: #0C2D7A;
    background: #E6EEF8;
    padding: 1rem;
    border-radius: 50%;
    margin-bottom: 1rem;
}

/*Badge for SMS Credit Packs*/
.credit-badge[b-n71dmc60j3] {
    background: #FFF8E1;
    color: #FFA000;
    padding: 0.5rem 1rem;
    border-radius: 1rem;
    display: inline-flex;
    align-items: center;
    font-weight: bold;
}

/*Top-Up Button*/
.topUp-button[b-n71dmc60j3] {
    background: #0C2D7A;
    color: white;
    border: none;
    padding: 0.75rem;
    border-radius: 0.5rem;
    width: 100%;
    font-size: 1rem;
    font-weight: bold;
    transition: all 0.3s ease-in-out;
}

    .topUp-button:hover[b-n71dmc60j3] {
        background: #FFC107;
        color: white;
        transform: scale(1.05);
    }

/*Checkout Dialog*/
.checkout-dialog[b-n71dmc60j3] {
    border-radius: 1rem !important;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
}

.checkout-btn[b-n71dmc60j3] {
    font-size: 1rem;
    font-weight: bold;
    border-radius: 8px;
    padding: 12px;
}

    .checkout-btn:hover[b-n71dmc60j3] {
        background: #FFC107;
        color: white;
        transform: scale(1.05);
    }

/*Responsive*/
@media (max-width: 768px) {
    .sms-header[b-n71dmc60j3] {
        font-size: 1.2rem;
        padding: 1rem;
    }

    .credits-card[b-n71dmc60j3], .sms-history-card[b-n71dmc60j3] {
        padding: 1.5rem;
    }

    .sms-plans[b-n71dmc60j3] {
        padding: 1rem;
    }

    .topUp-button[b-n71dmc60j3] {
        padding: 0.5rem;
    }
}
/*.sms-history-div .card-body{
    height: 44vh;
}

    .sms-history-grid::-webkit-scrollbar {
        width: 6px;
    }

    .sms-history-grid::-webkit-scrollbar-track {
        background: transparent;
        border-radius: 10px;
    }

    .sms-history-grid::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 10px;
        transition: background-color 0.3s;
    }

        .sms-history-grid::-webkit-scrollbar-thumb:hover {
            background-color: rgba(0, 0, 0, 0.3);
        }
*/
/* _content/Ex_Feedback/Pages/Billing/Subscription.razor.rz.scp.css */
.subscription-container[b-33g1c0yrcc] {
    overflow-x: hidden;
    overflow-y: auto;
}
/* _content/Ex_Feedback/Pages/ClientAdminView.razor.rz.scp.css */
#target[b-cqmzadvabn], #target1[b-cqmzadvabn] {
    min-height: 600px;
}

.dialog-content[b-cqmzadvabn] {
    max-height: 100%;
    overflow-y: auto;
}

.e-grid .e-rowcell[b-cqmzadvabn] {
    background-color: transparent !important;
}

/* Remove background color for selected cells */
.e-grid .e-selectionbackground[b-cqmzadvabn] {
    background-color: transparent !important;
}

.e-dlg-overlay[b-cqmzadvabn] {
    background-color: slategray;
    opacity: 0.6;
}

.add-new-official-button-container[b-cqmzadvabn] {
    display: flex;
    align-items: center;
}

.add-new-official-grid[b-cqmzadvabn] {
    height: calc(100% - 480px);
}