[data-component-id="every:button"] {
  --every-layout-pattern-button--background-color: transparent;
  --every-layout-pattern-button--border-color: var(--every-color--text, black);
  --every-layout-pattern-button--border-width: 2px;
  --every-layout-pattern-button--border-radius: var(--every-input--border-radius, 0);
  --every-layout-pattern-button--color: var(--typography-color-text);
  background-color: var(--every-layout-pattern-button--background-color);
  border: var(--every-layout-pattern-button--border-width) solid var(--every-layout-pattern-button--border-color);
  border-radius: var(--every-layout-pattern-button--border-radius);
  color: var(--every-layout-pattern-button--color);
}
[data-component-id="every:button"] {
  /** Every: layout.primitive.box container */
  padding: var(--every-layout-primitive-box-padding, var(--s0, 0));
}

[data-component-id="every:button"]:hover {
  --every-layout-pattern-button--border-color: var(--typography-color-text);
}
[data-component-id="every:button"]:hover:not(:focus) {
  --every-layout-pattern-button--box-shadow-blur: var(--s-6);
  --every-layout-pattern-button--box-shadow-color: var(--every-color--text);
  box-shadow: 0 0 var(--every-layout-pattern-button--box-shadow-blur) var(--every-layout-pattern-button--box-shadow-color);
}
[data-component-id="every:button"]:focus {
  --every-layout-pattern-button--box-shadow-blur: var(--s-4);
  box-shadow: inset 0 0 var(--every-layout-pattern-button--box-shadow-blur) var(--every-layout-pattern-button--box-shadow-color) !important;
}