/*!*********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./src/blocks/styleguide/style.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************/
/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
/* --------------------------------

File#: _styleguide
Title: Style Guide

-------------------------------- */
.bsab4s-styleguide {
  border-top: 1px solid var(--bsaweb--color--contrast-lower);
  border-bottom: 1px solid var(--bsaweb--color--contrast-lower);
}

.bsab4s-styleguide__section {
  padding-top: var(--bsaweb--spacing--xl);
  padding-bottom: var(--bsaweb--spacing--xl);
}
.bsab4s-styleguide__section:not(:first-child) {
  border-top: 1px solid var(--bsaweb--color--contrast-lower);
}

.bsab4s-styleguide__subtitle {
  color: var(--bsaweb--color--contrast-medium);
  font-size: 0.875rem;
}

.bsab4s-styleguide__color {
  aspect-ratio: 1/1;
  border: 1px solid var(--bsaweb--color--contrast-lower);
  border-radius: var(--bsaweb--radius--lg);
}

.bsab4s-styleguide__code {
  font-size: 0.75rem;
  color: var(--bsaweb--color--contrast-medium);
}
.bsab4s-styleguide__code code {
  background-color: var(--bsaweb--color--bg-dark);
  font-family: monospace;
  padding: var(--bsaweb--spacing--4-xs) var(--bsaweb--spacing--3-xs);
}
.bsab4s-styleguide__code code::-moz-selection {
  background-color: var(--bsaweb--color--contrast-high);
  color: var(--bsaweb--color--bg);
}
.bsab4s-styleguide__code code::selection {
  background-color: var(--bsaweb--color--contrast-high);
  color: var(--bsaweb--color--bg);
}

.bsab4s-styleguide__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--bsaweb--color--contrast-medium);
}

.bsab4s-styleguide__list-sample {
  line-height: 1;
}

.bsab4s-styleguide__list-item {
  padding-top: var(--bsaweb--spacing--md);
  padding-bottom: var(--bsaweb--spacing--md);
}
.bsab4s-styleguide__list-item:first-child {
  padding-top: 0;
}
.bsab4s-styleguide__list-item:last-child {
  padding-bottom: 0;
}
.bsab4s-styleguide__list-item:not(:first-child) {
  border-top: 1px solid var(--bsaweb--color--contrast-lower);
}

.bsab4s-styleguide__list-placeholder {
  background-color: var(--bsaweb--color--contrast-lower);
  margin-bottom: var(--bsaweb--spacing--4-xs);
}

.bsab4s-styleguide__icon-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  padding: 1rem;
  border: 1px solid var(--bsaweb--color--contrast-lower);
}
.bsab4s-styleguide__icon-wrapper svg {
  width: 1em;
  height: 1em;
  font-size: 32px;
}

/*# sourceMappingURL=style-index.css.map*/