:root {
  --radius: 8px;
  --radius2: 10px;
  --radius-2: 10px;
  --radius-3: 14px;
  --label-fontsize: 12px;
  --color-danger: #d92d20;
  --bg-danger: #d92d20;
}

html[data-theme="light"] {
  --bg-color: #f3f5f8;
  --bg-primary: #ffffff;
  --bg-accent-light: #eef1f6;
  --border: #d5dae1;
  --input-bg: #ffffff;
  --input-bg-focused: #ffffff;
  --input-color: #101828;
  --input-bg-disabled: #f6f7f9;
  --input-color-disabled: #667085;
  --input-border-focused: var(--color);
  --input-bg-invalid: #fef3f2;
  --input-border-invalid: #f04438;
  --input-label: #344054;
  --label-color-disabled: #667085;
  --text-default: #101828;
  --box-shadow-color: rgb(16 24 40 / 14%);
  --box-shadow-blur-radius: 24px;
  --box-shadow2-color: rgb(16 24 40 / 8%);
  --box-shadow2-v-offset: 1px;
  --box-shadow2-blur-radius: 3px;
}

html[data-theme="dark"] {
  --bg-color: #16181d;
  --bg-primary: #1e2128;
  --bg-accent-light: #2a2f38;
  --border: #353b45;
  --input-bg: #181b21;
  --input-bg-focused: #181b21;
  --input-color: #f2f4f7;
  --input-bg-disabled: #1e2128;
  --input-border-focused: var(--color);
  --input-label: #c4cad4;
  --label-color-disabled: #8a93a3;
  --text-default: #e4e7ec;
}