@import "../../colors.css";
@import "../../typography.css";
@import "../properties.css";

:root {
  --dropdown-border-color: var(--form-item-border-color);
  --dropdown-border-style: solid;
  --dropdown-border-radius: var(--form-item-border-radius);
  --dropdown-border-width: 0 0 2px 0;
  --dropdown-font-family: var(--form-item-font-family);
  --dropdown-font-size: var(--form-item-font-size);
  --dropdown-line-height: 37px;
  --dropdown-text-color: var(--color-squanchy-gray-400);

  --dropdown-select-padding-bottom: 6px;
  --dropdown-select-padding-left: 0;
  --dropdown-select-padding-right: 20px;
  --dropdown-select-padding-top: 10px;

  --dropdown-icon-size: 30px;

  --dropdown-label-color: var(--form-item-label-color);
  --dropdown-label-font-size: var(--form-item-font-size);

  --dropdown-secondary-text-font-size: var(--form-item-font-size);
  --dropdown-secondary-text-success-color: var(--color-picklerick-green-100);

  --dropdown-focus-border-color: var(--color-picklerick-green-100);
  --dropdown-focus-transition-time: 100ms;

  --dropdown-error-color: var(--form-item-error-color);
  --dropdown-secondary-text-error-color: var(--color-beth-pink-100);

  --dropdown-color-disabled: var(--color-squanchy-gray-50);
  --dropdown-option-disabled-background: none;
}
