@forward '../VInput/variables';
@use 'sass:map';
@use '../../styles/settings';
@use '../../styles/tools';
@use '../VInput/variables' as *;

// INPUT
$field-border-radius: settings.$border-radius-root !default;
$field-rounded-border-radius: map.get(settings.$rounded, 'xl') !default;
$field-color: tools.theme-color('on-surface', var(--v-medium-emphasis-opacity)) !default;
$field-disabled-color: tools.theme-color('on-surface', var(--v-disabled-opacity)) !default;
$field-error-color: rgb(var(--v-theme-error)) !default;
$field-font-size: 16px !default;
$field-letter-spacing: .009375em !default;
$field-max-width: 100% !default;
$field-transition-timing: .15s settings.$standard-easing !default;
$field-subtle-transition-timing: 250ms settings.$standard-easing !default;
$field-underlined-margin-bottom: 4px !default;
$field-clearable-margin: 4px !default;
$field-clearable-transition: .15s opacity, .15s width settings.$standard-easing !default;
$field-chip-height: 24px !default;

// CONTROL
$field-control-solo-background: rgb(var(--v-theme-surface)) !default;
$field-control-solo-color: tools.theme-color('on-surface', var(--v-high-emphasis-opacity)) !default;
$field-control-solo-elevation: 1 !default;
$field-control-solo-inverted-color: tools.theme-color('on-surface', var(--v-high-emphasis-opacity)) !default;
$field-control-solo-inverted-focused-color: rgb(var(--v-theme-on-surface-variant)) !default;
$field-control-filled-background: tools.theme-color('on-surface', var(--v-idle-opacity)) !default;
$field-control-padding-start: 16px !default;
$field-control-padding-end: 16px !default;
$field-control-padding-top: 8px !default;
$field-control-padding-bottom: 4px !default;
$field-control-affixed-padding: 12px !default;
$field-control-affixed-inner-padding: 6px !default;
$field-control-underlined-height: 48px !default;
$field-control-underlined-padding-bottom: 2px !default;
$field-control-height: 56px !default;

// INPUT
$field-input-opacity: var(--v-high-emphasis-opacity) !default;
$field-input-min-height: #{max(
  var(--v-input-control-height, $input-control-height),
  calc($input-font-size * $input-line-height + var(--v-field-input-padding-top) + var(--v-field-input-padding-bottom))
)} !default;
$field-input-padding-top: calc(var(--v-field-padding-top, $field-control-padding-top) + var(--v-input-padding-top, 0px)) !default;
$field-input-padding-bottom: var(--v-field-padding-bottom, $field-control-padding-bottom) !default;
$field-input-column-gap: 2px !default;
$field-input-row-gap: 8px !default;

// LABEL
$field-label-floating-scale: .75 !default;

// OUTLINE
$field-outline-opacity: .38 !default;
$field-border-width: 1px !default;
$field-focused-border-width: 2px !default;

// OVERLAY
$field-overlay-filled-opacity: 0.04 !default;
$field-overlay-focused-background-color: rgb(var(--v-theme-surface-variant)) !default;