/**
 * ============================================================================
 * PMPro Sasico - Custom Styles
 * ============================================================================
 * 
 * Theme:   Sasico by Pikathemes
 * Plugin:  Paid Memberships Pro
 * Version: 2.0.0
 * Updated: 2026-02-04
 * 
 * Installation:
 * 1. Copy this file to your Sasico child theme folder
 * 2. Enqueue via pmpro-sasico-enqueue.php
 * 
 * ============================================================================
 * TABLE OF CONTENTS
 * ============================================================================
 * 
 * 1.  CSS Variables Override
 * 2.  Base Typography & Container
 * 3.  Buttons
 * 4.  Form Elements
 * 5.  Cards & Sections
 * 6.  Messages & Alerts
 * 7.  Tables
 * 8.  Tags & Badges
 * 9.  Pagination
 * 10. Page: Levels
 * 11. Page: Checkout
 * 12. Page: Account
 * 13. Page: Login
 * 14. Add-ons Support (50+ classes)
 * 15. Dark Mode
 * 16. Responsive
 * 17. Dark Mode Consistency
 * 
 * ============================================================================
 */

/* ==========================================================================
   1. CSS Variables Override
   ========================================================================== */

:root {
    /* Override PMPro base variables with Sasico values */
    --pmpro--base--border-radius: 14px;
    --pmpro--base--spacing--small: 12px;
    --pmpro--base--spacing--medium: 20px;
    --pmpro--base--spacing--large: 30px;

    /* Colors mapped from Sasico */
    --pmpro--color--accent: var(--sasi-color-primary, #6C33FF);
    --pmpro--color--accent--variation: var(--sasi-color-dark, #0E0E0E);
    --pmpro--color--base: var(--sasi-bg-color-white, #ffffff);
    --pmpro--color--base-2: var(--sasi-bg-color-gray, #EEEEEE);
    --pmpro--color--contrast: var(--sasi-color-dark, #0E0E0E);
    --pmpro--color--border: var(--sasi-border-color, #EEEEEE);
    --pmpro--color--border--variation: var(--sasi-border-color, #EEEEEE);

    /* Message colors - Sasico inspired */
    --pmpro--color--info-background: var(--sasi-bg-color-green, #F1FEE1);
    --pmpro--color--info-border: var(--sasi-color-primary, #6C33FF);
    --pmpro--color--info-text: var(--sasi-color-dark, #0E0E0E);
    --pmpro--color--success-background: #d4edda;
    --pmpro--color--success-border: #c3e6cb;
    --pmpro--color--success-text: #0F441C;
    --pmpro--color--error-background: #f8d7da;
    --pmpro--color--error-border: #f5c6cb;
    --pmpro--color--error-text: #721c24;
    --pmpro--color--alert-background: #fff8e0;
    --pmpro--color--alert-border: #ffeeba;
    --pmpro--color--alert-text: #6C5101;

    /* Typography */
    --pmpro--font-family: var(--sasi-font-main, 'Inter', sans-serif);
    --pmpro--font-family-heading: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);

    /* Button variables - Sasico style with Purple Theme */
    --pmpro--btn--border-radius: 999px;
    --pmpro--btn--padding: 16px 25px;
    --pmpro--btn--font-weight: 600;

    /* Button colors - Purple theme (user preference) */
    --pmpro--btn--color: #ffffff;
    --pmpro--btn--bg: #6C33FF;
    --pmpro--btn--border: #6C33FF;
    --pmpro--btn--hover-color: #6C33FF;
    --pmpro--btn--hover-bg: #ffffff;
    --pmpro--btn--hover-border: #6C33FF;

    /* Box shadow */
    --pmpro--box-shadow: none;
}

/* ==========================================================================
   2. Base Typography & Container
   ========================================================================== */

.pmpro {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
    color: var(--sasi-color-text-main, #696969);
    line-height: var(--sasi-body-line-height, 26px);
}

.pmpro h1,
.pmpro h2,
.pmpro h3,
.pmpro h4,
.pmpro h5,
.pmpro h6 {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    color: var(--sasi-color-dark, #0E0E0E);
    margin: 0 0 20px;
}

.pmpro a {
    color: var(--sasi-color-dark, #0E0E0E);
    text-decoration: none;
    transition: all 0.3s linear;
}

.pmpro a:hover {
    color: var(--sasi-color-primary, #6C33FF);
}

/* ==========================================================================
   3. Buttons
   ========================================================================== */

/* Primary Button - Sasico Style */
.pmpro .pmpro_btn,
.pmpro input[type="submit"],
.pmpro button[type="submit"],
.pmpro .pmpro_form_submit input[type="submit"],
body .pmpro .pmpro_btn,
body .pmpro input[type="submit"],
body .pmpro button[type="submit"],
#loginform input[type="submit"],
.pmpro_login input[type="submit"],
.pmpro_login_wrap input[type="submit"] {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    background-color: #6C33FF !important;
    background: #6C33FF !important;
    border: 1px solid #6C33FF !important;
    padding: 16px 25px !important;
    line-height: 1 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    text-decoration: none !important;
    transition: all 0.3s linear !important;
    box-shadow: none !important;
    min-height: auto !important;
}

.pmpro .pmpro_btn:hover,
.pmpro .pmpro_btn:focus,
.pmpro input[type="submit"]:hover,
.pmpro input[type="submit"]:focus,
.pmpro button[type="submit"]:hover,
.pmpro button[type="submit"]:focus,
body .pmpro .pmpro_btn:hover,
body .pmpro input[type="submit"]:hover,
#loginform input[type="submit"]:hover,
.pmpro_login input[type="submit"]:hover,
.pmpro_login_wrap input[type="submit"]:hover {
    color: #6C33FF !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-color: #6C33FF !important;
}

/* Outline Button */
.pmpro .pmpro_btn-outline {
    color: var(--sasi-color-dark, #0E0E0E);
    background-color: transparent;
    border: 1px solid var(--sasi-color-gray, #EEEEEE);
}

.pmpro .pmpro_btn-outline:hover,
.pmpro .pmpro_btn-outline:focus {
    color: #ffffff;
    background-color: #6C33FF;
    border-color: #6C33FF;
}

/* Cancel Button */
.pmpro .pmpro_btn-cancel {
    color: var(--sasi-color-dark, #0E0E0E);
    background-color: transparent;
    border: 1px solid var(--sasi-color-gray, #EEEEEE);
}

.pmpro .pmpro_btn-cancel:hover,
.pmpro .pmpro_btn-cancel:focus {
    color: var(--sasi-color-dark, #0E0E0E);
    background-color: var(--sasi-color-gray, #EEEEEE);
    border-color: var(--sasi-color-gray, #EEEEEE);
}

/* Delete Button */
.pmpro .pmpro_btn-delete {
    color: #ffffff;
    background-color: #721c24;
    border-color: #721c24;
}

.pmpro .pmpro_btn-delete:hover,
.pmpro .pmpro_btn-delete:focus {
    background-color: #5a1118;
    border-color: #5a1118;
    color: #ffffff;
}

/* Plain/Link Button */
.pmpro .pmpro_btn-plain {
    background: none;
    border: none;
    padding: 0;
    color: var(--sasi-color-dark, #0E0E0E);
    font-weight: 500;
}

.pmpro .pmpro_btn-plain:hover {
    color: var(--sasi-color-primary, #6C33FF);
    background: none;
    text-decoration: underline;
}

/* ==========================================================================
   4. Form Elements
   ========================================================================== */

/* Text Inputs */
.pmpro input[type="text"],
.pmpro input[type="email"],
.pmpro input[type="url"],
.pmpro input[type="password"],
.pmpro input[type="search"],
.pmpro input[type="number"],
.pmpro input[type="tel"],
.pmpro input[type="date"],
.pmpro textarea,
.pmpro select,
.pmpro .pmpro_form_input {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
    font-size: 16px;
    color: var(--sasi-color-dark, #0E0E0E);
    background: var(--sasi-bg-color-input, #ffffff);
    border: 1px solid var(--sasi-border-color-input, #EEEEEE);
    padding: 20px;
    border-radius: 14px;
    outline: none;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    transition: all 0.3s linear;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.pmpro input[type="text"]:focus,
.pmpro input[type="email"]:focus,
.pmpro input[type="url"]:focus,
.pmpro input[type="password"]:focus,
.pmpro input[type="search"]:focus,
.pmpro input[type="number"]:focus,
.pmpro input[type="tel"]:focus,
.pmpro input[type="date"]:focus,
.pmpro textarea:focus,
.pmpro select:focus,
.pmpro .pmpro_form_input:focus {
    border-color: var(--sasi-border-focus-input, rgba(14, 14, 14, 0.5));
    box-shadow: none;
    outline: none;
}

/* Select Dropdown with Sasico Arrow */
.pmpro select,
.pmpro .pmpro_form_input-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath fill='%230E0E0E' d='M6 7L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 12px 7px;
    padding-right: 50px;
    cursor: pointer;
}

/* Placeholder */
.pmpro input::placeholder,
.pmpro textarea::placeholder {
    color: var(--sasi-color-placeholder-input, rgba(14, 14, 14, 0.4));
}

/* Labels */
.pmpro .pmpro_form_label,
.pmpro label {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 16px;
    font-weight: 500;
    color: var(--sasi-color-dark, #0E0E0E);
    margin-bottom: 12px;
    display: block;
}

/* Form Fields Container */
.pmpro .pmpro_form_fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pmpro .pmpro_form_field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Checkbox & Radio */
.pmpro input[type="checkbox"],
.pmpro input[type="radio"] {
    width: auto;
    height: auto;
    padding: 0;
    margin-right: 10px;
    vertical-align: middle;
}

.pmpro .pmpro_form_field-checkbox .pmpro_form_label,
.pmpro .pmpro_form_field-radio .pmpro_form_label {
    display: inline;
    font-weight: 400;
    cursor: pointer;
}

/* Form Hint */
.pmpro .pmpro_form_hint {
    font-size: 14px;
    color: var(--sasi-color-text-main, #696969);
    opacity: 0.8;
    margin-top: 4px;
}

/* Error State */
.pmpro .pmpro_form_input-error {
    border-color: var(--pmpro--color--error-border) !important;
    box-shadow: 0 0 0 3px rgba(248, 215, 218, 0.5);
}

/* ==========================================================================
   5. Cards & Sections
   ========================================================================== */

.pmpro .pmpro_card {
    background-color: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    box-shadow: none;
    overflow: hidden;
    margin: 20px 0;
}

.pmpro .pmpro_card_title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 22px;
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
    padding: 30px 30px 0;
    margin: 0;
}

.pmpro .pmpro_card_content {
    padding: 20px 30px 30px;
}

.pmpro .pmpro_card_content p {
    margin: 12px 0;
    color: var(--sasi-color-text-main, #696969);
}

.pmpro .pmpro_card_content p:last-of-type {
    margin-bottom: 0;
}

.pmpro .pmpro_card_actions {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    border-top: 1px solid var(--sasi-border-color, #EEEEEE);
    padding: 15px 30px;
}

/* Section Styling */
.pmpro .pmpro_section {
    margin: 40px 0;
}

.pmpro .pmpro_section:first-of-type {
    margin-top: 0;
}

.pmpro .pmpro_section_title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 22px;
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
    margin: 0 0 20px;
    padding: 0;
}

/* ==========================================================================
   6. Messages & Alerts
   ========================================================================== */

.pmpro .pmpro_message {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    border: 1px solid var(--sasi-color-primary, #6C33FF);
    border-left: 5px solid var(--sasi-color-primary, #6C33FF);
    border-radius: 14px;
    color: var(--sasi-color-dark, #0E0E0E);
    font-weight: 400;
    margin: 20px 0;
    padding: 20px 25px;
    box-shadow: none;
}

.pmpro .pmpro_message.pmpro_success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    border-left-color: #28a745;
    color: #0F441C;
}

.pmpro .pmpro_message.pmpro_error {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    border-left-color: #dc3545;
    color: #721c24;
}

.pmpro .pmpro_message.pmpro_alert {
    background-color: #fff8e0;
    border-color: #ffeeba;
    border-left-color: #ffc107;
    color: #6C5101;
}

.pmpro .pmpro_message a {
    color: inherit;
    text-decoration: underline;
    font-weight: 500;
}

.pmpro .pmpro_message a:hover {
    text-decoration: none;
}

/* ==========================================================================
   7. Tables
   ========================================================================== */

.pmpro .pmpro_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    overflow: hidden;
    margin: 20px 0;
}

.pmpro .pmpro_table thead th {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 16px;
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    padding: 20px;
    text-align: left;
    border: none;
    border-bottom: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro .pmpro_table tbody td,
.pmpro .pmpro_table tbody th {
    font-size: 16px;
    color: var(--sasi-color-text-main, #696969);
    background-color: var(--sasi-bg-color-white, #ffffff);
    padding: 20px;
    border: none;
    border-bottom: 1px solid var(--sasi-border-color, #EEEEEE);
    vertical-align: middle;
}

.pmpro .pmpro_table tbody tr:last-child td,
.pmpro .pmpro_table tbody tr:last-child th {
    border-bottom: none;
}

.pmpro .pmpro_table tfoot td {
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
    background-color: var(--sasi-bg-color-gray, #EEEEEE);
    padding: 20px;
    border: none;
}

/* Levels Table */
.pmpro .pmpro_levels_table {
    table-layout: fixed;
}

.pmpro .pmpro_levels_table .pmpro_btn {
    display: block;
    text-align: center;
    width: 100%;
}

/* ==========================================================================
   8. Tags & Badges
   ========================================================================== */

.pmpro .pmpro_tag {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 14px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    display: inline-block;
    line-height: 1.2;
}

.pmpro .pmpro_tag-success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #0F441C;
}

.pmpro .pmpro_tag-error {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

.pmpro .pmpro_tag-alert {
    background-color: #fff8e0;
    border-color: #ffeeba;
    color: #6C5101;
}

/* ==========================================================================
   9. Pagination
   ========================================================================== */

.pmpro .pmpro_pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 30px 0;
}

.pmpro .pmpro_pagination a,
.pmpro .pmpro_pagination span {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 14px;
    font-weight: 500;
    padding: 10px 16px;
    border-radius: 999px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    background-color: var(--sasi-bg-color-white, #ffffff);
    color: var(--sasi-color-dark, #0E0E0E);
    text-decoration: none;
    transition: all 0.3s linear;
}

.pmpro .pmpro_pagination a:hover {
    background-color: #6C33FF;
    border-color: #6C33FF;
    color: #ffffff;
}

.pmpro .pmpro_pagination .pmpro_pagination-current {
    background-color: #6C33FF;
    border-color: #6C33FF;
    color: #ffffff;
    font-weight: 600;
}

.pmpro .pmpro_pagination .pmpro_pagination-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==========================================================================
   10. Page-Specific: Levels
   ========================================================================== */

/* Pricing Table Style */
.pmpro_levels .pmpro_level {
    text-align: center;
}

.pmpro_levels .pmpro_level .pmpro_level-name {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 24px;
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
    margin-bottom: 15px;
}

.pmpro_levels .pmpro_level .pmpro_level-price {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 48px;
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
    line-height: 1.2;
}

.pmpro_levels .pmpro_level .pmpro_level-price .pmpro_level-price-period {
    font-size: 16px;
    font-weight: 400;
    color: var(--sasi-color-text-main, #696969);
}

/* ==========================================================================
   11. Page-Specific: Checkout
   ========================================================================== */

/* Checkout Cards */
.pmpro_checkout .pmpro_card {
    margin-bottom: 25px;
}

/* Discount Code Section */
.pmpro #pmpro_discount_code_fields {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    padding: 20px;
    border-radius: 14px;
    margin: 20px 0;
}

/* Payment Method Selector */
.pmpro #pmpro_payment_method {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 20px 0;
}

.pmpro #pmpro_payment_method label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 20px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.3s linear;
}

.pmpro #pmpro_payment_method label:hover {
    border-color: var(--sasi-color-primary, #6C33FF);
}

.pmpro #pmpro_payment_method input[type="radio"]:checked+label,
.pmpro #pmpro_payment_method label:has(input[type="radio"]:checked) {
    border-color: var(--sasi-color-primary, #6C33FF);
    background-color: var(--sasi-bg-color-green, #F1FEE1);
}

/* Stripe Payment Fields */
.pmpro #pmpro_payment_information_fields #AccountNumber,
.pmpro #pmpro_payment_information_fields #Expiry,
.pmpro #pmpro_payment_information_fields #CVV {
    border: 1px solid var(--sasi-border-color-input, #EEEEEE);
    border-radius: 14px;
    padding: 16px 20px;
    background-color: var(--sasi-bg-color-white, #ffffff);
}

/* Submit Button Area */
.pmpro .pmpro_form_submit {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--sasi-border-color, #EEEEEE);
}

/* TOS Checkbox Area */
.pmpro #pmpro_tos_fields {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    padding: 20px;
    border-radius: 14px;
    margin: 20px 0;
}

/* ==========================================================================
   12. Page-Specific: Account
   ========================================================================== */

/* Account Overview Cards */
#pmpro_account .pmpro_card {
    margin-bottom: 25px;
}

/* Membership Info */
#pmpro_account-membership .pmpro_list_item {
    margin-bottom: 12px;
}

#pmpro_account-membership .pmpro_list_item_label {
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
}

/* Profile Section */
#pmpro_account-profile .pmpro_heading-with-avatar {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

#pmpro_account-profile .avatar {
    border-radius: 50%;
    border: 3px solid var(--sasi-color-primary, #6C33FF);
}

/* Links Section */
#pmpro_account-links .pmpro_list {
    list-style: none;
    padding: 0;
    margin: 0;
}

#pmpro_account-links .pmpro_list_item {
    margin-bottom: 10px;
}

#pmpro_account-links .pmpro_list_item a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--sasi-color-dark, #0E0E0E);
    font-weight: 500;
}

#pmpro_account-links .pmpro_list_item a:hover {
    color: var(--sasi-color-primary, #6C33FF);
}

/* ==========================================================================
   13. Page-Specific: Login
   ========================================================================== */

/* Login Form - Full Width */
.pmpro_login_wrap,
.pmpro_lost_password_wrap,
.pmpro_reset_password_wrap,
body .pmpro_login_wrap,
body .pmpro_lost_password_wrap,
body .pmpro_reset_password_wrap {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
}

.pmpro #loginform,
body .pmpro #loginform {
    margin: 0;
    width: 100% !important;
    max-width: 100% !important;
}

.pmpro #loginform .login-username,
.pmpro #loginform .login-password {
    margin-bottom: 20px;
}

.pmpro #loginform .login-remember {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pmpro #loginform .login-submit {
    margin-top: 25px;
}

.pmpro #loginform .login-submit input[type="submit"] {
    width: 100% !important;
}

/* Password Strength Meter */
.pmpro #pass-strength-result {
    border-radius: 14px;
    padding: 12px 20px;
    margin: 10px 0;
    font-weight: 500;
    text-align: center;
}

/* Password Toggle */
.pmpro .pmpro_form_field-password-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pmpro .pmpro_form_field-password-toggle button {
    background: none;
    border: none;
    padding: 0;
    color: var(--sasi-color-dark, #0E0E0E);
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.pmpro .pmpro_form_field-password-toggle button:hover {
    color: var(--sasi-color-primary, #6C33FF);
}

/* Actions Navigation */
.pmpro .pmpro_actions_nav {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid var(--sasi-border-color, #EEEEEE);
    text-align: center;
}

.pmpro .pmpro_actions_nav a {
    color: var(--sasi-color-dark, #0E0E0E);
    font-weight: 500;
}

.pmpro .pmpro_actions_nav a:hover {
    color: var(--sasi-color-primary, #6C33FF);
}

/* ==========================================================================
   14. Add-ons Support (15 Add-ons)
   ========================================================================== */

/* ---- 14.1 Advanced Levels Shortcode ---- */
.pmpro_advanced_levels-div .pmpro_level {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    transition: all 0.3s linear;
}

.pmpro_advanced_levels-div .pmpro_level:hover {
    border-color: #6C33FF;
}

.pmpro_advanced_levels-table,
.pmpro_advanced_levels-compare_table {
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    overflow: hidden;
}

.pmpro_advanced_levels-compare_table thead tr:first-child th {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
}

.pmpro_advanced_levels-compare_table .pmpro_level-compare-true {
    color: #6C33FF;
}

.pmpro_levels-2col .pmpro_level,
.pmpro_levels-3col .pmpro_level,
.pmpro_levels-4col .pmpro_level {
    text-align: center;
}

/* ---- 14.2 Member Directory ---- */
.pmpro_member_directory .pmpro_card {
    background-color: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    transition: all 0.3s linear;
}

.pmpro_member_directory .pmpro_card:hover {
    border-color: #6C33FF;
}

.pmpro_member_directory .pmpro_directory_card {
    background-color: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 25px;
    margin-bottom: 20px;
    transition: all 0.3s linear;
}

.pmpro_member_directory .pmpro_directory_card:hover {
    border-color: #6C33FF;
}

.pmpro_member_directory .pmpro_directory_avatar,
.pmpro_member_profile .avatar {
    border-radius: 50%;
    border: 3px solid #6C33FF;
}

.pmpro_member_profile .pmpro_card_content {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_member_profile_field_label {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
}

/* Member Directory Search */
form.pmpro_member_directory_search {
    background: var(--sasi-bg-color-gray, #EEEEEE);
    padding: 20px;
    border-radius: 14px;
    margin-bottom: 25px;
}

/* ---- 14.3 Membership Card ---- */
.pmpro_membership_card_display .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_membership_card_field_label {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
}

.pmpro_membership_card-print-button .pmpro_btn {
    background-color: #6C33FF !important;
}

/* ---- 14.4 Testimonials ---- */
.pmpro_testimonial {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_testimonial .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_testimonial__author img {
    border: 3px solid #6C33FF;
    border-radius: 50%;
}

.pmpro_star.filled {
    fill: #6C33FF;
    stroke: #6C33FF;
}

.pmpro_star {
    stroke: var(--sasi-border-color, #EEEEEE);
}

.pmpro_testimonials__default .pmpro_testimonial__rating_stars {
    color: #6C33FF;
}

/* ---- 14.5 Payment Plans ---- */
.pmpro_payment_plan_row {
    margin-bottom: 15px;
}

.pmpro_payment_plan_row label {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.3s linear;
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_payment_plan_row label:hover {
    border-color: #6C33FF;
}

.pmpro_payment_plan_row input[type="radio"]:checked+label,
.pmpro_payment_plan_row:has(input[type="radio"]:checked) label {
    border-color: #6C33FF;
    background-color: var(--sasi-bg-color-green, #F1FEE1);
}

#pmpropp_payment_plans {
    margin: 20px 0;
}

/* ---- 14.6 Affiliates ---- */
.pmpro_affiliates_dashboard {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_affiliates_dashboard .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_affiliates_stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 25px;
}

.pmpro_affiliates_stat {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-radius: 14px;
    padding: 25px;
    text-align: center;
}

.pmpro_affiliates_stat_value {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 32px;
    font-weight: 700;
    color: #6C33FF;
}

.pmpro_affiliate_link {
    background: var(--sasi-bg-color-gray, #EEEEEE);
    padding: 15px 20px;
    border-radius: 14px;
    font-family: monospace;
    word-break: break-all;
}

/* ---- 14.7 Auto-Renewal Checkbox ---- */
.pmpro_auto_renewal_checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 20px;
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-radius: 14px;
    margin: 15px 0;
}

.pmpro_auto_renewal_info {
    font-size: 14px;
    color: var(--sasi-color-text-main, #696969);
}

/* ---- 14.8 Discord Integration ---- */
.pmpro_discord_connection {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 25px;
    margin: 20px 0;
}

.pmpro_discord_status {
    display: flex;
    align-items: center;
    gap: 15px;
}

.pmpro_discord_status_connected {
    color: #28a745;
    font-weight: 600;
}

.pmpro_discord_status_disconnected {
    color: #dc3545;
    font-weight: 600;
}

.pmpro_discord_btn {
    background-color: #5865F2 !important;
    border-color: #5865F2 !important;
}

.pmpro_discord_btn:hover {
    background-color: #4752C4 !important;
    border-color: #4752C4 !important;
}

/* ---- 14.9 Gift Levels ---- */
.pmpro_gift .pmpro_gift_code {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    border: 2px dashed #6C33FF;
    border-radius: 14px;
    padding: 25px;
    text-align: center;
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 28px;
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
    letter-spacing: 2px;
}

.pmpro_gift_code_label {
    font-size: 14px;
    font-weight: 400;
    color: var(--sasi-color-text-main, #696969);
    margin-bottom: 10px;
    letter-spacing: 0;
}

.pmpro_gift_recipient_form {
    background: var(--sasi-bg-color-gray, #EEEEEE);
    padding: 25px;
    border-radius: 14px;
    margin: 20px 0;
}

/* ---- 14.10 Group Accounts ---- */
.pmpro_group_accounts .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_group_accounts .pmpro_group_member {
    background-color: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 15px;
    transition: all 0.3s linear;
}

.pmpro_group_accounts .pmpro_group_member:hover {
    border-color: #6C33FF;
}

.pmpro_group_member_avatar {
    border-radius: 50%;
    border: 2px solid #6C33FF;
}

.pmpro_group_invite_form {
    background: var(--sasi-bg-color-green, #F1FEE1);
    padding: 25px;
    border-radius: 14px;
    margin: 20px 0;
}

/* ---- 14.11 Invite Only ---- */
.pmpro_invite_code_field {
    margin: 20px 0;
}

.pmpro_invite_code_field input {
    font-family: monospace;
    letter-spacing: 1px;
}

.pmpro_invite_valid {
    color: #28a745;
    font-weight: 600;
}

.pmpro_invite_invalid {
    color: #dc3545;
    font-weight: 600;
}

/* ---- 14.12 Sponsored Members ---- */
.pmpro_sponsored_members .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_sponsored_members .pmpro_sponsored_member {
    background-color: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 15px;
    transition: all 0.3s linear;
}

.pmpro_sponsored_members .pmpro_sponsored_member:hover {
    border-color: #6C33FF;
}

.pmpro_sponsor_invite_form {
    background: var(--sasi-bg-color-green, #F1FEE1);
    padding: 25px;
    border-radius: 14px;
    margin: 20px 0;
}

/* ---- 14.13 Social Login ---- */
.pmpro_social_login_buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 20px 0;
}

.pmpro_social_login_button {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    padding: 14px 24px !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    transition: all 0.3s linear !important;
}

.pmpro_social_login_button.pmpro_social_google {
    background-color: #DB4437 !important;
    border-color: #DB4437 !important;
    color: #ffffff !important;
}

.pmpro_social_login_button.pmpro_social_facebook {
    background-color: #4267B2 !important;
    border-color: #4267B2 !important;
    color: #ffffff !important;
}

.pmpro_social_login_button.pmpro_social_twitter {
    background-color: #1DA1F2 !important;
    border-color: #1DA1F2 !important;
    color: #ffffff !important;
}

.pmpro_social_login_button.pmpro_social_linkedin {
    background-color: #0A66C2 !important;
    border-color: #0A66C2 !important;
    color: #ffffff !important;
}

.pmpro_social_login_divider {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 25px 0;
    color: var(--sasi-color-text-main, #696969);
}

.pmpro_social_login_divider::before,
.pmpro_social_login_divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--sasi-border-color, #EEEEEE);
}

/* ---- 14.14 Sitewide Sales ---- */
.pmpro_sitewide_sale_banner {
    background: linear-gradient(135deg, #6C33FF 0%, #8B5CF6 100%);
    color: #ffffff;
    padding: 20px 30px;
    border-radius: 14px;
    margin: 20px 0;
    text-align: center;
}

.pmpro_sitewide_sale_title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}

.pmpro_sitewide_sale_discount {
    font-size: 36px;
    font-weight: 700;
}

.pmpro_sitewide_sale_countdown {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}

.pmpro_sitewide_sale_countdown_item {
    background: rgba(255, 255, 255, 0.2);
    padding: 15px 20px;
    border-radius: 14px;
    text-align: center;
}

.pmpro_sitewide_sale_countdown_number {
    font-size: 28px;
    font-weight: 700;
    display: block;
}

.pmpro_sitewide_sale_countdown_label {
    font-size: 12px;
    text-transform: uppercase;
}

/* ---- 14.15 Group Discount Codes ---- */
.pmpro_group_discount_codes .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_discount_code_display {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border: 2px dashed #6C33FF;
    border-radius: 14px;
    padding: 20px;
    text-align: center;
    font-family: monospace;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2px;
}

.pmpro_discount_code_copy_btn {
    margin-top: 15px;
}

/* ---- 14.16 Signup Shortcode ---- */
.pmpro_signup_form .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_signup_form .pmpro_card_title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

.pmpro_signup_form-hidelabels .pmpro_form_input::placeholder {
    color: var(--sasi-color-text-main, #696969);
}

/* ---- 14.17 Member Badges ---- */
.pmpro_member_badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    background-color: #6C33FF;
    color: #ffffff;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.pmpro_member_badge img {
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.pmpro_member_badge_level {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    color: var(--sasi-color-dark, #0E0E0E);
    border: 1px solid #6C33FF;
}

/* ---- 14.18 Proration ---- */
.pmpro_proration_message {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-left: 4px solid #6C33FF;
    padding: 15px 20px;
    border-radius: 0 14px 14px 0;
    margin: 15px 0;
}

.pmpro_proration_amount {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    color: #6C33FF;
}

/* ---- 14.19 Reason for Cancelling ---- */
.pmpro_cancel_reason_form {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 25px;
    margin: 20px 0;
}

.pmpro_cancel_reason_form .pmpro_form_field-radio label {
    padding: 12px 15px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 10px;
    margin-bottom: 10px;
    display: block;
    cursor: pointer;
    transition: all 0.3s linear;
}

.pmpro_cancel_reason_form .pmpro_form_field-radio label:hover {
    border-color: #6C33FF;
}

.pmpro_cancel_reason_form .pmpro_form_field-radio input:checked+label,
.pmpro_cancel_reason_form .pmpro_form_field-radio label:has(input:checked) {
    border-color: #6C33FF;
    background-color: var(--sasi-bg-color-green, #F1FEE1);
}

/* ---- 14.20 Update Manager ---- */
.pmpro_update_manager_notice {
    background: linear-gradient(135deg, #6C33FF 0%, #8B5CF6 100%);
    color: #ffffff;
    padding: 15px 20px;
    border-radius: 14px;
    margin: 15px 0;
}

.pmpro_update_manager_notice a {
    color: #ffffff;
    text-decoration: underline;
}

/* ---- 14.21 Local Pricing ---- */
.pmpro_local_pricing {
    font-size: 14px;
    color: var(--sasi-color-text-main, #696969);
}

.pmpro_local_pricing_converted {
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
}

.pmpro_local_pricing_original {
    text-decoration: line-through;
    opacity: 0.7;
}

/* ---- 14.22 Nav Menus ---- */
.pmpro_nav_menu_widget {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_nav_menu_widget .widget-title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

.pmpro_nav_menu_widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pmpro_nav_menu_widget ul li a {
    display: block;
    padding: 10px 15px;
    border-radius: 14px;
    transition: all 0.3s linear;
}

.pmpro_nav_menu_widget ul li a:hover {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    color: #6C33FF;
}

/* ---- 14.23 Network (Multisite) ---- */
.pmpro_network_sites_list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.pmpro_network_site_card {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    transition: all 0.3s linear;
}

.pmpro_network_site_card:hover {
    border-color: #6C33FF;
}

.pmpro_network_site_name {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    font-size: 18px;
}

/* ---- 14.24 Reports Dashboard ---- */
.pmpro_reports_dashboard .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_reports_chart {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 20px;
    margin: 15px 0;
}

.pmpro_reports_stat_box {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-radius: 14px;
    padding: 20px;
    text-align: center;
}

.pmpro_reports_stat_value {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 28px;
    font-weight: 700;
    color: #6C33FF;
}

.pmpro_reports_stat_label {
    font-size: 14px;
    color: var(--sasi-color-text-main, #696969);
}

/* ---- 14.25 Level Cost Text ---- */
.pmpro_level_cost_text {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_level_cost_text strong {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    color: #6C33FF;
}

/* ---- 14.26 Div Levels ---- */
#pmpro_levels .pmpro_level {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 30px;
    margin-bottom: 20px;
    transition: all 0.3s linear;
}

#pmpro_levels .pmpro_level:hover {
    border-color: #6C33FF;
    box-shadow: 0 4px 20px rgba(108, 51, 255, 0.15);
}

#pmpro_levels .pmpro_level-active {
    border-color: #6C33FF;
    background: var(--sasi-bg-color-green, #F1FEE1);
}

#pmpro_levels .pmpro_level h2 {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    margin: 0 0 15px 0;
}

#pmpro_levels .pmpro_level-price {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 24px;
    font-weight: 700;
    color: #6C33FF;
    margin-bottom: 15px;
}

#pmpro_levels .pmpro_level-price .pmpro_level-expiration {
    font-size: 14px;
    font-weight: 400;
    color: var(--sasi-color-text-main, #696969);
}

#pmpro_levels .pmpro_level-select {
    margin: 20px 0;
}

#pmpro_levels .pmpro_level-select .pmpro_btn {
    width: 100%;
    text-align: center;
    justify-content: center;
}

#pmpro_levels .pmpro_level-select .pmpro_btn.disabled {
    background-color: var(--sasi-border-color, #EEEEEE) !important;
    border-color: var(--sasi-border-color, #EEEEEE) !important;
    color: var(--sasi-color-text-main, #696969) !important;
    cursor: not-allowed;
}

#pmpro_levels #nav-below {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--sasi-border-color, #EEEEEE);
}

#pmpro_levels #nav-below a {
    color: var(--sasi-color-dark, #0E0E0E);
    transition: color 0.3s linear;
}

#pmpro_levels #nav-below a:hover {
    color: #6C33FF;
}

/* ---- 14.27 Sitewide Sales - Banners ---- */
.pmpro_sws_banner {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_sws_banner h3 {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

#pmpro_sws_banner_top,
#pmpro_sws_banner_bottom {
    background: linear-gradient(135deg, #6C33FF 0%, #8B5CF6 100%) !important;
    color: #ffffff;
}

#pmpro_sws_banner_bottom_right {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid #6C33FF;
    border-radius: 14px;
}

.pmpro_sws_banner .pmpro_btn {
    background-color: #ffffff !important;
    color: #6C33FF !important;
    border: 2px solid #ffffff !important;
}

.pmpro_sws_banner .pmpro_btn:hover {
    background-color: transparent !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}

/* Sitewide Sales - Landing Page Override */
.pmpro_sitewide_sale_landing_page_template #pmpro_form {
    border-radius: 14px;
}

.pmpro_sitewide_sale_landing_page_template .pmpro_checkout {
    border-radius: 14px;
    overflow: hidden;
}

/* ---- 14.28 Discord Integration ---- */
.discord-user-info {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.discord-role {
    background-color: #6C33FF !important;
    color: #ffffff !important;
    border-radius: 999px;
    padding: 4px 12px;
    margin: 5px 5px 0 0;
}

.discord-role i {
    background-color: #ffffff !important;
}

.ets_assigned_role {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro-btn-connect,
.ets-btn.ets-bg-green {
    background: #6C33FF !important;
    border-radius: 999px;
    padding: 14px 24px;
}

.pmpro-btn-disconnect,
.ets-btn.ets-bg-red {
    background: linear-gradient(135deg, #FF6B6B 0%, #EE5A5A 100%) !important;
    border-radius: 999px;
}

/* ---- 14.29 Affiliates Enhanced ---- */
.pmpro_affiliates-table {
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
}

.pmpro_affiliates-table thead th {
    background: var(--sasi-bg-color-green, #F1FEE1);
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

.pmpro_affiliates-table tbody tr:hover {
    background: rgba(108, 51, 255, 0.05);
}

.pmpro_affiliate_link {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border: 2px dashed #6C33FF;
    border-radius: 14px;
    padding: 15px 20px;
    font-family: monospace;
}

.pmpro_affiliate_stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
}

.pmpro_affiliate_stat_box {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    text-align: center;
}

.pmpro_affiliate_stat_value {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-size: 24px;
    font-weight: 700;
    color: #6C33FF;
}

/* ---- 14.30 Group Accounts - Manage Page ---- */
#pmprogroupacct_manage_group .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

#pmprogroupacct_manage_group_settings {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border: 1px solid #6C33FF;
}

#pmprogroupacct_manage_group_members .pmpro_data_filters {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 15px;
    margin-bottom: 20px;
}

.pmprogroupacct_bulk_member_action_conditional input {
    border-radius: 10px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    padding: 12px 15px;
}

/* ---- 14.31 Password Strength Indicator ---- */
#pass-strength-result {
    border-radius: 14px;
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
    font-weight: 600;
}

#pass-strength-result.short {
    background-color: #FECACA;
    border-color: #F87171;
    color: #DC2626;
}

#pass-strength-result.bad {
    background-color: #FED7AA;
    border-color: #FB923C;
    color: #EA580C;
}

#pass-strength-result.good {
    background-color: #FEF3C7;
    border-color: #FBBF24;
    color: #D97706;
}

#pass-strength-result.strong {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    border-color: #6C33FF;
    color: #6C33FF;
}

/* ---- 14.32 Payment Gateway Styles ---- */
/* Stripe Card Fields */
.pmpro_checkout_gateway-stripe #AccountNumber,
.pmpro_checkout_gateway-stripe #Expiry,
.pmpro_checkout_gateway-stripe #CVV {
    border-radius: 14px !important;
    border-color: var(--sasi-border-color, #EEEEEE) !important;
    padding: 15px !important;
}

/* PayPal Button */
.pmpro_btn-submit-checkout-paypal-image {
    border-radius: 14px;
}

/* Payment Request Button (Apple Pay, Google Pay) */
#payment-request-button {
    border-radius: 14px;
    overflow: hidden;
}

/* ---- 14.33 Member Directory Blocks ---- */
#pmpro-member-profile-search {
    border-radius: 14px;
    border-color: var(--sasi-border-color, #EEEEEE);
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

#pmpro-member-profile-placeholder,
#pmpro-member-directory-placeholder,
#pmpro-member-directory-placeholder-4col {
    border: 3px solid #6C33FF;
}

.pmpro-member-profile-wrapper {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro-member-profile-subheading {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    color: #6C33FF;
}

.pmpro-table {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro-table th {
    background: var(--sasi-bg-color-green, #F1FEE1);
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

.pmpro-table td {
    border-color: var(--sasi-border-color, #EEEEEE);
}

/* Column layouts */
.col2,
.col3,
.col4 {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

/* ---- 14.34 Data Filters ---- */
.pmpro_data_filters {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 15px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_data_count {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
    font-weight: 600;
}

/* ---- 14.35 Testimonial Detail Classes ---- */
.pmpro_testimonial__name {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
}

.pmpro_testimonial__job_title {
    font-weight: 500;
    color: #6C33FF;
}

.pmpro_testimonial__company {
    font-style: italic;
    color: var(--sasi-color-text-main, #696969);
}

.pmpro_testimonial__author {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_testimonial__rating {
    color: #6C33FF;
    font-weight: 700;
}

.pmpro_testimonial__image_thumbnail img {
    border: 3px solid #6C33FF;
    border-radius: 50%;
}

/* ---- 14.36 Section Toggle ---- */
.pmpro_section_toggle {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 15px 20px;
    cursor: pointer;
    transition: all 0.3s linear;
}

.pmpro_section_toggle:hover {
    border-color: #6C33FF;
}

.pmpro_section_inside {
    padding: 20px;
}

/* ---- 14.37 Content Message ---- */
.pmpro_content_message {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-left: 4px solid #6C33FF;
    border-radius: 0 14px 14px 0;
    padding: 20px;
    margin: 15px 0;
}

.pmpro_content_message strong {
    color: #6C33FF;
    font-family: monospace;
    font-size: 18px;
    letter-spacing: 1px;
}

/* ---- 14.38 Form Legend ---- */
.pmpro_form_legend {
    border: none;
    padding: 0;
    margin-bottom: 20px;
}

.pmpro_form_heading {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
}

/* ---- 14.39 Button Variants ---- */
/* Select Button */
.pmpro_btn-select {
    background-color: #6C33FF;
    color: #ffffff;
}

.pmpro_btn-select:hover {
    background-color: #ffffff;
    color: #6C33FF;
    border-color: #6C33FF;
}

/* Renew Button */
.pmpro_btn-renew {
    background: linear-gradient(135deg, #6C33FF 0%, #8B5CF6 100%);
}

/* Cancel Button */
.pmpro_btn-cancel {
    background-color: transparent;
    color: var(--sasi-color-text-main, #696969);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_btn-cancel:hover {
    border-color: #6C33FF;
    color: #6C33FF;
    background-color: transparent;
}

/* Outline Button */
.pmpro_btn-outline {
    background-color: transparent;
    border: 2px solid #6C33FF;
    color: #6C33FF;
}

.pmpro_btn-outline:hover {
    background-color: #6C33FF;
    color: #ffffff;
}

/* Plain Button (text only) */
.pmpro_btn-plain {
    background: none !important;
    border: none !important;
    color: #6C33FF;
    padding: 0;
    text-decoration: underline;
}

.pmpro_btn-plain:hover {
    color: var(--sasi-color-dark, #0E0E0E);
    background: none !important;
}

/* Print Button */
.pmpro_btn-print {
    color: #6C33FF;
}

/* Export Button */
.pmpro_btn-export {
    color: #6C33FF;
}

/* Password Toggle */
.pmpro_btn-password-toggle {
    color: var(--sasi-color-text-main, #696969);
}

.pmpro_btn-password-toggle:hover {
    color: #6C33FF;
}

/* Discount Code Button */
.pmpro_btn-submit-discount-code {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    color: #6C33FF;
    border: 1px solid #6C33FF;
}

.pmpro_btn-submit-discount-code:hover {
    background-color: #6C33FF;
    color: #ffffff;
}

/* Sitewide Sales Banner Button */
.pmpro_sws_banner-button .pmpro_btn {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Disabled Button */
.pmpro_btn.disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* ---- 14.40 Status Tags ---- */
.pmpro_tag {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_tag-success {
    background-color: var(--sasi-bg-color-green, #F1FEE1);
    color: #0F441C;
}

.pmpro_tag-error,
.pmpro_tag-refunded {
    background-color: #FEE2E2;
    color: #DC2626;
}

.pmpro_tag-pending {
    background-color: #FEF3C7;
    color: #D97706;
}

.pmpro_tag-discount-code {
    background-color: #6C33FF;
    color: #ffffff;
    font-family: monospace;
    letter-spacing: 1px;
}

/* ---- 14.41 List Components ---- */
.pmpro_list-with-labels {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pmpro_list_item {
    padding: 10px 0;
    border-bottom: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_list_item:last-child {
    border-bottom: none;
}

.pmpro_list_item_label {
    font-weight: 600;
    color: var(--sasi-color-text-main, #696969);
    font-size: 13px;
}

.pmpro_list_item_value {
    color: var(--sasi-color-dark, #0E0E0E);
    font-weight: 500;
}

/* Column Grid */
.pmpro_cols-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

/* ---- 14.42 Typography Classes ---- */
.pmpro_font-small {
    font-size: 13px;
}

.pmpro_font-large {
    font-size: 20px;
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

.pmpro_font-x-large {
    font-size: 26px;
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
}

/* ---- 14.43 Level Details ---- */
.pmpro_level-price {
    font-size: 20px;
    font-weight: 700;
    color: #6C33FF;
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
}

.pmpro_level-expiration {
    font-size: 14px;
    color: var(--sasi-color-text-main, #696969);
}

/* ---- 14.44 Order Table ---- */
.pmpro_table_orders {
    border-radius: 14px;
    overflow: hidden;
}

.pmpro_table_order-date,
.pmpro_table_order-level,
.pmpro_table_order-amount,
.pmpro_table_order-status {
    font-weight: 600;
}

/* Card Action Separator */
.pmpro_card_action_separator {
    color: var(--sasi-border-color, #EEEEEE);
    margin: 0 10px;
}

/* ---- 14.45 Checkout/Billing Gateway ---- */
[class*="pmpro_checkout_gateway-"],
[class*="pmpro_billing_gateway-"] {
    background: var(--sasi-bg-color-white, #ffffff);
}

#pmpro_billing_address_fields {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 25px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

#pmpro_account_loggedin {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-radius: 14px;
    padding: 15px 20px;
    margin-bottom: 20px;
}

.pmpro_section_content {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_section_title {
    font-family: var(--sasi-font-second, 'Plus Jakarta Sans', sans-serif);
    font-weight: 700;
    color: var(--sasi-color-dark, #0E0E0E);
    margin-bottom: 20px;
}

/* ---- 14.46 Level Group Card ---- */
.pmpro_level_group {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    margin-bottom: 25px;
}

.pmpro_levels_table {
    border-radius: 14px;
    overflow: hidden;
}

/* ---- 14.47 Cancel Page ---- */
.pmpro_cancel_wrap {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

.pmpro_cancel-membership-levelname {
    font-weight: 600;
    color: var(--sasi-color-dark, #0E0E0E);
}

.pmpro_cancel-membership-expiration {
    color: var(--sasi-color-text-main, #696969);
}

.pmpro_cancel-membership-cancel {
    color: #DC2626;
}

#pmpro_cancel_reason_div {
    margin-top: 20px;
}

#pmpro_cancel_reason {
    border-radius: 14px;
    border-color: var(--sasi-border-color, #EEEEEE);
    min-height: 100px;
}

.pmpro_cancel_return_home a {
    color: #6C33FF;
}

/* ---- 14.48 Member Profile Fields ---- */
.pmpro_member_profile {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_member_profile_field {
    padding: 10px 0;
    border-bottom: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_member_profile_field:last-child {
    border-bottom: none;
}

.pmpro_member_profile_field_label {
    font-weight: 600;
    color: var(--sasi-color-text-main, #696969);
    font-size: 13px;
    margin-bottom: 5px;
}

.pmpro_member_profile_field_data {
    color: var(--sasi-color-dark, #0E0E0E);
}

/* ---- 14.49 Login Container ---- */
#pmpro_login {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

#pmpro_login .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

#pmpro_login .nsl-container-buttons {
    margin-top: 15px;
}

/* ---- 14.50 Payment Plan Container ---- */
.pmpro_payment_plan_level_container {
    background: var(--sasi-bg-color-white, #ffffff);
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 15px;
}

.pmpro_payment_plan_level_inner {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

/* ---- 14.51 Change Password ---- */
#pmpro_change_password {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

#pmpro_change_password .pmpro_card {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_change_password-fields {
    margin-bottom: 20px;
}

/* ---- 14.52 Payment Fields ---- */
#pmpro_payment_method {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 20px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    margin-bottom: 20px;
}

#pmpro_payment_information_fields {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 25px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

#pmpro_payment_information_fields .pmpro_payment-request-button {
    margin-bottom: 20px;
}

/* ---- 14.53 Captcha ---- */
.pmpro_captcha {
    margin: 20px 0;
    display: flex;
    justify-content: center;
}

.pmpro_captcha .g-recaptcha {
    transform-origin: center;
}

/* ---- 14.54 Terms of Service ---- */
#pmpro_tos_fields {
    background: var(--sasi-bg-color-green, #F1FEE1);
    border-radius: 14px;
    padding: 20px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    margin-top: 20px;
}

#pmpro_tos_fields .pmpro_form_field-checkbox label {
    font-weight: 500;
}

#pmpro_tos_fields a {
    color: #6C33FF;
    font-weight: 600;
}

/* ---- 14.55 Alert Message ---- */
.pmpro_message.pmpro_alert {
    background-color: #FEF3C7;
    border-left: 4px solid #D97706;
    color: #92400E;
    padding: 15px 20px;
    border-radius: 0 14px 14px 0;
    margin-bottom: 20px;
}

/* ---- 14.56 Action Links ---- */
#pmpro_actionlink-profile,
#pmpro_actionlink-change-password,
#pmpro_actionlink-logout,
#pmpro_actionlink-renew,
#pmpro_actionlink-update-billing,
#pmpro_actionlink-change,
#pmpro_actionlink-cancel {
    color: #6C33FF;
    font-weight: 500;
    transition: all 0.3s linear;
}

#pmpro_actionlink-profile:hover,
#pmpro_actionlink-change-password:hover,
#pmpro_actionlink-logout:hover,
#pmpro_actionlink-renew:hover,
#pmpro_actionlink-update-billing:hover,
#pmpro_actionlink-change:hover {
    color: var(--sasi-color-dark, #0E0E0E);
}

#pmpro_actionlink-cancel:hover {
    color: #DC2626;
}

/* ---- 14.57 User Fields ---- */
#pmpro_user_fields {
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    padding: 25px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
    margin-bottom: 20px;
}

/* ---- 14.58 Notifications ---- */
.pmpro_notification {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 15px 20px;
    border-radius: 14px;
    margin-bottom: 15px;
}

.pmpro_notification-icon {
    flex-shrink: 0;
}

.pmpro_notification-content {
    flex: 1;
}

.pmpro_notification-error {
    background-color: #FEE2E2;
    border-left: 4px solid #DC2626;
}

.pmpro-notice {
    border-radius: 14px;
    padding: 15px;
}

/* ---- 14.59 Account Sections ---- */
#pmpro_account-profile,
#pmpro_account-membership,
#pmpro_account-orders,
#pmpro_account-links {
    margin-bottom: 25px;
}

#pmpro_account-membership-none {
    text-align: center;
    padding: 30px;
}

/* ---- 14.60 Advanced Levels Wrappers ---- */
.pmpro_advanced_levels-table,
.pmpro_advanced_levels-div,
.pmpro_advanced_levels-compare_table,
.pmpro_advanced_levels-compare_table_responsive {
    font-family: var(--sasi-font-main, 'Inter', sans-serif);
}

/* ---- 14.61 Level States ---- */
.pmpro_level-highlight {
    border: 2px solid #6C33FF !important;
    box-shadow: 0 8px 25px rgba(108, 51, 255, 0.15);
    transform: scale(1.02);
}

.pmpro_level-current {
    border-color: #6C33FF;
    background-color: var(--sasi-bg-color-green, #F1FEE1);
}

/* ---- 14.62 Lost/Reset Password ---- */
.pmpro_lost_password_wrap,
.pmpro_reset_password_wrap {
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_lost_password-instructions {
    color: var(--sasi-color-text-main, #696969);
    margin-bottom: 20px;
}

/* ---- 14.63 Heading with Avatar ---- */
.pmpro_heading-with-avatar {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* ---- 14.64 Icons ---- */
.pmpro_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pmpro_icon-eye {
    color: #6C33FF;
}

.pmpro_icon svg {
    stroke: #6C33FF;
}

/* ---- 14.65 Member Box ---- */
.pmpro_member-box {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 15px;
    background: var(--sasi-bg-color-white, #ffffff);
    border-radius: 14px;
    border: 1px solid var(--sasi-border-color, #EEEEEE);
}

.pmpro_member-box-avatar {
    flex-shrink: 0;
}

.pmpro_member-box-avatar img {
    border-radius: 50%;
}

.pmpro_member-box-info {
    flex: 1;
}

.pmpro_member-box-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* ---- 14.66 Spacer & Divider ---- */
.pmpro_spacer {
    height: 20px;
}

.pmpro_divider {
    height: 1px;
    background-color: var(--sasi-border-color, #EEEEEE);
    margin: 20px 0;
}


/* ==========================================================================
   15. Dark Mode Support
   ========================================================================== */

.dark-mode .pmpro,
body.dark-mode .pmpro {
    color: var(--sasi-color-text-main);
}

/* Dark Mode - Typography */
.dark-mode .pmpro h1,
.dark-mode .pmpro h2,
.dark-mode .pmpro h3,
.dark-mode .pmpro h4,
.dark-mode .pmpro h5,
.dark-mode .pmpro h6 {
    color: var(--sasi-color-dark);
}

.dark-mode .pmpro a {
    color: var(--sasi-color-dark);
}

.dark-mode .pmpro a:hover {
    color: var(--sasi-color-primary);
}

/* Dark Mode - Buttons */
.dark-mode .pmpro .pmpro_btn,
.dark-mode .pmpro input[type="submit"],
.dark-mode .pmpro button[type="submit"] {
    color: #ffffff !important;
    background-color: #6C33FF !important;
    border-color: #6C33FF !important;
}

.dark-mode .pmpro .pmpro_btn:hover,
.dark-mode .pmpro input[type="submit"]:hover,
.dark-mode .pmpro button[type="submit"]:hover {
    color: #6C33FF !important;
    background-color: #ffffff !important;
    border-color: #6C33FF !important;
}

.dark-mode .pmpro .pmpro_btn-outline {
    color: var(--sasi-color-dark);
    background-color: transparent;
    border-color: var(--sasi-color-gray);
}

.dark-mode .pmpro .pmpro_btn-outline:hover {
    color: #ffffff;
    background-color: #6C33FF;
    border-color: #6C33FF;
}

/* Dark Mode - Forms (Dark Input Fields) */
.dark-mode .pmpro input[type="text"],
.dark-mode .pmpro input[type="email"],
.dark-mode .pmpro input[type="url"],
.dark-mode .pmpro input[type="password"],
.dark-mode .pmpro input[type="search"],
.dark-mode .pmpro input[type="number"],
.dark-mode .pmpro input[type="tel"],
.dark-mode .pmpro input[type="date"],
.dark-mode .pmpro textarea,
.dark-mode .pmpro select,
.dark-mode #loginform input[type="text"],
.dark-mode #loginform input[type="password"],
.dark-mode .pmpro_login_wrap input[type="text"],
.dark-mode .pmpro_login_wrap input[type="password"],
.dark-mode .pmpro_lost_password_wrap input[type="text"],
.dark-mode .pmpro_lost_password_wrap input[type="email"],
.dark-mode .pmpro_reset_password_wrap input[type="password"],
body.dark-mode .pmpro input[type="text"],
body.dark-mode .pmpro input[type="email"],
body.dark-mode .pmpro input[type="password"],
body.dark-mode #loginform input[type="text"],
body.dark-mode #loginform input[type="password"],
body.dark-mode .pmpro #loginform input[type="text"],
body.dark-mode .pmpro #loginform input[type="password"],
body.dark-mode .login-username input,
body.dark-mode .login-password input {
    color: #ffffff !important;
    background-color: #0A0D12 !important;
    border: 1px solid #272A2F !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.dark-mode .pmpro input:focus,
.dark-mode .pmpro textarea:focus,
.dark-mode .pmpro select:focus {
    border-color: var(--sasi-border-focus-input);
}

.dark-mode .pmpro input::placeholder,
.dark-mode .pmpro textarea::placeholder {
    color: var(--sasi-color-placeholder-input);
}

.dark-mode .pmpro label,
.dark-mode .pmpro .pmpro_form_label {
    color: var(--sasi-color-dark);
}

/* Dark Mode - Select Arrow */
.dark-mode .pmpro select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath fill='%23ffffff' d='M6 7L0 0h12z'/%3E%3C/svg%3E");
}

/* Dark Mode - Cards */
.dark-mode .pmpro .pmpro_card {
    background-color: #0F1217 !important;
    border-color: #272A2F !important;
}

.dark-mode .pmpro .pmpro_card_title {
    color: #ffffff;
}

.dark-mode .pmpro .pmpro_card_content p {
    color: #cccccc;
}

.dark-mode .pmpro .pmpro_card_actions {
    background-color: #1B1E23 !important;
    border-color: #272A2F !important;
}

/* Dark Mode - Messages */
.dark-mode .pmpro .pmpro_message {
    background-color: var(--sasi-bg-color-green);
    border-color: var(--sasi-color-primary);
    color: var(--sasi-color-dark);
}

/* Dark Mode - Tables */
.dark-mode .pmpro .pmpro_table {
    border-color: #272A2F !important;
}

.dark-mode .pmpro .pmpro_table thead th {
    background-color: #1B1E23 !important;
    color: #ffffff;
    border-color: #272A2F !important;
}

.dark-mode .pmpro .pmpro_table tbody td,
.dark-mode .pmpro .pmpro_table tbody th {
    background-color: #0F1217 !important;
    color: #cccccc;
    border-color: #272A2F !important;
}

.dark-mode .pmpro .pmpro_table tfoot td {
    background-color: #1B1E23 !important;
    color: #ffffff;
}

/* Dark Mode - Tags */
.dark-mode .pmpro .pmpro_tag {
    border-color: #272A2F !important;
}

/* Dark Mode - Pagination */
.dark-mode .pmpro .pmpro_pagination a,
.dark-mode .pmpro .pmpro_pagination span {
    background-color: #0F1217 !important;
    border-color: #272A2F !important;
    color: #ffffff;
}

.dark-mode .pmpro .pmpro_pagination a:hover,
.dark-mode .pmpro .pmpro_pagination .pmpro_pagination-current {
    background-color: #6C33FF;
    border-color: #6C33FF;
    color: #ffffff;
}

/* Dark Mode - Avatar */
.dark-mode .pmpro .avatar {
    border-color: #6C33FF;
}

/* ==========================================================================
   16. Responsive Adjustments
   ========================================================================== */

@media screen and (max-width: 991px) {
    .pmpro .pmpro_card_title {
        font-size: 20px;
        padding: 25px 25px 0;
    }

    .pmpro .pmpro_card_content {
        padding: 15px 25px 25px;
    }

    .pmpro .pmpro_card_actions {
        padding: 12px 25px;
    }

    .pmpro .pmpro_table thead th,
    .pmpro .pmpro_table tbody td,
    .pmpro .pmpro_table tbody th {
        padding: 15px;
    }

    .pmpro_levels .pmpro_level .pmpro_level-price {
        font-size: 36px;
    }
}

@media screen and (max-width: 767px) {

    .pmpro .pmpro_btn,
    .pmpro input[type="submit"],
    .pmpro button[type="submit"] {
        padding: 14px 20px;
        font-size: 15px;
        width: 100%;
    }

    .pmpro input[type="text"],
    .pmpro input[type="email"],
    .pmpro input[type="password"],
    .pmpro textarea,
    .pmpro select {
        padding: 16px;
    }

    .pmpro .pmpro_card_title {
        font-size: 18px;
        padding: 20px 20px 0;
    }

    .pmpro .pmpro_card_content {
        padding: 15px 20px 20px;
    }

    .pmpro .pmpro_card_actions {
        padding: 12px 20px;
    }

    .pmpro .pmpro_table {
        border-radius: 10px;
    }

    .pmpro .pmpro_table thead {
        display: none;
    }

    .pmpro .pmpro_table tbody tr td,
    .pmpro .pmpro_table tbody tr th {
        display: grid;
        grid-template-columns: 1fr 2fr;
        padding: 12px 15px;
    }

    .pmpro .pmpro_table tbody tr td::before,
    .pmpro .pmpro_table tbody tr th::before {
        content: attr(data-title) ": ";
        font-weight: 600;
        color: var(--sasi-color-dark, #0E0E0E);
    }

    .pmpro .pmpro_actions_nav {
        flex-direction: column;
        gap: 15px;
    }

    .pmpro .pmpro_actions_nav-left,
    .pmpro .pmpro_actions_nav-right {
        text-align: center;
        flex-basis: 100%;
    }

    .pmpro .pmpro_pagination {
        flex-wrap: wrap;
    }

    .pmpro_login_wrap,
    .pmpro_lost_password_wrap,
    .pmpro_reset_password_wrap {
        max-width: 100%;
    }

    .pmpro_levels .pmpro_level .pmpro_level-price {
        font-size: 32px;
    }

    /* Dark Mode Mobile Adjustments */
    .dark-mode .pmpro .pmpro_table tbody tr td::before,
    .dark-mode .pmpro .pmpro_table tbody tr th::before {
        color: var(--sasi-color-dark);
    }
}

@media screen and (max-width: 575px) {
    .pmpro .pmpro_section {
        margin: 25px 0;
    }

    .pmpro .pmpro_card {
        margin: 15px 0;
        border-radius: 10px;
    }

    .pmpro .pmpro_message {
        padding: 15px 18px;
        border-radius: 10px;
    }

    .pmpro .pmpro_form_fields {
        gap: 15px;
    }

    .pmpro #pmpro_payment_method {
        flex-direction: column;
    }

    .pmpro #pmpro_payment_method label {
        width: 100%;
    }
}

/* ==========================================================================
   17. Additional Dark Mode Consistency
   ========================================================================== */

/* Dark Mode - Table Footer / Invoice Total (Match Header) */
.dark-mode .pmpro .pmpro_table tfoot td,
.dark-mode .pmpro table tfoot td,
.dark-mode .pmpro .pmpro_invoice tfoot td,
.dark-mode .pmpro .pmpro_invoice_wrap tfoot td {
    background-color: #1B1E23 !important;
    color: #ffffff !important;
    border-color: #272A2F !important;
}

/* Dark Mode - Member Links Section */
.dark-mode #pmpro_account-links .pmpro_card_content,
.dark-mode #pmpro_account-links .pmpro_list_item a {
    color: #ffffff;
}

/* Dark Mode - Focus States */
.dark-mode .pmpro input:focus,
.dark-mode .pmpro textarea:focus,
.dark-mode .pmpro select:focus,
.dark-mode #loginform input:focus,
body.dark-mode .pmpro input:focus,
body.dark-mode #loginform input:focus,
body.dark-mode .login-username input:focus,
body.dark-mode .login-password input:focus {
    border-color: #6C33FF !important;
    box-shadow: 0 0 0 2px rgba(108, 51, 255, 0.3) !important;
    outline: none !important;
}

/* Dark Mode - Icons & SVG Visibility */
.dark-mode .pmpro svg,
.dark-mode .pmpro .pmpro_icon,
.dark-mode .pmpro_icon svg,
.dark-mode #loginform .dashicons,
.dark-mode .pmpro .dashicons,
.dark-mode .pmpro_form_field-password-toggle button,
body.dark-mode .pmpro svg,
body.dark-mode .dashicons {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.dark-mode .pmpro_icon svg path,
.dark-mode .pmpro svg path {
    stroke: #ffffff !important;
    fill: #ffffff !important;
}

/* Dark Mode - Icons Hover (change to primary when background is white) */
.dark-mode .pmpro .pmpro_btn:hover svg,
.dark-mode .pmpro .pmpro_btn:hover .pmpro_icon,
.dark-mode .pmpro .pmpro_btn:hover .dashicons,
.dark-mode .pmpro a:hover svg,
.dark-mode .pmpro a:hover .dashicons,
body.dark-mode .pmpro_btn:hover svg,
body.dark-mode .pmpro_btn:hover .dashicons {
    color: #6C33FF !important;
    fill: #6C33FF !important;
}

.dark-mode .pmpro .pmpro_btn:hover svg path,
.dark-mode .pmpro a:hover svg path {
    stroke: #6C33FF !important;
    fill: #6C33FF !important;
}

/* Dark Mode - Checkbox */
.dark-mode .pmpro input[type="checkbox"],
.dark-mode #loginform input[type="checkbox"],
body.dark-mode input[type="checkbox"] {
    accent-color: #6C33FF !important;
}

/* Dark Mode - Separator Lines */
.dark-mode .pmpro hr,
.dark-mode .pmpro_login_wrap hr,
.dark-mode .pmpro_lost_password_wrap hr {
    border-color: #272A2F !important;
    background-color: #272A2F !important;
}

/* Dark Mode - Form Wrappers */
.dark-mode .pmpro_login_wrap,
.dark-mode .pmpro_lost_password_wrap,
.dark-mode .pmpro_reset_password_wrap {
    border-color: #272A2F !important;
    background-color: #0F1217 !important;
}

/* Dark Mode - Error Message */
.dark-mode .pmpro .pmpro_message.pmpro_error {
    background-color: #4a1a1d;
    border-color: #dc3545;
    color: #f8d7da;
}

.dark-mode .pmpro .pmpro_message.pmpro_error a {
    color: #ff6b6b;
}

/* Dark Mode - Paragraph Text */
.dark-mode .pmpro p,
.dark-mode .pmpro .pmpro_card_content p {
    color: #cccccc;
}

/* Dark Mode - Levels Page */
.dark-mode #pmpro_levels .pmpro_level,
body.dark-mode #pmpro_levels .pmpro_level {
    background-color: #0F1217 !important;
    border-color: #272A2F !important;
}

.dark-mode #pmpro_levels .pmpro_level:hover,
body.dark-mode #pmpro_levels .pmpro_level:hover {
    border-color: #6C33FF !important;
}

.dark-mode #pmpro_levels .pmpro_level h2,
body.dark-mode #pmpro_levels .pmpro_level h2 {
    color: #ffffff !important;
}

.dark-mode #pmpro_levels .pmpro_level-price,
body.dark-mode #pmpro_levels .pmpro_level-price {
    color: #6C33FF !important;
}

/* Dark Mode - Select Button */
.dark-mode #pmpro_levels .pmpro_level .pmpro_btn,
.dark-mode #pmpro_levels .pmpro_level a.pmpro_btn,
.dark-mode .pmpro_level-select .pmpro_btn,
.dark-mode .pmpro_level-select a,
body.dark-mode #pmpro_levels .pmpro_btn,
body.dark-mode #pmpro_levels a.pmpro_btn,
#pmpro_levels .pmpro_level .pmpro_btn,
#pmpro_levels .pmpro_level a.pmpro_btn,
.pmpro_level-select .pmpro_btn,
.pmpro_level-select a {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    background-color: #6C33FF !important;
    background: #6C33FF !important;
    border: 1px solid #6C33FF !important;
    padding: 16px 25px !important;
    line-height: 1 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transition: all 0.3s linear !important;
    box-shadow: none !important;
}

.dark-mode #pmpro_levels .pmpro_level .pmpro_btn:hover,
.dark-mode #pmpro_levels .pmpro_level a.pmpro_btn:hover,
.dark-mode .pmpro_level-select .pmpro_btn:hover,
.dark-mode .pmpro_level-select a:hover,
body.dark-mode #pmpro_levels .pmpro_btn:hover,
#pmpro_levels .pmpro_level .pmpro_btn:hover,
#pmpro_levels .pmpro_level a.pmpro_btn:hover,
.pmpro_level-select .pmpro_btn:hover,
.pmpro_level-select a:hover {
    color: #6C33FF !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-color: #6C33FF !important;
}