@global-primary-color: var(--global-primary-color);

@global-normal-color: var(--global-normal-color);

@global-warm-color: var(--global-warm-color);

@global-danger-color: var(--global-danger-color);

@global-checked-color: var(--global-checked-color);

@global-border-radius: var(--global-border-radius);

@global-fore-color: var(--global-fore-color);

@global-back-color: var(--global-back-color);

@global-neutral-color-1: var(--global-neutral-color-1);

@global-neutral-color-2: var(--global-neutral-color-2);

@global-neutral-color-3: var(--global-neutral-color-3);

@global-neutral-color-4: var(--global-neutral-color-4);

@global-neutral-color-5: var(--global-neutral-color-5);

@global-neutral-color-6: var(--global-neutral-color-6);

@global-neutral-color-7: var(--global-neutral-color-7);

@global-neutral-color-8: var(--global-neutral-color-8);

:root {

  --global-primary-color: #009688;

  --global-normal-color: #1e9fff;

  --global-warm-color: #ffb800;

  --global-danger-color: #ff5722;

  --global-checked-color: #5fb878;

  --global-border-radius: 2px;

  --global-fore-color: #333;

  --global-back-color: #ffffff;

  --global-neutral-color-1: #FAFAFA;

  --global-neutral-color-2: #F6F6F6;
  
  --global-neutral-color-3: #eeeeee;
  
  --global-neutral-color-4: #e2e2e2;
  
  --global-neutral-color-5: #dddddd;
  
  --global-neutral-color-6: #d2d2d2;
  
  --global-neutral-color-7: #cccccc;
  
  --global-neutral-color-8: #c2c2c2;
}

body[lay-theme="dark"] {
  
  --global-fore-color: #ffffff;

  --global-back-color: #333;

  --global-neutral-color-1: #FAFAFA;

  --global-neutral-color-2: #F6F6F6;
  
  --global-neutral-color-3: #eeeeee;
  
  --global-neutral-color-4: #e2e2e2;
  
  --global-neutral-color-5: #dddddd;
  
  --global-neutral-color-6: #d2d2d2;
  
  --global-neutral-color-7: #cccccc;
  
  --global-neutral-color-8: #c2c2c2;
}