@use '../../abstract' as *;

::placeholder,
[contentEditable="true"] {
  --p-placeholder-color: var(--color-neutral-20);
  --p-placeholder-color-disabled: var(--color-neutral-20);

  #{$theme-dark} & {
    --p-placeholder-color: var(--color-neutral-60);
  }
}

::placeholder {
  color: hsl(var(--p-placeholder-color));
}

:disabled::placeholder {
  color: hsl(var(--p-placeholder-color-disabled));
  #{$theme-dark} & {
    --p-placeholder-color: var(--color-neutral-70);
    --p-placeholder-color-disabled: var(--color-neutral-70);
  }
}

[contentEditable="true"] {
  &::before { color:hsl(var(--p-placeholder-color)); }
}