@import '@alfalab/core-components-vars/src/index.css';
@import '../../form-control/src/vars.css';

:root {
    --input-color: var(--color-light-text-primary);
    --input-placeholder-color: var(--color-light-text-secondary);
    --input-focus-placeholder-color: var(--color-light-text-tertiary);
    --input-with-label-placeholder-color: var(--color-light-text-tertiary);
    --input-caret-color: var(--color-light-neutral-translucent-1300);
    --input-inverted-color: var(--color-light-text-primary-inverted);
    --input-inverted-placeholder-color: var(--color-light-text-secondary-inverted);
    --input-inverted-focus-placeholder-color: var(--color-light-text-tertiary-inverted);
    --input-inverted-with-label-placeholder-color: var(--color-light-text-tertiary-inverted);
    --input-inverted-caret-color: var(--color-light-neutral-translucent-1300-inverted);

    /* disabled */
    --input-disabled-color: var(--color-light-text-tertiary);
    --input-inverted-disabled-color: var(--color-light-text-tertiary-inverted);

    /* read-only */
    --input-read-only-color: var(--color-light-text-tertiary);
    --input-inverted-read-only-color: var(--color-light-text-tertiary-inverted);

    /* error */
    --input-error-color: var(--color-light-text-primary);
    --input-inverted-error-color: var(--color-light-text-primary-inverted);

    /* display */
    --input-error-icon-display: none;
    --input-success-icon-display: flex;

    /* управляет видимостью иконки ошибки, если она стоит рядом с другой иконкой */
    --input-error-icon-not-alone-display: none;

    /* desktop */
    --input-desktop-border-radius-size-72: var(--border-radius-14);
    --input-desktop-border-radius-size-64: var(--border-radius-12);
    --input-desktop-border-radius-size-56: var(--border-radius-10);
    --input-desktop-border-radius-size-48: var(--border-radius-10);
    --input-desktop-border-radius-size-40: var(--border-radius-10);
}