/* =========================================================
   File: public/assets/marketv2/components/password-field/variables.css
   Market UI v2 - Password Field Variables

   Canonical Contract
   ---------------------------------------------------------
   runtime theme context -> component contract -> render aliases

   Supports:
   - password toggle
   - strong password mode
   - strength meter
   - requirements panel
   - confirm/match state
   - create/reset/change password flows

   Rules:
   - reads only from --m-context-*
   - no hex
   - no rgba()
   - no color-mix()
   - no local semantic palette invention
========================================================= */

:root {
    /* =====================================================
       1) METRICS — SIZE SCALE
    ===================================================== */

    --m-password-field-toggle-size-sm: calc(var(--m-field-clear-hit-size) - 2px);
    --m-password-field-toggle-size-md: var(--m-field-clear-hit-size);
    --m-password-field-toggle-size-lg: calc(var(--m-field-clear-hit-size) + 4px);

    --m-password-field-icon-size-sm: var(--m-field-icon-size-sm);
    --m-password-field-icon-size-md: var(--m-field-icon-size-md);
    --m-password-field-icon-size-lg: var(--m-field-icon-size-lg);

    --m-password-field-strength-bar-height: 6px;
    --m-password-field-strength-gap: 8px;

    --m-password-field-requirements-gap: 8px;
    --m-password-field-requirements-list-gap: 8px;
    --m-password-field-requirement-dot-size: 8px;

    /* =====================================================
       2) METRICS — RADIUS SCALE
    ===================================================== */

    --m-password-field-toggle-radius: 999px;
    --m-password-field-strength-radius: 999px;
    --m-password-field-requirement-radius: 999px;
    --m-password-field-requirements-radius: 14px;
    --m-password-field-match-radius: 12px;

    /* =====================================================
       3) METRICS — SPACING / LAYOUT
    ===================================================== */

    --m-password-field-action-inset-inline-start: 10px;

    --m-password-field-input-padding-end-sm: calc(var(--m-field-padding-x-sm) + var(--m-password-field-toggle-size-sm) + var(--m-field-gap-sm));
    --m-password-field-input-padding-end-md: calc(var(--m-field-padding-x-md) + var(--m-password-field-toggle-size-md) + var(--m-field-gap-sm));
    --m-password-field-input-padding-end-lg: calc(var(--m-field-padding-x-lg) + var(--m-password-field-toggle-size-lg) + var(--m-field-gap-md));

    --m-password-field-input-padding-end-with-clear-sm: 66px;
    --m-password-field-input-padding-end-with-clear-md: 72px;
    --m-password-field-input-padding-end-with-clear-lg: 78px;

    --m-password-field-input-padding-start-sm: 38px;
    --m-password-field-input-padding-start-md: 42px;
    --m-password-field-input-padding-start-lg: 46px;

    --m-password-field-meta-margin-top: var(--m-field-help-gap);
    --m-password-field-requirements-margin-top: var(--m-field-gap-lg);

    --m-password-field-requirements-padding-y: 12px;
    --m-password-field-requirements-padding-x: 14px;

    --m-password-field-match-padding-y: 8px;
    --m-password-field-match-padding-x: 10px;

    /* =====================================================
       4) METRICS — TYPOGRAPHY
    ===================================================== */

    --m-password-field-meta-font-size: var(--m-field-help-font-size);
    --m-password-field-strength-label-font-size: var(--m-field-help-font-size);
    --m-password-field-requirement-font-size: var(--m-field-help-font-size);
    --m-password-field-match-font-size: var(--m-field-help-font-size);

    /* =====================================================
       5) METRICS — MOTION / TIMING
    ===================================================== */

    --m-password-field-transition-fast: var(--m-field-transition-fast);
    --m-password-field-transition-soft: var(--m-field-transition-base);

    /* =====================================================
       6) RUNTIME CONTEXT BRIDGE
    ===================================================== */

    --m-password-field-context-surface: var(--m-context-surface);
    --m-password-field-context-surface-soft: var(--m-context-surface-soft);
    --m-password-field-context-surface-raised: var(--m-context-surface-raised);
    --m-password-field-context-surface-hover: var(--m-context-surface-hover);

    --m-password-field-context-border: var(--m-context-border);
    --m-password-field-context-border-soft: var(--m-context-border-soft);

    --m-password-field-context-text: var(--m-context-text);
    --m-password-field-context-text-strong: var(--m-context-text-strong);
    --m-password-field-context-text-muted: var(--m-context-text-muted);
    --m-password-field-context-text-faint: var(--m-context-text-faint);

    --m-password-field-context-accent: var(--m-context-accent-color);
    --m-password-field-context-focus-ring: var(--m-context-focus-ring);

    --m-password-field-context-success-surface: var(
        --m-context-success-surface,
        var(--m-password-field-context-surface-soft)
    );
    --m-password-field-context-success-border: var(
        --m-context-success-border,
        var(--m-password-field-context-border)
    );
    --m-password-field-context-success-accent: var(
        --m-context-success-accent,
        var(--m-password-field-context-accent)
    );
    --m-password-field-context-success-text: var(
        --m-context-success-text,
        var(--m-password-field-context-text)
    );

    --m-password-field-context-danger-surface: var(
        --m-context-danger-surface,
        var(--m-password-field-context-surface-soft)
    );
    --m-password-field-context-danger-border: var(
        --m-context-danger-border,
        var(--m-password-field-context-border)
    );
    --m-password-field-context-danger-accent: var(
        --m-context-danger-accent,
        var(--m-password-field-context-accent)
    );
    --m-password-field-context-danger-text: var(
        --m-context-danger-text,
        var(--m-password-field-context-text)
    );

    --m-password-field-context-warning-accent: var(
        --m-context-warning-accent,
        var(--m-password-field-context-accent)
    );
    --m-password-field-context-warning-text: var(
        --m-context-warning-text,
        var(--m-password-field-context-text)
    );

    --m-password-field-context-info-accent: var(
        --m-context-info-accent,
        var(--m-password-field-context-accent)
    );
    --m-password-field-context-info-text: var(
        --m-context-info-text,
        var(--m-password-field-context-text)
    );

    /* =====================================================
       7) COMPONENT CONTRACT — TOGGLE BUTTON
    ===================================================== */

    --m-password-field-toggle-bg: transparent;
    --m-password-field-toggle-text: var(--m-password-field-context-text-muted);
    --m-password-field-toggle-border: transparent;

    --m-password-field-toggle-hover-bg: var(--m-password-field-context-surface-hover);
    --m-password-field-toggle-hover-text: var(--m-password-field-context-text-strong);
    --m-password-field-toggle-hover-border: transparent;

    --m-password-field-toggle-focus-bg: var(--m-password-field-toggle-hover-bg);
    --m-password-field-toggle-focus-text: var(--m-password-field-toggle-hover-text);
    --m-password-field-toggle-focus-border: var(--m-password-field-context-accent);
    --m-password-field-toggle-focus-ring: var(--m-field-focus-shadow);

    --m-password-field-toggle-disabled-bg: transparent;
    --m-password-field-toggle-disabled-text: var(--m-password-field-context-text-faint);
    --m-password-field-toggle-disabled-border: transparent;

    /* =====================================================
       8) COMPONENT CONTRACT — STRENGTH METER
    ===================================================== */

    --m-password-field-strength-track-bg: var(--m-password-field-context-surface-soft);
    --m-password-field-strength-track-border: transparent;

    --m-password-field-strength-label-text: var(--m-password-field-context-text-muted);

    --m-password-field-strength-fill-0: var(--m-password-field-context-surface-soft);
    --m-password-field-strength-fill-1: var(--m-password-field-context-danger-accent);
    --m-password-field-strength-fill-2: var(--m-password-field-context-warning-accent);
    --m-password-field-strength-fill-3: var(--m-password-field-context-info-accent);
    --m-password-field-strength-fill-4: var(--m-password-field-context-success-accent);

    --m-password-field-strength-text-0: var(--m-password-field-context-text-muted);
    --m-password-field-strength-text-1: var(--m-password-field-context-danger-text);
    --m-password-field-strength-text-2: var(--m-password-field-context-warning-text);
    --m-password-field-strength-text-3: var(--m-password-field-context-info-text);
    --m-password-field-strength-text-4: var(--m-password-field-context-success-text);

    /* =====================================================
       9) COMPONENT CONTRACT — MATCH STATE
    ===================================================== */

    --m-password-field-match-text: var(--m-password-field-context-success-text);
    --m-password-field-match-bg: var(--m-password-field-context-success-surface);
    --m-password-field-match-border: var(--m-password-field-context-success-border);

    --m-password-field-mismatch-text: var(--m-password-field-context-danger-text);
    --m-password-field-mismatch-bg: var(--m-password-field-context-danger-surface);
    --m-password-field-mismatch-border: var(--m-password-field-context-danger-border);

    /* =====================================================
       10) COMPONENT CONTRACT — REQUIREMENTS PANEL
    ===================================================== */

    --m-password-field-requirements-bg: var(--m-password-field-context-surface-raised);
    --m-password-field-requirements-border: var(--m-password-field-context-border-soft);
    --m-password-field-requirements-shadow: none;

    --m-password-field-requirements-title-text: var(--m-password-field-context-text-strong);

    --m-password-field-requirement-text: var(--m-password-field-context-text-muted);
    --m-password-field-requirement-dot-bg: var(--m-password-field-context-border-soft);

    --m-password-field-requirement-pass-text: var(--m-password-field-context-success-text);
    --m-password-field-requirement-pass-dot-bg: var(--m-password-field-context-success-accent);

    --m-password-field-requirement-fail-text: var(--m-password-field-context-text-muted);
    --m-password-field-requirement-fail-dot-bg: var(--m-password-field-context-border-soft);

    /* =====================================================
       11) COMPONENT CONTRACT — STATE HELPERS
    ===================================================== */

    --m-password-field-error-text: var(--m-password-field-context-danger-text);
    --m-password-field-success-text: var(--m-password-field-context-success-text);

    --m-password-field-action-hover-text: var(--m-password-field-toggle-hover-text);

    /* =====================================================
       12) RENDER ALIASES
    ===================================================== */

    --password_field_toggle_size_sm: var(--m-password-field-toggle-size-sm);
    --password_field_toggle_size_md: var(--m-password-field-toggle-size-md);
    --password_field_toggle_size_lg: var(--m-password-field-toggle-size-lg);

    --password_field_icon_size_sm: var(--m-password-field-icon-size-sm);
    --password_field_icon_size_md: var(--m-password-field-icon-size-md);
    --password_field_icon_size_lg: var(--m-password-field-icon-size-lg);

    --password_field_strength_bar_height: var(--m-password-field-strength-bar-height);
    --password_field_strength_gap: var(--m-password-field-strength-gap);

    --password_field_requirements_gap: var(--m-password-field-requirements-gap);
    --password_field_requirements_list_gap: var(--m-password-field-requirements-list-gap);
    --password_field_requirement_dot_size: var(--m-password-field-requirement-dot-size);

    --password_field_toggle_radius: var(--m-password-field-toggle-radius);
    --password_field_strength_radius: var(--m-password-field-strength-radius);
    --password_field_requirement_radius: var(--m-password-field-requirement-radius);
    --password_field_requirements_radius: var(--m-password-field-requirements-radius);
    --password_field_match_radius: var(--m-password-field-match-radius);

    --password_field_action_inset_end: var(--m-password-field-action-inset-inline-start);

    --password_field_input_padding_end_sm: var(--m-password-field-input-padding-end-sm);
    --password_field_input_padding_end_md: var(--m-password-field-input-padding-end-md);
    --password_field_input_padding_end_lg: var(--m-password-field-input-padding-end-lg);

    --password_field_input_padding_end_with_clear_sm: var(--m-password-field-input-padding-end-with-clear-sm);
    --password_field_input_padding_end_with_clear_md: var(--m-password-field-input-padding-end-with-clear-md);
    --password_field_input_padding_end_with_clear_lg: var(--m-password-field-input-padding-end-with-clear-lg);

    --password_field_input_padding_start_sm: var(--m-password-field-input-padding-start-sm);
    --password_field_input_padding_start_md: var(--m-password-field-input-padding-start-md);
    --password_field_input_padding_start_lg: var(--m-password-field-input-padding-start-lg);

    --password_field_meta_margin_top: var(--m-password-field-meta-margin-top);
    --password_field_requirements_margin_top: var(--m-password-field-requirements-margin-top);

    --password_field_requirements_padding_y: var(--m-password-field-requirements-padding-y);
    --password_field_requirements_padding_x: var(--m-password-field-requirements-padding-x);

    --password_field_match_padding_y: var(--m-password-field-match-padding-y);
    --password_field_match_padding_x: var(--m-password-field-match-padding-x);

    --password_field_meta_font_size: var(--m-password-field-meta-font-size);
    --password_field_strength_label_font_size: var(--m-password-field-strength-label-font-size);
    --password_field_requirement_font_size: var(--m-password-field-requirement-font-size);
    --password_field_match_font_size: var(--m-password-field-match-font-size);

    --password_field_transition_fast: var(--m-password-field-transition-fast);
    --password_field_transition_soft: var(--m-password-field-transition-soft);

    --password_field_toggle_bg: var(--m-password-field-toggle-bg);
    --password_field_toggle_text: var(--m-password-field-toggle-text);
    --password_field_toggle_border: var(--m-password-field-toggle-border);

    --password_field_toggle_hover_bg: var(--m-password-field-toggle-hover-bg);
    --password_field_toggle_hover_text: var(--m-password-field-toggle-hover-text);
    --password_field_toggle_hover_border: var(--m-password-field-toggle-hover-border);

    --password_field_toggle_focus_bg: var(--m-password-field-toggle-focus-bg);
    --password_field_toggle_focus_text: var(--m-password-field-toggle-focus-text);
    --password_field_toggle_focus_border: var(--m-password-field-toggle-focus-border);
    --password_field_toggle_focus_ring: var(--m-password-field-toggle-focus-ring);

    --password_field_toggle_disabled_bg: var(--m-password-field-toggle-disabled-bg);
    --password_field_toggle_disabled_text: var(--m-password-field-toggle-disabled-text);
    --password_field_toggle_disabled_border: var(--m-password-field-toggle-disabled-border);

    --password_field_strength_track_bg: var(--m-password-field-strength-track-bg);
    --password_field_strength_track_border: var(--m-password-field-strength-track-border);
    --password_field_strength_empty_bg: var(--m-password-field-strength-fill-0);
    --password_field_strength_fill_0: var(--m-password-field-strength-fill-0);
    --password_field_strength_fill_1: var(--m-password-field-strength-fill-1);
    --password_field_strength_fill_2: var(--m-password-field-strength-fill-2);
    --password_field_strength_fill_3: var(--m-password-field-strength-fill-3);
    --password_field_strength_fill_4: var(--m-password-field-strength-fill-4);

    --password_field_strength_label_text: var(--m-password-field-strength-label-text);
    --password_field_strength_text_0: var(--m-password-field-strength-text-0);
    --password_field_strength_text_1: var(--m-password-field-strength-text-1);
    --password_field_strength_text_2: var(--m-password-field-strength-text-2);
    --password_field_strength_text_3: var(--m-password-field-strength-text-3);
    --password_field_strength_text_4: var(--m-password-field-strength-text-4);

    --password_field_match_text: var(--m-password-field-match-text);
    --password_field_match_bg: var(--m-password-field-match-bg);
    --password_field_match_border: var(--m-password-field-match-border);

    --password_field_mismatch_text: var(--m-password-field-mismatch-text);
    --password_field_mismatch_bg: var(--m-password-field-mismatch-bg);
    --password_field_mismatch_border: var(--m-password-field-mismatch-border);

    --password_field_requirements_bg: var(--m-password-field-requirements-bg);
    --password_field_requirements_border: var(--m-password-field-requirements-border);
    --password_field_requirements_shadow: var(--m-password-field-requirements-shadow);

    --password_field_requirements_title_text: var(--m-password-field-requirements-title-text);
    --password_field_requirement_text: var(--m-password-field-requirement-text);
    --password_field_requirement_dot_bg: var(--m-password-field-requirement-dot-bg);
    --password_field_requirement_pass_text: var(--m-password-field-requirement-pass-text);
    --password_field_requirement_pass_dot_bg: var(--m-password-field-requirement-pass-dot-bg);
    --password_field_requirement_fail_text: var(--m-password-field-requirement-fail-text);
    --password_field_requirement_fail_dot_bg: var(--m-password-field-requirement-fail-dot-bg);

    --password_field_error_text: var(--m-password-field-error-text);
    --password_field_success_text: var(--m-password-field-success-text);

    --password_field_action_hover_text: var(--m-password-field-action-hover-text);
}
