@import "https://assets.elements.dev/assets/app/shared/ui-catalog/catalog/style.c38e1d7304920e3.css";

.sheet-demo-fields {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-3);
}

.sheet-demo-log {
  text-align: center;
}

.sheet-demo-sides {
  display:               grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:                   var(--space-2);
}

.sheet-demo-prose {
  margin: 0;
  color:  var(--ink-soft);
}

.sheet-demo-nav {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-1);
}

/* Logs sit on their own line, so a log growing never moves the triggers. */
.sheet-demo-logs {
  display:        flex;
  flex-direction: column;
  align-items:    stretch;
  flex-basis:     100%;
  min-width:      0;
}

/* A form that wraps the body and footer keeps the panel's column layout. */
.sheet-demo-form {
  display:        flex;
  flex-direction: column;
  flex:           1 1 auto;
  min-height:     0;
  gap:            inherit;
}

/* The static paragraph that takes focus on open: focused for the screen
   reader's sake, so it shows no ring. */
.sheet-demo-start:focus {
  outline: none;
}