/**
 * WCF - Amazon-Inspired E-commerce Contact Forms
 * Version: 4.2.0 (with plugin 6.6.0)
 *
 * Changelog 4.2.0:
 *   - [v6.6.0] Public edition: PRO mode toggle/form removed from markup.
 *     Legacy .wcf-pro / .wcf-mode / .wcf-toggle rules retained but unused.
 *
 * Changelog 4.1.0:
 *   - [v6.4.9] Force readable text+placeholder color over WoodMart theme
 *   - [v6.4.1] Rejected file notice (amber warning box)
 *
 * Clean, professional design inspired by Amazon's UI
 */

/* ========================================
   Amazon Design System Variables
   ======================================== */
:root {
    /* Amazon Color Palette */
    --wcf-amazon-orange: #FF9900;
    --wcf-amazon-dark-orange: #E47911;
    --wcf-amazon-yellow: #FFD814;
    --wcf-amazon-dark-yellow: #F7CA00;
    --wcf-amazon-blue: #146EB4;
    --wcf-amazon-dark-blue: #0F4C81;
    --wcf-amazon-navy: #232F3E;
    --wcf-amazon-dark-navy: #131921;
    
    /* Functional Colors */
    --wcf-text-primary: #0F1111;
    --wcf-text-secondary: #565959;
    --wcf-text-light: #6F7373;
    --wcf-link-blue: #007185;
    --wcf-link-hover: #C7511F;
    --wcf-success: #067D62;
    --wcf-success-light: #F0F8F6;
    --wcf-error: #CC0C39;
    --wcf-error-light: #FFF5F5;
    --wcf-warning: #F08804;
    
    /* Backgrounds */
    --wcf-bg-white: #FFFFFF;
    --wcf-bg-light: #F7F8F8;
    --wcf-bg-gray: #EAEDED;
    --wcf-bg-hover: #F3F3F3;
    
    /* Borders */
    --wcf-border-light: #D5D9D9;
    --wcf-border-medium: #888C8C;
    --wcf-border-dark: #404040;
    --wcf-border-focus: #E77600;
    
    /* Typography */
    --wcf-font-amazon: "Amazon Ember", Arial, sans-serif;
    --wcf-font-fallback: Arial, sans-serif;
    
    /* Shadows */
    --wcf-shadow-button: 0 2px 5px 0 rgba(213,217,217,.5);
    --wcf-shadow-card: 0 2px 4px 0 rgba(0,0,0,.13);
    --wcf-shadow-hover: 0 4px 8px 0 rgba(0,0,0,.18);
    --wcf-shadow-focus: 0 0 0 3px rgba(255,153,0,.5);
    
    /* Spacing */
    --wcf-space-xs: 4px;
    --wcf-space-s: 8px;
    --wcf-space-m: 14px;
    --wcf-space-l: 20px;
    --wcf-space-xl: 28px;
    --wcf-space-xxl: 36px;
    
    /* Border Radius */
    --wcf-radius-small: 3px;
    --wcf-radius-medium: 4px;
    --wcf-radius-large: 8px;
    --wcf-radius-button: 8px;
    
    /* Transitions */
    --wcf-transition: all 0.1s ease-out;
}

/* ========================================
   Global Reset & Base
   ======================================== */
.wcf-form-container * {
    box-sizing: border-box;
}

/* ========================================
   Container - Amazon Card Style
   ======================================== */
.wcf-form-container {
    max-width: 700px;
    margin: 0 auto;
    font-family: var(--wcf-font-amazon), var(--wcf-font-fallback);
    font-size: 14px;
    line-height: 20px;
    color: var(--wcf-text-primary);
    -webkit-font-smoothing: antialiased;
}

.wcf-form-container.wcf-ecommerce {
    background: var(--wcf-bg-white);
    border: 1px solid var(--wcf-border-light);
    border-radius: var(--wcf-radius-large);
    box-shadow: var(--wcf-shadow-card);
    padding: var(--wcf-space-xs);
}

/* Amazon Prime Badge Style Header */
.wcf-form-header {
    border-bottom: 1px solid var(--wcf-bg-gray);
    padding-bottom: var(--wcf-space-l);
    margin-bottom: var(--wcf-space-xl);
}

.wcf-form-title {
    font-size: 28px;
    font-weight: 400;
    line-height: 36px;
    color: var(--wcf-text-primary);
    margin: 0 0 var(--wcf-space-xs);
}

.wcf-form-subtitle {
    font-size: 14px;
    color: var(--wcf-text-secondary);
    margin: 0;
}

/* Amazon Prime-style badge */
.wcf-prime-badge {
    display: inline-flex;
    align-items: center;
    background: var(--wcf-amazon-blue);
    color: white;
    padding: 2px 8px;
    border-radius: var(--wcf-radius-small);
    font-size: 12px;
    font-weight: 700;
    margin-left: var(--wcf-space-s);
}

/* ========================================
   Form Layout
   ======================================== */
.wcf-form-row {
    display: flex;
    gap: var(--wcf-space-m);
    margin-bottom: var(--wcf-space-m);
}

.wcf-form-group {
    flex: 1;
    margin-bottom: var(--wcf-space-m);
}

.wcf-col-half {
    flex: 0 0 calc(50% - 7px);
}

@media (max-width: 600px) {
    .wcf-form-row {
        flex-direction: column;
    }
    
    .wcf-col-half {
        flex: 1 0 100%;
    }
}

/* ========================================
   Labels - Amazon Style
   ======================================== */
.wcf-label {
    display: block;
    padding-left: 2px;
    padding-bottom: 2px;
    font-weight: 700;
    font-size: 14px;
    color: var(--wcf-text-primary);
}

.wcf-required {
    color: var(--wcf-error);
    margin-left: 2px;
}

.wcf-optional {
    color: var(--wcf-text-light);
    font-weight: 400;
    font-size: 13px;
}

/* ========================================
   Input Fields - Amazon Style
   ======================================== */
.wcf-input,
.wcf-textarea,
.wcf-select {
    width: 100%;
    padding: 7px 9px;
    font-size: 14px;
    line-height: 20px;
    color: var(--wcf-text-primary);
    background-color: var(--wcf-bg-white);
    border: 1px solid var(--wcf-border-medium);
    border-radius: var(--wcf-radius-medium);
    transition: var(--wcf-transition);
    font-family: inherit;
}

.wcf-input:hover,
.wcf-textarea:hover,
.wcf-select:hover {
    background-color: var(--wcf-bg-hover);
    border-color: var(--wcf-text-primary);
}

.wcf-input:focus,
.wcf-textarea:focus,
.wcf-select:focus {
    outline: none;
    border-color: var(--wcf-border-focus);
    background-color: var(--wcf-bg-white);
    box-shadow: var(--wcf-shadow-focus);
}

/* Input with icon wrapper */
.wcf-input-wrapper {
    position: relative;
}

.wcf-input-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--wcf-text-light);
    width: 16px;
    height: 16px;
}

.wcf-input-wrapper .wcf-input {
    padding-left: 32px;
}

/* ========================================
   Select Dropdown - Amazon Style
   ======================================== */
.wcf-select-wrapper {
    position: relative;
}

.wcf-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 28px;
    cursor: pointer;
    background-color: var(--wcf-bg-light);
    border-color: var(--wcf-border-light);
}

.wcf-select-arrow {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--wcf-text-secondary);
    width: 10px;
    height: 10px;
}

/* ========================================
   File Upload - Amazon Style
   ======================================== */
.wcf-file-upload-wrapper {
    position: relative;
    margin-bottom: var(--wcf-space-m);
}

.wcf-file-input {
    display: none;
}

.wcf-file-label {
    display: flex;
    align-items: center;
    padding: var(--wcf-space-m) var(--wcf-space-l);
    background: linear-gradient(to bottom, #F7F8FA, #E8EAED);
    border: 1px solid var(--wcf-border-light);
    border-radius: var(--wcf-radius-medium);
    cursor: pointer;
    transition: var(--wcf-transition);
}

.wcf-file-label:hover {
    background: linear-gradient(to bottom, #F2F3F5, #DCDFE3);
    border-color: var(--wcf-border-medium);
}

.wcf-upload-icon {
    margin-right: var(--wcf-space-m);
    color: var(--wcf-text-secondary);
}

.wcf-file-text strong {
    display: block;
    color: var(--wcf-link-blue);
    font-weight: 400;
    text-decoration: underline;
}

.wcf-file-text small {
    color: var(--wcf-text-secondary);
    font-size: 12px;
}

.wcf-file-info {
    margin-top: var(--wcf-space-xs);
    font-size: 12px;
    color: var(--wcf-text-light);
}

/* File Preview */
.wcf-file-preview {
    display: flex;
    align-items: center;
    padding: var(--wcf-space-s) var(--wcf-space-m);
    background: var(--wcf-success-light);
    border: 1px solid var(--wcf-success);
    border-radius: var(--wcf-radius-medium);
    margin-top: var(--wcf-space-s);
}

.wcf-file-icon {
    color: var(--wcf-success);
    margin-right: var(--wcf-space-s);
}

.wcf-file-name {
    flex: 1;
    font-size: 13px;
    color: var(--wcf-text-primary);
}

.wcf-file-remove {
    padding: 4px 8px;
    background: transparent;
    border: 1px solid var(--wcf-border-light);
    border-radius: var(--wcf-radius-small);
    color: var(--wcf-text-secondary);
    cursor: pointer;
    font-size: 12px;
    transition: var(--wcf-transition);
}

.wcf-file-remove:hover {
    background: var(--wcf-bg-white);
    border-color: var(--wcf-error);
    color: var(--wcf-error);
}

/* ========================================
   Textarea - Amazon Style
   ======================================== */
.wcf-textarea {
    min-height: 84px;
    resize: vertical;
    font-family: inherit;
}

.wcf-textarea-wrapper {
    position: relative;
}

.wcf-char-count {
    text-align: right;
    font-size: 12px;
    color: var(--wcf-text-light);
    margin-top: var(--wcf-space-xs);
}

/* ========================================
   Checkbox - Amazon Style
   ======================================== */
.wcf-checkbox-group {
    margin: var(--wcf-space-l) 0;
}

.wcf-checkbox-label {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    position: relative;
    padding-left: 24px;
    line-height: 18px;
}

.wcf-checkbox {
    position: absolute;
    opacity: 0;
    width: 18px;
    height: 18px;
    left: 0;
    top: 0;
    cursor: pointer;
}

.wcf-checkbox-custom {
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    background: var(--wcf-bg-white);
    border: 1px solid var(--wcf-border-medium);
    border-radius: var(--wcf-radius-small);
    display: flex;
    align-items: center;
    justify-content: center;
}

.wcf-checkbox:hover ~ .wcf-checkbox-custom {
    border-color: var(--wcf-amazon-orange);
}

.wcf-checkbox:checked ~ .wcf-checkbox-custom {
    background: var(--wcf-amazon-orange);
    border-color: var(--wcf-amazon-orange);
}

.wcf-checkbox-icon {
    display: none;
    width: 12px;
    height: 10px;
}

.wcf-checkbox:checked ~ .wcf-checkbox-custom .wcf-checkbox-icon {
    display: block;
}

.wcf-checkbox-text {
    font-size: 14px;
    color: var(--wcf-text-primary);
}

.wcf-link {
    color: var(--wcf-link-blue);
    text-decoration: none;
}

.wcf-link:hover {
    color: var(--wcf-link-hover);
    text-decoration: underline;
}

/* ========================================
   Submit Button - Amazon Style
   ======================================== */
.wcf-submit-group {
    margin-top: var(--wcf-space-xl);
    padding-top: var(--wcf-space-l);
    border-top: 1px solid var(--wcf-bg-gray);
}

.wcf-submit-btn {
    width: 100%;
    padding: 8px 16px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    color: #ffffff !important;
    background: linear-gradient(135deg, #4186a9 0%, #005a87 100%) !important;
    border: none !important;
    border-radius: var(--wcf-radius-button);
    cursor: pointer;
    transition: var(--wcf-transition);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wcf-space-s);
    text-transform: none;
}

.wcf-submit-btn:hover:not(:disabled) {
    color: #ffffff !important;
    background: linear-gradient(135deg, #3a7899 0%, #004d73 100%) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.wcf-submit-btn:active:not(:disabled) {
    color: white !important;
    background: linear-gradient(135deg, #347088 0%, #003f5e 100%);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
}

.wcf-submit-btn:focus {
    outline: none;
    box-shadow: var(--wcf-shadow-focus);
}

.wcf-submit-btn:disabled {
    background: var(--wcf-bg-gray);
    border-color: var(--wcf-border-light);
    color: var(--wcf-text-light);
    cursor: not-allowed;
    box-shadow: none;
}

/* Loading state — white spinner visible on blue submit button */
.wcf-submit-btn.is-loading {
    position: relative;
    pointer-events: none;
}

.wcf-submit-btn.is-loading .wcf-btn-text {
    display: none !important;
}

.wcf-submit-btn.is-loading .wcf-btn-spinner {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    color: #ffffff !important;
}

.wcf-btn-spinner-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: wcf-btn-spin 0.8s linear infinite;
    flex-shrink: 0;
}

@keyframes wcf-btn-spin {
    to { transform: rotate(360deg); }
}

/* Alternative Buy Now style button */
.wcf-submit-btn.wcf-buy-now {
    background: linear-gradient(to bottom, #FFA41C, #FF8F00);
    border-color: #FF8F00;
    color: var(--wcf-text-primary);
}

.wcf-submit-btn.wcf-buy-now:hover {
    background: linear-gradient(to bottom, #FF9500, #FF7F00);
}

/* ========================================
   Trust Badges - Amazon Style
   ======================================== */
.wcf-trust-badges {
    display: flex;
    justify-content: center;
    gap: var(--wcf-space-xl);
    margin-top: var(--wcf-space-l);
    padding: var(--wcf-space-m) 0;
}

.wcf-badge {
    display: flex;
    align-items: center;
    gap: var(--wcf-space-xs);
    font-size: 12px;
    color: var(--wcf-text-secondary);
}

.wcf-badge svg {
    width: 16px;
    height: 16px;
    color: var(--wcf-amazon-orange);
}

/* ========================================
   Messages - Amazon Style
   ======================================== */
.wcf-form-message {
    padding: var(--wcf-space-m);
    margin: var(--wcf-space-l) 0;
    border-radius: var(--wcf-radius-medium);
    font-size: 14px;
    line-height: 20px;
}

.wcf-form-message.success {
    background: var(--wcf-success-light);
    border: 1px solid var(--wcf-success);
    color: var(--wcf-success);
}

.wcf-form-message.error {
    background: var(--wcf-error-light);
    border: 1px solid var(--wcf-error);
    color: var(--wcf-error);
}

.wcf-message-content {
    display: flex;
    align-items: flex-start;
    gap: var(--wcf-space-s);
}

.wcf-message-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-top: 2px;
}

.wcf-success-icon {
    color: var(--wcf-success);
}

.wcf-error-icon {
    color: var(--wcf-error);
}

.wcf-message-text {
    flex: 1;
    font-weight: 700;
}

/* ========================================
   Error States - Amazon Style
   ======================================== */
.wcf-form-group.has-error .wcf-input,
.wcf-form-group.has-error .wcf-textarea,
.wcf-form-group.has-error .wcf-select {
    border-color: var(--wcf-error);
    border-width: 2px;
    padding: 6px 8px;
}

.wcf-form-group.has-error .wcf-label {
    color: var(--wcf-error);
}

.wcf-error-message {
    display: none;
    color: var(--wcf-error);
    font-size: 12px;
    line-height: 16px;
    margin-top: var(--wcf-space-xs);
}

.wcf-form-group.has-error .wcf-error-message {
    display: block;
}

/* Error icon */
.wcf-error-message::before {
    content: '⚠ ';
    font-weight: 700;
}

/* ========================================
   Help Text - Amazon Style
   ======================================== */
.wcf-help-text {
    font-size: 12px;
    color: var(--wcf-text-light);
    margin-top: var(--wcf-space-xs);
}

.wcf-help-link {
    color: var(--wcf-link-blue);
    font-size: 12px;
    text-decoration: none;
}

.wcf-help-link:hover {
    color: var(--wcf-link-hover);
    text-decoration: underline;
}

/* ========================================
   Section Dividers - Amazon Style
   ======================================== */
.wcf-form-section {
    margin-bottom: var(--wcf-space-xl);
    padding-bottom: var(--wcf-space-l);
    border-bottom: 1px solid var(--wcf-bg-gray);
}

.wcf-form-section:last-child {
    border-bottom: none;
}

.wcf-section-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--wcf-text-primary);
    margin: 0 0 var(--wcf-space-m);
}

/* ========================================
   Loading Overlay
   ======================================== */
.wcf-form.is-loading {
    position: relative;
    pointer-events: none;
}

.wcf-form.is-loading::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

/* ========================================
   Responsive Design
   ======================================== */
@media (max-width: 768px) {
    .wcf-form-container {
        padding: var(--wcf-space-m) var(--wcf-space-l);
    }
    
    .wcf-form-title {
        font-size: 24px;
        line-height: 32px;
    }
    
    .wcf-trust-badges {
        flex-direction: column;
        gap: var(--wcf-space-m);
    }
}

@media (max-width: 480px) {
    .wcf-form-container {
        padding: var(--wcf-space-m);
        border-radius: 0;
    }
    
    .wcf-form-title {
        font-size: 20px;
        line-height: 28px;
    }
    
    .wcf-submit-btn {
        font-size: 16px;
        padding: 10px 16px;
    }
}

/* ========================================
   Print Styles
   ======================================== */
@media print {
    .wcf-form-container {
        box-shadow: none;
        border: 1px solid #000;
    }
    
    .wcf-submit-group,
    .wcf-trust-badges {
        display: none;
    }
}

/* ========================================
   Dark Mode Support (Optional)
   ======================================== */
@media (prefers-color-scheme: dark) {
    .wcf-form-container.wcf-ecommerce {
        background: #fff!important;
        border-color: #404040;
        color: #e0e0e0;
    }
    
    .wcf-input,
    .wcf-textarea,
    .wcf-select {
        background: #2a2a2a;
        border-color: #404040;
        color: #e0e0e0;
    }
    
    .wcf-label {
        color: #e0e0e0;
    }
    
    .wcf-text-secondary {
        color: #999;
    }
}

/* ========================================
   Accessibility
   ======================================== */
.wcf-form-container:focus-within {
    outline: 2px solid var(--wcf-amazon-orange);
    outline-offset: 2px;
}

/* Skip to content link */
.wcf-skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--wcf-amazon-orange);
    color: white;
    padding: 8px;
    text-decoration: none;
    z-index: 100;
}

.wcf-skip-link:focus {
    top: 0;
}

/* High contrast mode */
@media (prefers-contrast: high) {
    .wcf-input,
    .wcf-textarea,
    .wcf-select {
        border-width: 2px;
    }
}
/* ============================================================
   ACF 6.4.1 — UX hotfix: rejected file notice
   ============================================================ */

.wcf-rejection-notice {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-top: 12px;
    padding: 16px 18px;
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1.5px solid #f4c542;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(244, 197, 66, 0.15);
    animation: wcf-rejection-slide-in 0.3s ease-out;
}

@keyframes wcf-rejection-slide-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.wcf-rejection-icon {
    font-size: 28px;
    line-height: 1;
    flex-shrink: 0;
}

.wcf-rejection-content {
    flex: 1;
    min-width: 0;
}

.wcf-rejection-title {
    font-weight: 700;
    font-size: 14px;
    color: #7a5800;
    margin-bottom: 4px;
}

.wcf-rejection-message {
    font-size: 13px;
    color: #5c4400;
    line-height: 1.5;
    margin-bottom: 10px;
}

.wcf-rejection-dismiss {
    display: inline-block;
    padding: 8px 16px;
    background: #d97706;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s ease, transform 0.05s ease;
}

.wcf-rejection-dismiss:hover {
    background: #b45309;
}

.wcf-rejection-dismiss:active {
    transform: translateY(1px);
}

/* Soften the progress bar error state — was alarm red, now warning amber */
.wcf-progress-bar.error .wcf-progress-fill {
    background: linear-gradient(90deg, #f59e0b, #d97706) !important;
}

.wcf-progress-bar.error .wcf-progress-text {
    color: #b45309 !important;
}

@media (max-width: 640px) {
    .wcf-rejection-notice {
        padding: 12px 14px;
        gap: 10px;
    }
    .wcf-rejection-icon {
        font-size: 22px;
    }
    .wcf-rejection-dismiss {
        width: 100%;
        text-align: center;
    }
}

/* ============================================================
   ACF 6.4.9 — Text + placeholder contrast fix (WoodMart override)
   ============================================================
   v6.4.8 fixed placeholders only — but the user's report showed that
   TYPED TEXT was also illegible. Cause: WoodMart theme CSS loads AFTER
   our plugin CSS and applies its own text color to all inputs/textareas
   site-wide, overriding our variables.
   
   Fix: force explicit colors with !important + -webkit-text-fill-color
   (for WebKit browsers that handle input text color separately).
   
   Colors used:
     - Typed text:  #0F1111 (almost black, contrast ratio 19:1 on white)
     - Placeholder: #6b7280 (medium gray, contrast ratio 5.7:1 — WCAG AA)
     - Helper text: #565959 (darker gray for counters, etc.)
*/

/* === 1. TYPED TEXT COLOR (the main fix) === */
.wcf-input,
.wcf-textarea,
.wcf-select,
.wcf-form input[type="text"],
.wcf-form input[type="email"],
.wcf-form input[type="tel"],
.wcf-form input[type="number"],
.wcf-form input[type="url"],
.wcf-form input[type="password"],
.wcf-form input[type="search"],
.wcf-form textarea,
.wcf-form select {
    color: #0F1111 !important;
    -webkit-text-fill-color: #0F1111 !important;
    opacity: 1 !important;
}

/* Focus state — keep readable */
.wcf-input:focus,
.wcf-textarea:focus,
.wcf-select:focus,
.wcf-form input:focus,
.wcf-form textarea:focus,
.wcf-form select:focus {
    color: #0F1111 !important;
    -webkit-text-fill-color: #0F1111 !important;
}

/* === 2. PLACEHOLDER COLOR === */
.wcf-form input::placeholder,
.wcf-form textarea::placeholder,
.wcf-input::placeholder,
.wcf-textarea::placeholder {
    color: #6b7280 !important;
    -webkit-text-fill-color: #6b7280 !important;
    opacity: 1 !important;
}

/* Webkit (Chrome, Safari, newer Edge) */
.wcf-form input::-webkit-input-placeholder,
.wcf-form textarea::-webkit-input-placeholder,
.wcf-input::-webkit-input-placeholder,
.wcf-textarea::-webkit-input-placeholder {
    color: #6b7280 !important;
    -webkit-text-fill-color: #6b7280 !important;
    opacity: 1 !important;
}

/* Firefox 19+ */
.wcf-form input::-moz-placeholder,
.wcf-form textarea::-moz-placeholder,
.wcf-input::-moz-placeholder,
.wcf-textarea::-moz-placeholder {
    color: #6b7280 !important;
    opacity: 1 !important;
}

/* IE 10-11 (legacy fallback) */
.wcf-form input:-ms-input-placeholder,
.wcf-form textarea:-ms-input-placeholder,
.wcf-input:-ms-input-placeholder,
.wcf-textarea:-ms-input-placeholder {
    color: #6b7280 !important;
}

/* Edge legacy */
.wcf-form input::-ms-input-placeholder,
.wcf-form textarea::-ms-input-placeholder,
.wcf-input::-ms-input-placeholder,
.wcf-textarea::-ms-input-placeholder {
    color: #6b7280 !important;
}

/* === 3. SELECT DROPDOWNS === */
/* Select first option (the "placeholder-like" option in dropdowns) */
.wcf-form select option[value=""],
.wcf-form select option:first-child:disabled,
.wcf-select option[value=""],
.wcf-select option:first-child:disabled {
    color: #6b7280 !important;
}

/* Select options when expanded */
.wcf-form select option,
.wcf-select option {
    color: #0F1111 !important;
    background-color: #ffffff !important;
}

/* When the select shows its placeholder value */
.wcf-form select:invalid,
.wcf-select:invalid {
    color: #6b7280 !important;
}

/* === 4. CHARACTER COUNTER + HELPER TEXT === */
.wcf-form .char-count,
.wcf-form .wcf-char-counter,
.wcf-form .form-counter,
.wcf-form .wcf-helper,
.wcf-form .wcf-form-helper,
.wcf-form .helper-text {
    color: #565959 !important;
}

/* === 5. LABELS — keep them strong === */
.wcf-form label,
.wcf-form .wcf-label,
.wcf-label {
    color: #0F1111 !important;
}

/* === 6. AUTOFILL OVERRIDE (Chrome/Safari) ===
   When the browser auto-fills a field (e.g. saved email), it applies its
   own background+text color that's hard to override. This trick keeps
   our colors visible even on autofill. */
.wcf-input:-webkit-autofill,
.wcf-textarea:-webkit-autofill,
.wcf-form input:-webkit-autofill,
.wcf-form textarea:-webkit-autofill {
    -webkit-text-fill-color: #0F1111 !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    transition: background-color 5000s ease-in-out 0s;
}