/* --------------------------------------------------------
* variable-form.css
--------------------------------------------------------*/

/* @group @variables - color black to white */

:root {
--color-form-checked: hsla(198, 75%, 47.5%, 1);
--color-form-checked-background: hsla(198, 75%, 97.5%, 1);
--color-form-error: hsla(0, 75%, 47.5%, 1);
--color-form-success: hsla(150, 75%, 47.5%, 1);

--color-label: hsla(240, 4%, 16%, 1);
--color-form-icon: hsla(242.5, 5%, 85%, 1);

--check-border: hsla(240, 5%, 65%, 1);

--color-input-disabled: hsla(220, 5%, 60%, .5);
}

/* @end @variables - color black to white */

/* --------------------------------------------------------*/

/* @group @variables - form color */

:root {
--color-autofill-primary: hsla(220, 90%, 45%, 1);
--color-autofill-secondary: hsla(220, 90%, 97.5%, 1);
--color-input-disabled: hsla(220, 10%, 85%, 1);
--color-success-primary: hsla(120, 55%, 45%, 1);
--color-success-secondary: hsla(120, 60%, 97.5%, 1);
--color-error-primary: hsla(355, 55%, 55%, 1);
--color-error-secondary: hsla(355, 60%, 97.5%, 1);
--color-warning-primary: hsla(50, 95%, 47.5%, 1);
--color-warning-secondary:hsla(50, 100%, 97.5%, 1);
--color-focus-primary: hsla(205, 55%, 55%, 1);
--color-focus-secondary: hsla(205, 90%, 97.5%, 1);
--color-focus-tertiary: hsla(205, 55%, 75%, 1);
}

/* @end @variables - form color */