drupal/core/misc/dialog/off-canvas/css/button.css

/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
/**
 * @file
 * Visual styling for buttons in the off-canvas dialog.
 *
 * @internal
 */
#drupal-off-canvas-wrapper {
  --off-canvas-button-background-color: #777;
  --off-canvas-button-background-color-hover: #999;
  --off-canvas-button-text-color: #f5f5f5;
  --off-canvas-button-text-color-hover: #fff;
  --off-canvas-button-font-size: 0.875rem;
  --off-canvas-button-padding: calc(var(--off-canvas-vertical-spacing-unit) / 2) 1.25rem;
  --off-canvas-button-border-color: transparent;
  --off-canvas-button-border-radius: 20em;
  --off-canvas-button-font-weight: 600;
  --off-canvas-primary-button-background-color: #277abd;
  --off-canvas-primary-button-background-color-hover: #236aaf;
  --off-canvas-primary-button-text-color: #fff;
  --off-canvas-primary-button-text-color-hover: #fff;
}
#drupal-off-canvas-wrapper .button {
  display: inline-block;
  width: 100%;
  height: auto;
  margin: 0 0 0.625rem;
  padding: var(--off-canvas-button-padding);
  cursor: pointer;
  transition: background 0.5s ease;
  text-align: center;
  color: var(--off-canvas-button-text-color);
  border: solid 1px var(--off-canvas-button-border-color);
  border-radius: var(--off-canvas-button-border-radius);
  background: var(--off-canvas-button-background-color);
  font-family: inherit;
  font-size: var(--off-canvas-button-font-size);
  font-weight: var(--off-canvas-button-font-weight);
  line-height: normal;
  -webkit-appearance: none;
  appearance: none;
}
#drupal-off-canvas-wrapper .button:hover,
#drupal-off-canvas-wrapper .button:active {
  z-index: 10;
  -webkit-text-decoration: none;
  text-decoration: none;
  color: var(--off-canvas-button-text-color-hover);
  background-color: var(--off-canvas-button-background-color-hover);
}
#drupal-off-canvas-wrapper .button:disabled,
#drupal-off-canvas-wrapper .button:disabled:active,
#drupal-off-canvas-wrapper .button.is-disabled,
#drupal-off-canvas-wrapper .button.is-disabled:active {
  cursor: default;
  color: #5c5c5c;
  background: #555;
  font-weight: normal;
}
#drupal-off-canvas-wrapper .button--primary {
  margin-top: 0.9375rem;
  color: var(--off-canvas-primary-button-text-color);
  background: var(--off-canvas-primary-button-background-color);
}
#drupal-off-canvas-wrapper .button--primary:hover,
#drupal-off-canvas-wrapper .button--primary:active {
  color: var(--off-canvas-primary-button-text-color-hover);
  background: var(--off-canvas-primary-button-background-color-hover);
}
#drupal-off-canvas-wrapper button.link {
  display: inline;
  transition: color 0.5s ease;
  color: var(--off-canvas-link-color);
  border: 0;
  background: transparent;
  font-size: var(--off-canvas-button-font-size);
}
#drupal-off-canvas-wrapper button.link:hover,
#drupal-off-canvas-wrapper button.link:focus {
  -webkit-text-decoration: none;
  text-decoration: none;
  color: var(--off-canvas-link-color);
}
#drupal-off-canvas-wrapper .button--danger {
  -webkit-text-decoration: none;
  text-decoration: none;
  color: #c72100;
  border-radius: 0;
  font-weight: 400;
}
#drupal-off-canvas-wrapper .button--danger:hover,
#drupal-off-canvas-wrapper .button--danger:focus,
#drupal-off-canvas-wrapper .button--danger:active {
  -webkit-text-decoration: none;
  text-decoration: none;
  color: #ff2a00;
  text-shadow: none;
}
#drupal-off-canvas-wrapper .button--danger:disabled,
#drupal-off-canvas-wrapper .button--danger.is-disabled {
  cursor: default;
  color: #737373;
}
.no-touchevents #drupal-off-canvas-wrapper .button--small {
  padding: 2px 1em;
  font-size: 0.8125rem;
}