@import '_content/ScalePOS.SharedComponents/ScalePOS.SharedComponents.bundle.scp.css';

/* /Pages/DesignSystemGallery.razor.rz.scp.css */
.ds-gallery[b-iiqvku38zo] {
  padding: var(--scale-space-9);
  display: flex;
  flex-direction: column;
  gap: var(--scale-space-10);
  max-width: 960px;
  margin: 0 auto;
  font-family: var(--scale-font-sans);
  color: var(--scale-text);
}

.ds-section[b-iiqvku38zo] {
  display: flex;
  flex-direction: column;
  gap: var(--scale-space-5);
  padding: var(--scale-space-8);
  background: var(--scale-panel);
  border: var(--scale-hairline) solid var(--scale-separator);
  border-radius: var(--scale-radius-card);
}

.ds-section__title[b-iiqvku38zo] {
  margin: 0;
  font-size: var(--scale-type-title-3-size);
  font-weight: var(--scale-type-title-3-weight);
  color: var(--scale-text);
}

.ds-section__note[b-iiqvku38zo] {
  margin: 0;
  font-size: var(--scale-type-subheadline-size);
  color: var(--scale-text-mute);
}

.ds-row[b-iiqvku38zo] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--scale-space-5);
  align-items: center;
}

.ds-row--stack[b-iiqvku38zo] {
  flex-direction: column;
  align-items: stretch;
  max-width: 360px;
}