/* WooCommerce checkbox label spacing */
.optinperks-newsletter-optin-wrap .woocommerce-form__label-for-checkbox,
.woocommerce-form__label-for-checkbox {
    display: flex;
    align-items: flex-start;
}

.optinperks-newsletter-optin-wrap .woocommerce-form__input-checkbox,
.woocommerce-form__input-checkbox {
    margin: 0;
    margin-right: 8px; /* Standardized gap between checkbox and text */
    flex-shrink: 0;
    margin-top: 2px;
}

/* Wobble animation for error messages */
@keyframes optinperks-wobble {
    0% { transform: translateX(0px); }
    15% { transform: translateX(-5px) rotate(-5deg); }
    30% { transform: translateX(3px) rotate(3deg); }
    45% { transform: translateX(-3px) rotate(-3deg); }
    60% { transform: translateX(2px) rotate(2deg); }
    75% { transform: translateX(-1px) rotate(-1deg); }
    100% { transform: translateX(0px) rotate(0deg); }
}

.optinperks-wobble {
    animation: optinperks-wobble var(--optinperks-duration-normal) var(--optinperks-ease-in-out);
}

/* GDPR Consent Checkbox Styling - Unified yellow theme for all forms */
.optinperks-consent-row {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
    padding: 12px !important;
    background-color: var(--optinperks-consent-bg) !important; /* Warm yellow background */
    border: 1px solid var(--optinperks-consent-border) !important; /* Light yellow border */
    border-left: 4px solid var(--optinperks-consent-accent) !important; /* Orange accent border */
    border-radius: 6px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
    /* Show consent checkbox when inside mapped fields that are visible */
}

/* Show consent checkbox when inside mapped fields that are visible */
.optinperks-mapped-fields:not([style*="display: none"]) .optinperks-consent-row {
    display: block !important;
}

/* Show consent checkbox when mapped fields have show class or are visible */
.optinperks-mapped-fields.show .optinperks-consent-row,
.optinperks-mapped-fields[style*="display: block"] .optinperks-consent-row {
    display: block !important;
}

.optinperks-consent-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important; /* Standardized gap between checkbox and text */
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: var(--optinperks-consent-label) !important;
    cursor: pointer !important;
    margin: 0 !important;
}

.optinperks-consent-checkbox {
    margin: 0 !important;
    margin-top: 2px !important;
    flex-shrink: 0 !important;
    width: 18px !important;
    height: 18px !important;
    vertical-align: sub !important;
}

.optinperks-consent-text {
    flex: 1 !important;
    font-weight: 500 !important;
    color: var(--optinperks-consent-text) !important;
}

/* Privacy policy text styling */
.optinperks-privacy-policy-text {
    margin-top: 8px !important;
    padding-left: 0 !important; /* Align all the way to the left */
    font-size: 13px !important;
    line-height: 1.4 !important;
    color: var(--optinperks-consent-privacy-text) !important;
    font-style: italic !important;
}

.optinperks-privacy-policy-text a {
    color: var(--optinperks-consent-privacy-link) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.2s ease !important;
}

.optinperks-privacy-policy-text a:hover,
.optinperks-privacy-policy-text a:focus {
    color: var(--optinperks-consent-privacy-link-hover) !important;
    border-bottom-color: var(--optinperks-consent-privacy-link-hover) !important;
    text-decoration: none !important;
}

/* Form row styling for standalone forms - now uses unified yellow theme */
/* All styling now handled by the unified base rule above */
/* Display is handled by the rule at lines 374-376 */

/* Checkout and registration form styling - now uses unified theme from base rule above */
/* All styling now inherited from the unified base rule above */

/* This rule is now handled above at lines 387-395, removing duplicate */

/* Focus states */
.optinperks-consent-checkbox:focus {
    outline: 2px solid var(--optinperks-brand-primary) !important;
    outline-offset: 2px !important;
}

/* Error state for consent checkbox */
.optinperks-consent-row.error {
    border-color: var(--optinperks-consent-error-border) !important;
    background-color: var(--optinperks-consent-error-bg) !important;
}

.optinperks-consent-row.error .optinperks-consent-text {
    color: var(--optinperks-consent-error-text) !important;
}

/* Double opt-in notice styling */
.optinperks-double-optin-notice {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
    padding: 8px 12px !important;
    background-color: #e7f3ff !important;
    border: 1px solid #b3d9ff !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    color: var(--optinperks-brand-primary) !important;
    line-height: 1.4 !important;
    display: none !important; /* Hidden by default */
    transition: all 0.3s ease !important;
}

.optinperks-popup-content .optinperks-double-optin-notice {
    margin-top: 0 !important;
}

.optinperks-double-optin-notice.show {
    display: block !important;
}

/* For standalone forms and popups, always show double optin notice when present */
.optinperks-form .optinperks-double-optin-notice,
.optinperks-popup-body .optinperks-double-optin-notice {
    display: block !important;
}

.optinperks-double-optin-notice span {
    font-weight: 600 !important;
}

/* Auto-complete field validation styles */
.optinperks-autocomplete.optinperks-invalid-autocomplete {
    border-color: var(--optinperks-validation-error-border) !important;
    background-color: var(--optinperks-validation-error-bg) !important;
    box-shadow: 0 0 0 1px var(--optinperks-validation-error-border) !important;
}

.optinperks-autocomplete-error {
    color: var(--optinperks-validation-error-text);
    font-size: 12px;
    margin-top: 5px;
    display: block;
    font-style: italic;
}

/* Enhanced field validation error styles */
.optinperks-field-error {
    border-color: var(--optinperks-validation-error-border) !important;
    background-color: var(--optinperks-validation-error-bg) !important;
    box-shadow: 0 0 0 1px var(--optinperks-validation-error-border) !important;
}

.optinperks-field-error-message {
    color: var(--optinperks-validation-error-text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-top: 6px !important;
    margin-bottom: 8px !important;
    display: block !important;
    padding: 4px 8px !important;
    background-color: var(--optinperks-validation-error-bg) !important;
    border-left: 3px solid var(--optinperks-validation-error-border) !important;
    border-radius: 3px !important;
    animation: optinperks-error-shake var(--optinperks-duration-slow) var(--optinperks-ease-in-out) !important;
}

/* General error message styling */
.optinperks-error-message {
    color: var(--optinperks-validation-error-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    padding: 12px 15px !important;
    background: var(--optinperks-validation-error-bg) !important;
    border: 1px solid var(--optinperks-validation-error-border) !important;
    border-radius: 4px !important;
    border-left: 4px solid var(--optinperks-validation-error-border) !important;
    animation: optinperks-error-shake var(--optinperks-duration-slow) var(--optinperks-ease-in-out) !important;
}

/* Error shake animation */
@keyframes optinperks-error-shake {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-2px); }
    20%, 40%, 60%, 80% { transform: translateX(2px); }
}

.woocommerce-form-register .optinperks-newsletter-optin-wrap {
    margin-top: 4px;
    margin-bottom: 16px;
}

/* ======================================== */
/* CONTAINER OVERFLOW PROTECTION */
/* ======================================== */

/* Prevent text overflow in small containers */
.optinperks-form {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    min-width: 0; /* Allow container to shrink below content size */
    /* Force container to respect parent width constraints */
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    /* Basic form container */
    margin: 0 auto;
    padding: 20px;
    background: var(--optinperks-bg-primary);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    /* CSS Variables for button colors */
    --optinperks-button-bg-color: var(--optinperks-brand-primary);
    --optinperks-button-border-color: var(--optinperks-brand-primary);
    --optinperks-button-text-color: #fff;
    --optinperks-button-bg-color-hover: var(--optinperks-brand-hover);
    --optinperks-button-border-color-hover: var(--optinperks-brand-hover);
}

/* Ensure button text wraps properly */
.optinperks-form button[type="submit"] {
    white-space: normal; /* Allow text to wrap */
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    line-height: 1.4; /* Maintain readability when wrapped */
    min-height: 44px; /* Ensure minimum touch target size */
}

/* Ensure email input text wraps properly */
.optinperks-form .input-text {
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
}

/* Ensure labels wrap properly */
.optinperks-form label {
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    line-height: 1.4;
}


/* Ensure form rows don't overflow */
.optinperks-form .form-row {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure inputs respect container width */
.optinperks-form .input-text {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure buttons respect container width */
.optinperks-form button[type="submit"] {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ======================================== */
/* RESPONSIVE CONTAINER HANDLING */
/* ======================================== */

/* Handle very small containers */
@media (max-width: 300px) {
    .optinperks-form {
        padding: 15px 10px;
        font-size: 14px;
    }
    
    .optinperks-form button[type="submit"] {
        font-size: 14px;
        padding: 10px 15px;
        /* Margin and positioning handled by separate rule below */
    }
    
    .optinperks-form .input-text {
        font-size: 14px;
        padding: 8px 10px;
    }
    
    .optinperks-form label {
        font-size: 13px;
    }
}

/* Responsive checkout newsletter options */
@media (max-width: 768px) {
    body.woocommerce-checkout .optinperks-newsletter-optin-wrap {
        margin: 8px 0;
        padding: 8px;
    }
    
    body.woocommerce-checkout .optinperks-newsletter-checkbox-label,
    body.woocommerce-checkout .optinperks-terms-checkbox-label {
        font-size: 14px;
        gap: 8px; /* Standardized gap between checkbox and text */
    }
    
    body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    body.woocommerce-checkout .optinperks-newsletter-optin-wrap {
        margin: 5px 0;
        padding: 8px;
    }
    
    body.woocommerce-checkout .optinperks-newsletter-checkbox-label,
    body.woocommerce-checkout .optinperks-terms-checkbox-label {
        font-size: 13px;
        gap: 6px; /* Reduced gap for mobile devices */
    }
}

/* Handle extremely small containers */
@media (max-width: 200px) {
    .optinperks-form {
        padding: 10px 8px;
        font-size: 13px;
    }
    
    .optinperks-form button[type="submit"] {
        font-size: 13px;
        padding: 8px 12px;
        min-height: 40px;
        /* Margin and positioning handled by separate rule below */
    }
    
    .optinperks-form .input-text {
        font-size: 13px;
        padding: 6px 8px;
    }
    
    .optinperks-form label {
        font-size: 12px;
    }
}

/* Hide mapped fields by default, JS will show them if needed */
.optinperks-mapped-fields {
    display: none !important;
    /* WordPress Registration Form specific mapped fields styling - Generic targeting */
    margin-top: 15px !important;
    transition: all 0.3s ease !important;
}

/* Show mapped fields when newsletter checkbox is checked (controlled by JavaScript) */
.optinperks-newsletter-optin-wrap .optinperks-mapped-fields.optinperks-fields-visible,
.optinperks-newsletter-optin-wrap .optinperks-mapped-fields[style*="display: block"],
.optinperks-mapped-fields.optinperks-fields-visible {
    display: block !important;
}

/* Always show consent checkbox in standalone and popup forms */
.optinperks-newsletter-form .optinperks-consent-row,
.optinperks-popup-content .optinperks-consent-row {
    display: block !important;
}

/* Ensure consent label is flex in popup and standalone forms */
.optinperks-newsletter-form .optinperks-consent-label,
.optinperks-popup-content .optinperks-consent-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
}

/* Show consent checkbox in checkout/registration forms when newsletter checkbox is checked (controlled by JavaScript) */
.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-consent-row[style*="display: block"],
.woocommerce-form-register .optinperks-newsletter-optin-wrap .optinperks-consent-row[style*="display: block"],
.register .optinperks-newsletter-optin-wrap .optinperks-consent-row[style*="display: block"],
body.register .optinperks-newsletter-optin-wrap .optinperks-consent-row[style*="display: block"],
#registerform .optinperks-newsletter-optin-wrap .optinperks-consent-row[style*="display: block"],
.woocommerce-checkout .optinperks-consent-row.show,
.woocommerce-form-register .optinperks-consent-row.show,
.register .optinperks-consent-row.show,
body.register .optinperks-consent-row.show,
#registerform .optinperks-consent-row.show {
    display: block !important;
}



.optinperks-mapped-fields .form-row:last-child {
    margin-bottom: 0 !important;
}

.optinperks-mapped-fields label {
    display: block !important;
    margin-bottom: 4px !important;
    font-weight: 600 !important;
    color: #333 !important;
    font-size: 14px !important;
}

.optinperks-mapped-fields .input-text {
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease !important;
}

.optinperks-mapped-fields .input-text:focus {
    border-color: var(--optinperks-brand-focus) !important;
    box-shadow: 0 0 0 2px rgba(0,115,170,0.2) !important;
    outline: none !important;
}

/* Checkout page specific styling for newsletter options */
body.woocommerce-checkout .optinperks-newsletter-optin-wrap {
    margin: 10px 0;
    padding: 10px;
    background: var(--optinperks-bg-secondary);
    border: 1px solid var(--optinperks-color-gray-300);
    border-radius: 8px;
    clear: both;
    position: relative;
    z-index: 10;
}

/* Reduce spacing between all form rows in OptinPerks checkout sections */
body.woocommerce-checkout .optinperks-newsletter-optin-wrap .form-row {
    margin-bottom: 8px !important;
}

body.woocommerce-checkout .optinperks-newsletter-optin-wrap .form-row:last-child {
    margin-bottom: 0 !important;
}

/* Override WooCommerce payment form-row padding - reduce top/bottom, keep left/right */
.woocommerce-checkout #payment div.form-row {
    padding: 0.2em 1em !important; /* Reduced top/bottom padding from 1em to 0.3em, kept 1em left/right */
}

/* Override WooCommerce payment form-row padding - reduce top/bottom, keep left/right */
.woocommerce-checkout #payment div.form-row.place-order {
    padding: 1em !important; /* Reduced top/bottom padding from 1em to 0.3em, kept 1em left/right */
}

/* Ensure newsletter options appear above other elements */
body.woocommerce-checkout .optinperks-newsletter-optin-wrap {
    order: -1; /* Move to top if using flexbox */
}

/* Force positioning above the place order button */
body.woocommerce-checkout .woocommerce-checkout-payment {
    margin-top: 10px;
}

body.woocommerce-checkout .optinperks-newsletter-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 8px; /* Standardized gap between checkbox and text */
    font-weight: 500;
    color: #333;
    cursor: pointer;
}

body.woocommerce-checkout .optinperks-newsletter-checkbox-label input[type="checkbox"] {
    margin: 0;
    flex-shrink: 0;
    margin-top: 2px;
}

body.woocommerce-checkout .optinperks-terms-checkbox-wrap {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #dee2e6;
}

body.woocommerce-checkout .optinperks-terms-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 8px; /* Standardized gap between checkbox and text */
    font-weight: 500;
    color: #333;
    cursor: pointer;
}

body.woocommerce-checkout .optinperks-terms-checkbox-label input[type="checkbox"] {
    margin: 0;
    flex-shrink: 0;
    margin-top: 2px;
}

/* Free Resource Notification Styles for Checkout */
.optinperks-free-resource-notification-wrap {
    margin: 10px 0;
    padding: 10px;
    background: #e8f5e8;
    border: 1px solid #c3e6c3;
    border-radius: 8px;
    clear: both;
    position: relative;
    z-index: 10;
}

/* Make the blue resource notification box full width */
.optinperks-free-resource-item {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    /* Additional styles merged from duplicate */
    color: #155724;
    font-size: 14px;
    font-weight: 700;
}

.optinperks-free-resource-notification {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.optinperks-free-resource-icon {
    background: #28a745 !important;
    color: white !important;
    border-radius: 50%;
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: bold !important;
    flex-shrink: 0;
    margin-top: 2px;
}

.optinperks-free-resource-content {
    flex: 1;
}

.optinperks-free-resource-title {
    font-weight: 600;
    color: #155724;
    margin-bottom: 8px;
    font-size: 16px;
}

.optinperks-free-resource-email {
    color: var(--optinperks-color-gray-600);
    font-size: 14px;
    margin-bottom: 8px;
}


.optinperks-free-resource-list {
    margin: 4px 0 0 0;
    padding-left: 3px;
    color: #155724;
    font-size: 14px;
}

.optinperks-free-resource-list li,
.optinperks-free-resource-list .optinperks-free-resource-item {
    margin-bottom: 4px;
    font-weight: 500;
    display: block;
}

/* Checkout page specific styling for free resource notification */
body.woocommerce-checkout .optinperks-free-resource-notification-wrap {
    order: -1; /* Move to top if using flexbox */
}

body.woocommerce-checkout .optinperks-free-resource-notification-wrap::before {
    content: "";
    display: block;
    height: 0px;
    background: #c3e6c3;
    margin: -10px -10px 10px -10px;
}

/* Registration page specific styling for free resource notification */
body.woocommerce-account .optinperks-free-resource-notification-wrap,
body.register .optinperks-free-resource-notification-wrap {
    margin: 15px 0;
    order: -1; /* Move to top if using flexbox */
}

body.woocommerce-account .optinperks-free-resource-notification-wrap::before,
body.register .optinperks-free-resource-notification-wrap::before {
    content: "";
    display: block;
    height:0px;
    background: #c3e6c3;
    margin: -10px -10px 10px -10px;
}

/* WordPress Registration Form Free Resource Styling - Generic targeting - merged with base styles above */

.optinperks-free-resource-notification-wrap::before {
    content: "" !important;
    display: block !important;
    height: 0px !important;
    background: #c3e6c3 !important;
    margin: -15px -15px 15px -15px !important;
}

/* Enhanced free resource styling for WordPress registration forms - Generic targeting */
.optinperks-free-resource-notification-wrap .optinperks-free-resource-enhanced {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border: none !important;
    padding: 15px !important;
    margin: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 3px 10px rgba(102, 126, 234, 0.3) !important;
    color: white !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3) !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    overflow: hidden !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.optinperks-free-resource-icon-enhanced {
    background: linear-gradient(45deg, #ff6b6b, #ffd93d) !important;
    color: white !important;
    border-radius: 50% !important;
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: bold !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
    box-shadow: 0 2px 8px rgba(255, 107, 107, 0.4) !important;
    animation: pulse 2s infinite !important;
}

.optinperks-free-resource-content-enhanced {
    flex: 1 !important;
}

.optinperks-free-resource-title-enhanced {
    font-weight: bold !important;
    font-size: 18px !important;
    }

.optinperks-free-resource-description {
    font-size: 14px !important;
}

.optinperks-resource-highlight {
    color: #ffd93d !important;
    font-size: 16px !important; 
}

/* Resource status message styles */
.optinperks-resource-status-message {
    margin-top: 8px;
    padding: 8px 12px;
    background: rgba(255, 193, 7, 0.1);
    border: 1px solid rgba(255, 193, 7, 0.3);
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.optinperks-status-icon {
    font-size: 16px;
    flex-shrink: 0;
}

.optinperks-status-text {
    color: #856404;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
}

/* Access Restricted Box Styles */
.optinperks-access-restricted-box {
    margin: 20px 0;
    padding: 20px;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    text-align: center;
}

.optinperks-access-restricted-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.optinperks-access-restricted-icon {
    font-size: 48px;
    flex-shrink: 0;
}

.optinperks-access-restricted-text h3 {
    color: #721c24;
    margin: 0 0 10px 0;
    font-size: 1.4em;
    font-weight: 600;
}

.optinperks-access-restricted-message {
    color: #721c24;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}

/* Responsive adjustments for Access Restricted Box */
@media (max-width: 768px) {
    .optinperks-access-restricted-content {
        flex-direction: column;
        text-align: center;
    }
    
    .optinperks-access-restricted-icon {
        font-size: 36px;
    }
    
    .optinperks-access-restricted-text h3 {
        font-size: 1.2em;
    }
}

/* Additional styles for info icon to ensure visibility - merged with base styles above */

/* Ensure the info icon is visible in all contexts */
.optinperks-free-resource-info .optinperks-free-resource-icon {
    background: linear-gradient(45deg, #ff6b6b, #ffd93d) !important;
    color: white !important;
    border-radius: 50%;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    font-weight: bold !important;
    margin-right: 15px !important;
    flex-shrink: 0 !important;
    box-shadow: 0 3px 10px rgba(255, 107, 107, 0.4) !important;
}

/* Pulse animation for the gift icon */
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 3px 10px rgba(255, 107, 107, 0.4);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 5px 15px rgba(255, 107, 107, 0.6);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 3px 10px rgba(255, 107, 107, 0.4);
    }
}

/* Enhanced styling for the new eye-catching design */
.optinperks-free-resource-info-wrap {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border: none !important;
    padding: 20px !important;
    margin: 15px 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Enhanced free resource styling for checkout - contained within notification wrapper */
.optinperks-free-resource-notification-wrap .optinperks-free-resource-enhanced {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    padding: 15px;
    margin: 0;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(102, 126, 234, 0.3);
    color: white;
    font-size: 14px;
    font-weight: 500;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    max-width: 100%;
    box-sizing: border-box;
}






.optinperks-free-resource-decoration-top {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.1);
    border-radius: 50%;
    z-index: 1;
}

.optinperks-free-resource-decoration-bottom {
    position: absolute;
    bottom: -15px;
    left: -15px;
    width: 50px;
    height: 50px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
    z-index: 1;
}

.optinperks-free-resource-info {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    z-index: 2 !important;
}

.optinperks-free-resource-text {
    color: white !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3) !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .optinperks-free-resource-notification {
        flex-direction: column;
        gap: 8px;
    }
    
    .optinperks-free-resource-icon {
        align-self: flex-start;
    }
    
    .optinperks-free-resource-title {
        font-size: 15px;
    }
    
    .optinperks-free-resource-email,
    .optinperks-free-resource-item {
        font-size: 13px;
    }
}

/* Checkout page specific styling for mapped fields */
body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields {
    max-width: 100%; /* Constrain the overall width */
    margin: 15px 0 0 0; /* Add top margin and remove centering for natural alignment */
}

body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields .form-row {
    max-width: 100%; /* Ensure fields don't exceed container */
    width: 100%; /* Full width within the constrained container */
    margin-bottom: 8px !important; /* Reduce large gaps between checkout form fields */
}

body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields .form-row:last-child {
    margin-bottom: 0 !important; /* No margin on the last field */
}

body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields .input-text {
    max-width: 100%; /* Prevent inputs from overflowing */
    width: 100%; /* Full width within their container */
    box-sizing: border-box; /* Include padding and borders in width calculation */
}

/* Alternative: If you prefer half-width fields, use this instead */
/*
body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields .form-row {
    display: inline-block;
    width: 48%;
    margin-right: 2%;
    vertical-align: top;
}

body.woocommerce-checkout .optinperks-newsletter-optin-wrap .optinperks-mapped-fields .form-row:nth-child(even) {
    margin-right: 0;
}
*/

/* Disabled field styles to prevent form validation issues */
.optinperks-mapped-fields input:disabled,
.optinperks-mapped-fields select:disabled {
    background-color: var(--optinperks-input-disabled-bg);
    border-color: var(--optinperks-input-disabled-border);
    color: var(--optinperks-input-disabled-text);
    cursor: not-allowed;
    opacity: 0.6;
}

.optinperks-mapped-fields input:disabled:focus,
.optinperks-mapped-fields select:disabled:focus {
    border-color: var(--optinperks-input-disabled-border);
    box-shadow: none;
    outline: none;
}

/* Add padding between mapped fields and Register button on registration form */
.woocommerce-form-register .optinperks-mapped-fields {
    margin-bottom: var(--optinperks-spacing-lg);
}

/* No connection message styles */
.optinperks-no-connection-message {
    text-align: center;
    padding: var(--optinperks-spacing-xl) var(--optinperks-spacing-lg);
    background: var(--optinperks-bg-secondary);
    border: 1px solid var(--optinperks-color-gray-300);
    border-radius: var(--optinperks-border-radius-lg);
    margin: var(--optinperks-spacing-lg) 0;
}

.optinperks-connection-status h3 {
    color: var(--optinperks-color-gray-600);
    margin-bottom: var(--optinperks-spacing-md);
    font-size: var(--optinperks-font-size-h2);
}

.optinperks-status-icon {
    color: var(--optinperks-color-warning);
    margin-bottom: var(--optinperks-spacing-md);
    /* Additional styles for subscription status */
    display: block;
    font-size: 48px;
}

.optinperks-no-connection-message p {
    color: var(--optinperks-color-gray-600);
    margin-bottom: 10px;
    line-height: 1.5;
}

.optinperks-no-connection-message p:last-child {
    margin-bottom: 0;
    font-size: 0.9em;
    font-style: italic;
}

/* ======================================== */
/* FRESH START - NEW FORM STYLING */
/* ======================================== */

/* Form rows with proper spacing */
.optinperks-form .form-row {
    margin-bottom: 8px;
}

.optinperks-form .form-row:last-child {
    margin-bottom: 0;
}



/* Labels */
.optinperks-form label {
    display: block;
    margin-bottom: 4px;
    font-weight: 600;
    color: #333;
    font-size: 14px;
}

/* Input fields */
.optinperks-form .input-text {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: var(--optinperks-border-radius);
    font-size: 14px;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
}

.optinperks-form .input-text:focus {
    border-color: var(--optinperks-brand-focus);
    box-shadow: 0 0 0 2px rgba(0,115,170,0.2);
    outline: none;
}

/* Submit button - clean and simple */
.optinperks-form button[type="submit"] {
    width: 100%;
    padding: 12px 20px;
    background-color: #0073aa;
    color: var(--optinperks-color-white);
    border: 1px solid #0073aa;
    border-radius: var(--optinperks-border-radius);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    box-sizing: border-box;
    margin: var(--optinperks-spacing-lg) 0 0 0;
}

/* Ensure button has space for focus shadow */
.optinperks-form button[type="submit"]:focus {
    background-color: var(--optinperks-brand-focus);
    border-color: var(--optinperks-brand-focus);
    box-shadow: var(--optinperks-focus-shadow);
    outline: none;
    /* Ensure shadow has space to render */
    position: relative;
    z-index: 1;
}

.optinperks-form button[type="submit"]:hover {
    background-color: var(--optinperks-brand-hover);
    border-color: var(--optinperks-brand-hover);
}

.optinperks-form button[type="submit"]:focus {
    background-color: var(--optinperks-brand-focus);
    border-color: var(--optinperks-brand-focus);
    box-shadow: var(--optinperks-focus-shadow);
}

/* ======================================== */
/* BUTTON COLOR HIERARCHY SYSTEM */
/* ======================================== */


/* Custom button class - applies when colors are set */
.optinperks-form button[type="submit"].optinperks-custom-button {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
}

.optinperks-form button[type="submit"].optinperks-custom-button:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color)) !important;
    border: 1px solid var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color)) !important;
}

.optinperks-form button[type="submit"].optinperks-custom-button:focus {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    box-shadow: 0 0 0 2px rgba(0,115,170,0.2);
    outline: none;
    /* Ensure shadow has space to render */
    position: relative !important;
    z-index: 1 !important;
}

/* Override theme styles with maximum specificity */
.optinperks-form button[type="submit"].optinperks-custom-button {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    width: 100% !important;
    cursor: pointer !important;
    padding: 12px 20px !important;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
}

/* Additional specificity for buttons with inline styles */
.optinperks-form[style*="--optinperks-button-bg-color"] button[type="submit"].optinperks-custom-button {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
}

/* Hover state for buttons with inline styles */
.optinperks-form[style*="--optinperks-button-bg-color"] button[type="submit"].optinperks-custom-button:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color)) !important;
    border: 1px solid var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color)) !important;
}

/* Focus state for buttons with inline styles */
.optinperks-form[style*="--optinperks-button-bg-color"] button[type="submit"].optinperks-custom-button:focus {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
}

/* Maximum specificity override for theme styles */
body .optinperks-form button[type="submit"].optinperks-custom-button,
html body .optinperks-form button[type="submit"].optinperks-custom-button {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    width: 100% !important;
    cursor: pointer !important;
    padding: 12px 20px !important;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
}

/* Nuclear option - maximum specificity for theme override */
html body .optinperks-form button[type="submit"].optinperks-custom-button,
html body .optinperks-form button[type="submit"].optinperks-custom-button:hover,
html body .optinperks-form button[type="submit"].optinperks-custom-button:focus,
html body .optinperks-form button[type="submit"].optinperks-custom-button:active {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    width: 100% !important;
    cursor: pointer !important;
    padding: 12px 20px !important;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
}

/* Hover state with nuclear specificity */
html body .optinperks-form button[type="submit"].optinperks-custom-button:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color)) !important;
    border: 1px solid var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color)) !important;
}

/* Ensure form spacing works correctly */
.optinperks-form .form-row {
    margin-bottom: 8px !important;
    display: block !important;
}

.optinperks-form .form-row:last-child {
    margin-bottom: 0 !important;
}

/* Ensure labels are properly styled */
.optinperks-form label {
    display: block !important;
    margin-bottom: 4px !important;
    font-weight: 600 !important;
    color: #333 !important;
    font-size: 14px !important;
}

/* Ensure input fields are properly styled */
.optinperks-form .input-text {
    width: 100% !important;
    padding: 10px 12px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease;
}

.optinperks-form .input-text:focus {
    border-color: var(--optinperks-brand-focus) !important;
    box-shadow: 0 0 0 2px rgba(0,115,170,0.2) !important;
    outline: none !important;
}

/* Ensure buttons are properly sized and centered */
.optinperks-form button[type="submit"] {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
}


/* Focus state for buttons with inline styles */
.optinperks-form[style*="--optinperks-button-bg-color"] button[type="submit"].optinperks-custom-button:focus {
    background-color: var(--optinperks-button-bg-color) !important;
    background-image: none !important;
    background-size: auto !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    box-shadow: 0 0 0 2px rgba(0,115,170,0.2) !important;
    outline: none !important;
    /* Ensure shadow has space to render */
    position: relative !important;
    z-index: 1 !important;
}

/* ======================================== */
/* UNSUBSCRIBE BUTTON STYLES */
/* ======================================== */

/* Already subscribed interface */
.optinperks-already-subscribed,
.optinperks-subscribed-interface {
    text-align: center;
    padding: 20px;
    background: var(--optinperks-bg-secondary);
    border: 1px solid var(--optinperks-color-gray-300);
    border-radius: 8px;
    margin: 0;
    /* Add overflow protection for small containers */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    max-width: 100%;
    box-sizing: border-box;
}

.optinperks-subscription-status {
    margin-bottom: 25px;
}

/* Specific styling for subscription status icon */
.optinperks-subscription-status .optinperks-status-icon {
    color: #28a745;
    font-size: 48px;
}

.optinperks-subscription-status h3 {
    color: #28a745;
    margin-bottom: 10px;
    font-size: 1.4em;
    /* Add overflow protection for small containers */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    line-height: 1.4;
}

.optinperks-subscription-status p {
    color: var(--optinperks-color-gray-600);
    margin-bottom: 0;
    font-size: 1.1em;
    /* Add overflow protection for small containers */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    line-height: 1.4;
}

.optinperks-unsubscribe-section p {
    color: var(--optinperks-color-gray-600);
    margin: 15px 0;
    font-size: 1em;
    /* Add overflow protection for small containers */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    line-height: 1.4;
}

/* Resource access section */
.optinperks-resource-access-section {
    margin: 0;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
}

.optinperks-resource-access-section .optinperks-form-actions {
    margin: 0;
}

/* Full width button styling for resource interface only */
.optinperks-subscribed-interface .optinperks-resource-access-section .optinperks-form button[type="submit"],
.optinperks-subscribed-interface .optinperks-resource-access-section .optinperks-access-resources-button {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 0 0 !important;
}

/* Resource access button styles */
.optinperks-access-resources-button {
    background: var(--optinperks-brand-link);
    border: 1px solid var(--optinperks-brand-link);
    color: var(--optinperks-color-white);
    padding: 12px 24px;
    border-radius: var(--optinperks-border-radius);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    text-decoration: none;
    display: inline-block;
    line-height: 1.4;
    /* Add overflow protection for small containers */
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 44px; /* Ensure minimum touch target size */
}

.optinperks-access-resources-button:hover {
    background: var(--optinperks-brand-link-hover);
    border-color: var(--optinperks-brand-link-hover);
    color: var(--optinperks-color-white);
    text-decoration: none;
}

.optinperks-access-resources-button:focus {
    background: var(--optinperks-brand-link);
    border-color: var(--optinperks-brand-link);
    color: var(--optinperks-color-white);
    outline: none;
    box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.2);
}

.optinperks-access-resources-button:disabled {
    background: #ccc;
    border-color: #ccc;
    color: #666;
    cursor: not-allowed;
}

/* Custom button color support for resource access button */
.optinperks-form[style*="--optinperks-button-bg-color"] .optinperks-access-resources-button {
    background: var(--optinperks-button-bg-color, #007cba) !important;
    border-color: var(--optinperks-button-border-color, #007cba) !important;
    color: var(--optinperks-button-text-color, #fff) !important;
}

.optinperks-form[style*="--optinperks-button-bg-color"] .optinperks-access-resources-button:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color, #007cba)) !important;
    border-color: var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color, #007cba)) !important;
    color: var(--optinperks-button-text-color, #fff) !important;
}

.optinperks-form[style*="--optinperks-button-bg-color"] .optinperks-access-resources-button:focus {
    background: var(--optinperks-button-bg-color, #007cba) !important;
    border-color: var(--optinperks-button-border-color, #007cba) !important;
    color: var(--optinperks-button-text-color, #fff) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.2) !important;
}

/* Unsubscribe button base styles */
.optinperks-unsubscribe-button {
    background: #dc3545;
    border: 1px solid #dc3545;
    color: var(--optinperks-color-white);
    padding: 12px 24px;
    border-radius: var(--optinperks-border-radius);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
    text-decoration: none;
    display: inline-block;
    line-height: 1.4;
    /* Add overflow protection for small containers */
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    hyphens: none;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 44px; /* Ensure minimum touch target size */
}

.optinperks-unsubscribe-button:hover {
    background: #c82333;
    color: var(--optinperks-color-white);
    text-decoration: none;
    border: 1px solid #c82333;
}

.optinperks-unsubscribe-button:focus {
    background: #dc3545;
    border-color: #dc3545;
    color: var(--optinperks-color-white);
    outline: none;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.2);
    /* Ensure shadow has space to render */
    position: relative;
    z-index: 1;
}

/* Custom unsubscribe button color support - inherit from parent container */
.optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border-color: var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

.optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:hover {
    background: var(--optinperks-unsubscribe-button-bg-color-hover, var(--optinperks-unsubscribe-button-bg-color, #dc3545)) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color-hover, var(--optinperks-unsubscribe-button-border-color, #dc3545)) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

.optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:focus {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.2) !important;
}

/* Custom unsubscribe button color support - direct class approach */
.optinperks-unsubscribe-button.optinperks-custom-button {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

.optinperks-unsubscribe-button.optinperks-custom-button:hover {
    background: var(--optinperks-unsubscribe-button-bg-color-hover, var(--optinperks-unsubscribe-button-bg-color, #dc3545)) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color-hover, var(--optinperks-unsubscribe-button-border-color, #dc3545)) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

.optinperks-unsubscribe-button.optinperks-custom-button:focus {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.2) !important;
    /* Ensure shadow has space to render */
    position: relative !important;
    z-index: 1 !important;
}

/* Maximum specificity override for theme styles */
body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button,
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

/* Nuclear option - maximum specificity for stubborn themes */
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button,
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:hover,
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:focus,
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:active {
    background: var(--optinperks-unsubscribe-button-bg-color, #dc3545) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color, #dc3545) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

/* Styles for the new subscription form after unsubscribe */
.optinperks-subscription-form {
    padding: 20px;
    background: #f9f9f9;
    border-radius: 8px;
    border: 1px solid #ddd;
}

.optinperks-subscription-form .form-row {
    margin-bottom: 8px;
}

.optinperks-subscription-form .input-text {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: var(--optinperks-border-radius);
    font-size: 16px;
    box-sizing: border-box;
}

.optinperks-subscription-form .optinperks-subscribe-button {
    width: 100%;
    padding: 12px 20px;
    background: #0073aa;
    color: var(--optinperks-color-white);
    border: 1px solid #0073aa;
    border-radius: var(--optinperks-border-radius);
    font-size: 16px;
    cursor: pointer;
    transition: background-color var(--optinperks-transition-slow), border-color var(--optinperks-transition-slow), box-shadow var(--optinperks-transition);
}

.optinperks-subscription-form .optinperks-subscribe-button:hover {
    background: #005a87;
    border-color: #005a87;
}

.optinperks-subscription-form .optinperks-subscribe-button:disabled {
    background: #ccc;
    border-color: #ccc;
    cursor: not-allowed;
}

/* Hover state with nuclear specificity */
html body .optinperks-form[style*="--optinperks-unsubscribe-button-bg-color"] .optinperks-unsubscribe-button:hover {
    background: var(--optinperks-unsubscribe-button-bg-color-hover, var(--optinperks-unsubscribe-button-bg-color, #dc3545)) !important;
    border: 1px solid var(--optinperks-unsubscribe-button-border-color-hover, var(--optinperks-unsubscribe-button-border-color, #dc3545)) !important;
    color: var(--optinperks-unsubscribe-button-text-color, #fff) !important;
}

/* Fallback: If variables are only on button, ensure they work */
.optinperks-form button[type="submit"].optinperks-custom-button {
    /* These will inherit from the button's style attribute */
    background: var(--optinperks-button-bg-color, inherit) !important;
    border: 1px solid var(--optinperks-button-border-color, inherit) !important;
    color: var(--optinperks-button-text-color, inherit) !important;
}

/* EXPLICIT OVERRIDE - Force background properties to override theme */
.optinperks-form button[type="submit"].optinperks-custom-button {
    background-image: none !important;
    background-size: auto !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
}

/* FINAL NUCLEAR OPTION - Target any button with our class and variables */
button.optinperks-custom-button[style*="--optinperks-button-bg-color"] {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    background-image: none !important;
    background-size: auto !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
}

button.optinperks-custom-button[style*="--optinperks-button-bg-color"]:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color)) !important;
    border: 1px solid var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color)) !important;
    color: var(--optinperks-button-text-color, #fff) !important;
}

/* ULTIMATE NUCLEAR - Target the exact HTML structure from debug output */
.optinperks-form button[type="submit"].optinperks-custom-button[style*="--optinperks-button-bg-color"] {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    background-image: none !important;
    background-size: auto !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
}

.optinperks-form button[type="submit"].optinperks-custom-button[style*="--optinperks-button-bg-color"]:hover {
    background: var(--optinperks-button-bg-color-hover, var(--optinperks-button-bg-color)) !important;
    border: 1px solid var(--optinperks-button-border-color-hover, var(--optinperks-button-border-color)) !important;
    color: var(--optinperks-button-text-color, #fff) !important;
}

/* MAXIMUM SPECIFICITY - Use !important on every single property */
html body .optinperks-form button[type="submit"].optinperks-custom-button[style*="--optinperks-button-bg-color"] {
    background: var(--optinperks-button-bg-color) !important;
    border: 1px solid var(--optinperks-button-border-color) !important;
    color: var(--optinperks-button-text-color) !important;
    background-image: none !important;
    background-size: auto !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
    width: 100% !important;
    cursor: pointer !important;
    padding: 12px 20px !important;
    transition: background-color 0.3s ease, border-color 0.3s ease !important;
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-sizing: border-box !important;
    margin: 20px 0 0 0 !important;
}

/* Locked email field styles for logged-in users */
.optinperks-newsletter-form .optinperks-email-locked {
    background-color: var(--optinperks-input-disabled-bg);
    border-color: var(--optinperks-input-disabled-border);
    color: var(--optinperks-input-disabled-text);
    cursor: not-allowed;
}

.optinperks-email-note {
    display: block;
    margin-top: 5px;
    color: var(--optinperks-color-gray-600);
    font-style: italic;
    font-size: 0.875em;
}

/* JavaScript Challenge styling for frontend forms */
.optinperks-js-challenge {
    margin: 15px 0;
    padding: 15px;
    background: var(--optinperks-bg-secondary);
    border: 1px solid var(--optinperks-color-gray-300);
    border-radius: 6px;
    border-left: 4px solid #007cba;
}

.optinperks-js-challenge input {
    background: #fff !important;
}

/*WooCommerce Registration Form*/
.woocommerce-form-register {
    height: unset !important;
}

/* Contact info field styles - ensure they are completely hidden */
.optinperks-contact-info {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
    visibility: hidden !important;
    display: none !important;
}

/* Ensure contact info fields are hidden in all contexts */
input.optinperks-contact-info,
select.optinperks-contact-info,
textarea.optinperks-contact-info {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
    visibility: hidden !important;
    display: none !important;
}

/* Additional contact info hiding - target any field with contact-info in name or class */
input[name*="contact-info"],
input[class*="contact-info"],
input[id*="contact-info"],
select[name*="contact-info"],
select[class*="contact-info"],
select[id*="contact-info"],
textarea[name*="contact-info"],
textarea[class*="contact-info"],
textarea[id*="contact-info"] {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
    visibility: hidden !important;
    display: none !important;
}

/* JavaScript Challenge styling for registration forms */
.woocommerce-form-register .optinperks-js-challenge {
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 15px;
    background: var(--optinperks-bg-secondary);
    border: 1px solid var(--optinperks-color-gray-300);
    border-radius: 6px;
    border-left: 4px solid #007cba;
}

.optinperks-challenge-label {
    display: block;
    margin-bottom: 10px;
    font-weight: 600;
    color: #495057;
    font-size: 14px;
}

.optinperks-challenge-question {
    font-weight: bold;
    color: #007cba;
    background: var(--optinperks-bg-primary);
    padding: 6px 10px;
    border-radius: var(--optinperks-border-radius);
    border: 1px solid var(--optinperks-color-gray-300);
    margin-left: 8px;
    font-size: 16px;
}

.optinperks-challenge-input {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid #ced4da;
    border-radius: 6px;
    font-size: 16px;
    transition: all 0.2s ease;
    margin-top: 10px;
}

.optinperks-challenge-input:focus {
    outline: none;
    border-color: #007cba;
    box-shadow: 0 0 0 3px rgba(0, 124, 186, 0.15);
}

.optinperks-challenge-input:invalid {
    border-color: #dc3545;
}

.optinperks-challenge-input:valid {
    border-color: #28a745;
}

/* Autocomplete field validation */
.optinperks-autocomplete.optinperks-autocomplete-invalid {
    border-color: var(--optinperks-validation-error-border) !important;
    box-shadow: 0 0 0 1px var(--optinperks-validation-error-border) !important;
}


.optinperks-autocomplete:focus {
    border-color: var(--optinperks-brand-focus) !important;
    box-shadow: 0 0 0 1px var(--optinperks-brand-focus) !important;
}

.optinperks-newsletter-checkbox-label,
.optinperks-terms-checkbox-label,
.optinperks-subscription-checkbox-label {
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
}

.optinperks-newsletter-checkbox-label input[type="checkbox"], 
.optinperks-terms-checkbox-label input[type="checkbox"],
.optinperks-subscription-checkbox-label input[type="checkbox"] {
    margin: 0;
    margin-right: 8px; /* Standardized gap between checkbox and text */
    flex-shrink: 0;
    margin-top: 2px;
}

/* WooCommerce checkout checkbox styling */
.woocommerce-form__label-for-checkbox {
    display: flex;
    align-items: flex-start;
}

.woocommerce-form__label-for-checkbox input[type="checkbox"] {
    margin: 0;
    margin-right: 8px; /* Standardized gap between checkbox and text */
    flex-shrink: 0;
    margin-top: 2px;
}

/* Checkout terms checkbox styling */
.optinperks-terms-checkbox label {
    display: flex;
    align-items: flex-start;
}

.optinperks-terms-checkbox label input[type="checkbox"] {
    margin: 0;
    margin-right: 8px; /* Standardized gap between checkbox and text */
    flex-shrink: 0;
    margin-top: 2px;
}

/* Standalone forms checkbox spacing */
.optinperks-standalone-form label {
    display: flex;
    align-items: flex-start;
}

.optinperks-standalone-form label input[type="checkbox"] {
    margin: 0;
    margin-right: 8px; /* Standardized gap between checkbox and text */
    flex-shrink: 0;
    margin-top: 2px;
}

/* Form Messages - Frontend forms */
.optinperks-form-messages {
    display: none;
    margin-top: 20px;
}

.optinperks-form-messages.visible {
    display: block;
}

.optinperks-success-message {
    background: var(--optinperks-bg-success);
    border: 1px solid var(--optinperks-border-success);
    color: var(--optinperks-text-success);
    padding: 20px;
    border-radius: var(--optinperks-border-radius);
    margin: 0 !important
}

.optinperks-unsubscribe-section .optinperks-success-message, .optinperks-unsubscribe-section .optinperks-error-message {
    margin-top: 20px !important;
}

/* Specific styling for unsubscribe success messages only */
.optinperks-unsubscribe-section .optinperks-success-message,
.optinperks-success-message.optinperks-unsubscribe-success {
    background: #6c757d !important;
    border: 1px solid #5a6268 !important;
    color: #ffffff !important;
}

.optinperks-success-message.optinperks-unsubscribe-success .success-countdown {
    color: #e9ecef !important;
}

/* ======================================== */
/* WOOCOMMERCE NOTICE RESTYLING */
/* ======================================== */

/* Restyle WooCommerce error notices to match our custom validation styling */
.woocommerce-error,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-error {
    background: var(--optinperks-validation-error-bg) !important;
    border: 1px solid var(--optinperks-validation-error-border) !important;
    border-left: 4px solid var(--optinperks-validation-error-border) !important;
    border-radius: 4px !important;
    color: var(--optinperks-validation-error-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    padding: 12px 15px !important;
    animation: optinperks-error-shake var(--optinperks-duration-slow) var(--optinperks-ease-in-out) !important;
    box-shadow: 0 2px 4px var(--optinperks-validation-error-shadow) !important;
}

/* Restyle WooCommerce success notices */
.woocommerce-message,
.woocommerce .woocommerce-message,
.woocommerce-page .woocommerce-message {
    background: #d4edda !important;
    border: 1px solid #c3e6cb !important;
    border-left: 4px solid #28a745 !important;
    border-radius: 4px !important;
    color: #155724 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    padding: 12px 15px !important;
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.1) !important;
}

/* Restyle WooCommerce info notices */
.woocommerce-info,
.woocommerce .woocommerce-info,
.woocommerce-page .woocommerce-info {
    background: #e7f3ff !important;
    border: 1px solid #b3d9ff !important;
    border-left: 4px solid #0073aa !important;
    border-radius: 4px !important;
    color: #0073aa !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    padding: 12px 15px !important;
    box-shadow: 0 2px 4px rgba(0, 115, 170, 0.1) !important;
}

/* Remove default WooCommerce notice icons and styling */
.woocommerce-error::before,
.woocommerce-message::before,
.woocommerce-info::before {
    display: none !important;
}

/* Ensure proper spacing for notice lists */
.woocommerce-error ul,
.woocommerce-message ul,
.woocommerce-info ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.woocommerce-error li,
.woocommerce-message li,
.woocommerce-info li {
    margin: 0 !important;
    padding: 0 !important;
}

/* Specific styling for OptinPerks-related WooCommerce notices */
.woocommerce-error[class*="optinperks"],
.woocommerce-error[class*="subscription"],
.woocommerce-error[class*="consent"],
.woocommerce-error[class*="terms"] {
    border-left-width: 6px !important;
    font-weight: 700 !important;
}

/* Add subtle hover effect for better UX */
.woocommerce-error:hover,
.woocommerce-message:hover,
.woocommerce-info:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s ease !important;
}

/* Responsive adjustments for mobile */
@media (max-width: 768px) {
    .woocommerce-error,
    .woocommerce-message,
    .woocommerce-info {
        font-size: 13px !important;
        padding: 10px 12px !important;
        margin-bottom: 12px !important;
    }
}

.optinperks-error-message {
    background: var(--optinperks-bg-error);
    border: 1px solid var(--optinperks-border-error);
    color: var(--optinperks-text-error);
    padding: 10px 15px;
    border-radius: var(--optinperks-border-radius);
    margin: 0 !important
}

/* ===========================
   Confirmation Modal Styles
   =========================== */

.optinperks-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.5) !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.optinperks-modal-overlay.show {
    opacity: 1;
    visibility: visible;
}

.optinperks-modal-content {
    background: white !important;
    border-radius: 8px !important;
    max-width: 500px !important;
    width: 90% !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
    transform: translateY(-20px) scale(0.95);
    transition: transform 0.3s ease;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: inherit !important;
}

.optinperks-modal-overlay.show .optinperks-modal-content {
    transform: translateY(0) scale(1);
}

.optinperks-modal-header {
    padding: 30px 30px 20px;
    text-align: center;
    position: relative;
}

.optinperks-modal-header .optinperks-success-icon {
    font-size: 48px;
    margin-bottom: 15px;
    display: block;
}

.optinperks-modal-header h2 {
    color: #28a745;
    margin: 0 0 10px 0;
    font-size: 24px;
    font-weight: 600;
}

.optinperks-modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.optinperks-modal-close:hover {
    background-color: #f5f5f5;
    color: #333;
}

.optinperks-modal-body {
    padding: 20px 30px;
    text-align: center;
}

.optinperks-modal-body p {
    margin: 0 0 20px 0;
    color: #666;
    font-size: 16px;
    line-height: 1.5;
}

.optinperks-confirmed-email {
    background: var(--optinperks-bg-secondary);
    padding: 12px 15px;
    border-radius: 6px;
    margin: 15px 0;
    font-family: monospace;
    font-size: 14px;
    color: #495057;
    border-left: 4px solid #28a745;
    border-right: 4px solid #28a745;
}

.optinperks-modal-footer {
    padding: 20px 30px 20px;
    text-align: center;
    border-top: none;
}

.optinperks-modal-btn {
    background: #007cba;
    color: white;
    border: 1px solid #007cba;
    padding: 12px 24px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.2s ease, border-color 0.2s ease;
    min-width: 120px;
}

.optinperks-modal-btn:hover {
    background: #005a87;
    border-color: #005a87;
}

.optinperks-modal-btn-primary {
    background: #28a745;
    border-color: #28a745;
}

.optinperks-modal-btn-primary:hover {
    background: #218838;
    border-color: #218838;
}

/* Processing modal variant */
.optinperks-modal-content.optinperks-processing {
    max-width: 400px;
}

.optinperks-modal-content.optinperks-processing .optinperks-modal-body {
    padding: 40px 30px;
}

.optinperks-modal-content.optinperks-processing .optinperks-success-icon {
    font-size: 60px;
    color: #28a745;
    margin-bottom: 20px;
    display: block;
}

.optinperks-modal-content.optinperks-processing h2 {
    color: #28a745;
    margin: 0 0 15px 0;
    font-size: 24px;
}

.optinperks-modal-content.optinperks-processing p {
    margin: 0 0 20px 0;
    color: #666;
    font-size: 16px;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .optinperks-modal-content {
        width: 95%;
        margin: 20px;
    }
    
    .optinperks-modal-header,
    .optinperks-modal-body,
    .optinperks-modal-footer {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .optinperks-modal-header {
        padding-top: 25px;
        padding-bottom: 15px;
    }
    
    .optinperks-modal-header h2 {
        font-size: 20px;
    }
    
    .optinperks-modal-header .optinperks-success-icon {
        font-size: 40px;
        margin-bottom: 10px;
    }
}

.login form .input, .login input[type="password"], .login input[type="text"] {
    margin-bottom: 6px;
}

/* =============================================================================
   Context-Aware Subscription UI Styles
   ============================================================================= */

/* Alert styles for different subscription states */
.optinperks-alert {
    padding: 12px 16px;
    border-radius: 4px;
    margin-bottom: 16px;
    border: 1px solid;
    position: relative;
    font-size: 14px;
    line-height: 1.4;
}

.optinperks-alert strong {
    font-weight: 600;
    display: block;
    margin-bottom: 4px;
}

.optinperks-alert small {
    font-size: 12px;
    opacity: 0.9;
}

.optinperks-alert.optinperks-alert-success {
    background-color: #f0f9ff;
    border-color: #0ea5e9;
    color: #0c4a6e;
}

.optinperks-alert.optinperks-alert-success::before {
    content: "✅";
    margin-right: 8px;
    display: inline-block;
}

.optinperks-alert.optinperks-alert-success strong {
    display: inline;
}

.optinperks-alert.optinperks-alert-info {
    background-color: #fef3c7;
    border-color: #f59e0b;
    color: #92400e;
}

.optinperks-alert.optinperks-alert-info.strong::before {
    content: "ℹ️";
    margin-right: 8px;
}

/* Checkout context styles */
.optinperks-checkout-already-subscribed {
    margin-bottom: 20px;
}

.optinperks-checkout-existing-subscriptions {
    margin-bottom: 15px;
}

.optinperks-checkout-subscription-form {
    padding-top: 10px;
}

/* Registration context styles */
.optinperks-registration-already-subscribed {
    margin-bottom: 20px;
    margin-top: 20px;
}

.optinperks-registration-existing-subscriptions {
    margin-bottom: 15px;
}

/* Shortcode context styles */
.optinperks-current-subscriptions {
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #f8ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 3px;
    font-size: 12px;
    color: #6b7280;
}

.optinperks-current-subscriptions small {
    font-weight: 500;
}

/* Enhanced form wrapper for context-aware forms */
.optinperks-form-wrapper {
    position: relative;
}

.optinperks-form-wrapper .optinperks-alert {
    margin-bottom: 16px;
    border-left: 4px solid;
}

.optinperks-form-wrapper .optinperks-alert.optinperks-alert-success {
    border-left-color: #0ea5e9;
}

.optinperks-form-wrapper .optinperks-alert.optinperks-alert-info {
    border-left-color: #f59e0b;
}

/* Context-aware button states */
.optinperks-context-subscription-form {
    transition: all 0.3s ease;
}

.optinperks-context-subscription-form.subscribed-to-context {
    opacity: 0.7;
    pointer-events: none;
}

.optinperks-context-subscription-form.subscribed-to-other {
    border: 2px solid #0ea5e9;
    border-radius: 4px;
    padding: 12px;
    background-color: #f8fcff;
}

/* Icon animation for alerts */
.optinperks-alert::before {
    display: inline-block;
    animation: optinperks-alert-icon-pulse 2s ease-in-out infinite;
}

@keyframes optinperks-alert-icon-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .optinperks-alert {
        padding: 10px 12px;
        font-size: 13px;
        margin-bottom: 12px;
    }
    
    .optinperks-alert strong {
        margin-bottom: 3px;
    }
    
    .optinperks-current-subscriptions {
        padding: 6px 10px;
        font-size: 11px;
        margin-top: 6px;
    }
    
    .optinperks-form-wrapper .optinperks-alert {
        margin-bottom: 12px;
        border-left-width: 3px;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .optinperks-alert.optinperks-alert-success {
        background-color: #1e3a8a;
        border-color: #3b82f6;
        color: #bfdbfe;
    }
    
    .optinperks-alert.optinperks-alert-info {
        background-color: #451a03;
        border-color: #f59e0b;
        color: #fcd34d;
    }
    
    .optinperks-current-subscriptions {
        background-color: #1f2937;
        border-color: #374151;
        color: #9ca3af;
    }
    
    .optinperks-context-subscription-form.subscribed-to-other {
        background-color: #1e3a8a;
        border-color: #3b82f6;
    }
}

/* Animation for smooth transitions */
.optinperks-alert {
    animation: optinperks-alert-slide-in 0.4s ease-out;
}

@keyframes optinperks-alert-slide-in {
    from {
        transform: translateY(-10px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Accessibility improvements */
.optinperks-alert[role="alert"] {
    outline: none;
}

.optinperks-alert:focus-within {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
}

/* Form element visibility and styling */
.optinperks-double-optin-notice {
    display: none;
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #e7f3ff;
    border: 1px solid #b3d9ff;
    border-radius: 4px;
    font-size: 13px;
    color: #0073aa;
}

.optinperks-double-optin-notice span {
    font-weight: 600;
}

.optinperks-mapped-fields {
    display: none;
    margin-top: 10px;
}

.optinperks-consent-section {
    display: none;
    margin-top: 10px;
}

.optinperks-registration-already-subscribed {
    display: none;
}

/* Print styles */
@media print {
    .optinperks-alert {
        background: none !important;
        border: 1px solid #000 !important;
        color: #000 !important;
        page-break-inside: avoid;
    }
    
    .optinperks-alert::before {
        display: none;
    }
}