1. .Button {
    
  2.   border: none;
    
  3.   background: var(--color-button-background);
    
  4.   color: var(--color-button);
    
  5.   padding: 0;
    
  6.   border-radius: 0.25rem;
    
  7.   flex: 0 0 auto;
    
  8.   cursor: pointer;
    
  9. }
    
  10. .ButtonContent {
    
  11.   display: inline-flex;
    
  12.   align-items: center;
    
  13.   border-radius: 0.25rem;
    
  14.   padding: 0.25rem;
    
  15. }
    
  16. 
    
  17. .Button:hover {
    
  18.   color: var(--color-button-hover);
    
  19. }
    
  20. .Button:active {
    
  21.   color: var(--color-button-focus);
    
  22.   outline: none;
    
  23. }
    
  24. .Button:focus,
    
  25. .ButtonContent:focus {
    
  26.   outline: none;
    
  27. }
    
  28. 
    
  29. .Button:focus > .ButtonContent {
    
  30.   background: var(--color-button-background-focus);
    
  31. }
    
  32. 
    
  33. .Button:disabled,
    
  34. .Button:disabled:active {
    
  35.   background: var(--color-button-background);
    
  36.   color: var(--color-button-disabled);
    
  37.   cursor: default;
    
  38. }