@use "sass:color";
@use "../sizes" as *;
@use "../colors" as *;

// adduse

/**
* $name 10. Text color
* $type color
*/
$texteditor-color: $base-text-color !default;

/**
* $name 20. Placeholder text color
* $type color
*/
$texteditor-placeholder-color: $base-label-color !default;
$texteditor-label-color: $texteditor-placeholder-color;

/**
* $name 30. Background color
* $type color
*/
$texteditor-bg: color.change($base-text-color, $alpha: 0.04) !default;

/**
* $name 40. Focused background color
* $type color
*/
$texteditor-focused-bg: color.change($base-text-color, $alpha: 0.04) !default;

/**
* $name 50. Border color
* $type color
*/
$texteditor-border-color: color.change($texteditor-color, $alpha: 0.42) !default;

/**
* $name 60. Hovered border color
* $type color
*/
$texteditor-hover-border-color: $texteditor-color !default;

/**
* $name 70. Focused border color
* $type color
*/
$texteditor-focused-border-color: $base-accent !default;

/**
* $name 40. Hovered background color
* $type color
*/
$texteditor-hover-bg: color.change($base-text-color, $alpha: 0.07) !default;
$texteditor-button-clear-icon-color: null !default;
$texteditor-button-clear-icon-color-bg: null !default;
$texteditor-invalid-focused-border-color: $base-invalid-color !default;
$texteditor-invalid-faded-border-color: $base-invalid-faded-border-color !default;
$texteditor-disabled-color: $base-disabled-color !default;
$texteditor-input-border-radius: $base-border-radius !default;
$texteditor-label-transition:
  font-size 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms,
  transform 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms,
  top 0.2s cubic-bezier(0, 0, 0.2, 1) 0ms;

@if $mode == "light" {
  $texteditor-button-clear-icon-color: lighten($texteditor-color, 46%) !default;
  $texteditor-button-clear-icon-color-bg: lighten($texteditor-color, 76%) !default;
}

@if $mode == "dark" {
  $texteditor-button-clear-icon-color: darken($texteditor-color, 76%) !default;
  $texteditor-button-clear-icon-color-bg: darken($texteditor-color, 34%) !default;
}

:root {
  --dx-texteditor-color-text: #{$texteditor-color};
  --dx-texteditor-color-label: #{$texteditor-label-color};
}