@layer page {
  .document-generator {
    height: 100%;
  }
  .document-generator__main {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .document-generator__preview {
    max-width: 90%;
    max-height: 90%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
  }
  .document-generator img {
    width: 100%;
    height: 100%;
  }
}
@layer controls {
  .document-templates,
  .chapter-templates {
    width: 100%;
    max-width: 90rem;
    margin-inline: auto;
    padding-block: 2em;
    padding-inline: min(3em, 4.5vw);
    padding-inline: min(3em, 4.5cqi);
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
  .document-templates__properties,
  .chapter-templates__properties {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-1, 0.5rem);
  }
  .document-templates__properties > *,
  .chapter-templates__properties > * {
    flex: var(--column-size, 30%) 1 1;
  }
  .document-templates__grid,
  .chapter-templates__grid {
    display: var(--grid-display, grid);
    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
    gap: var(--spacing-3, 1rem);
  }
  .document-templates__template,
  .chapter-templates__template {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-1, 0.5rem);
    padding: 0;
    aspect-ratio: 9/15;
    background: transparent;
  }
  .document-templates__template:hover .document-templates__template-preview,
  .document-templates__template:hover .chapter-templates__template-preview,
  .chapter-templates__template:hover .document-templates__template-preview,
  .chapter-templates__template:hover .chapter-templates__template-preview {
    transform: scale(1.02) translateY(-0.1rem);
  }
  .document-templates__template:focus-visible .document-templates__template-preview, .document-templates__template--selected .document-templates__template-preview,
  .document-templates__template:focus-visible .chapter-templates__template-preview,
  .document-templates__template--selected .chapter-templates__template-preview,
  .chapter-templates__template:focus-visible .document-templates__template-preview,
  .chapter-templates__template--selected .document-templates__template-preview,
  .chapter-templates__template:focus-visible .chapter-templates__template-preview,
  .chapter-templates__template--selected .chapter-templates__template-preview {
    outline: thick solid var(--clr-primary-500, #2b73aa);
  }
  .document-templates__template:focus-visible ~ .document-templates__template--selected .document-templates__template-preview, .document-templates__template--selected:has(~ .document-templates__template:focus-visible,
  ~ .chapter-templates__template:focus-visible) .document-templates__template-preview,
  .document-templates__template:focus-visible ~ .document-templates__template--selected .chapter-templates__template-preview,
  .document-templates__template--selected:has(~ .document-templates__template:focus-visible,
  ~ .chapter-templates__template:focus-visible) .chapter-templates__template-preview,
  .document-templates__template:focus-visible ~ .chapter-templates__template--selected .document-templates__template-preview,
  .chapter-templates__template--selected:has(~ .document-templates__template:focus-visible,
  ~ .chapter-templates__template:focus-visible) .document-templates__template-preview,
  .document-templates__template:focus-visible ~ .chapter-templates__template--selected .chapter-templates__template-preview,
  .chapter-templates__template--selected:has(~ .document-templates__template:focus-visible,
  ~ .chapter-templates__template:focus-visible) .chapter-templates__template-preview,
  .chapter-templates__template:focus-visible ~ .document-templates__template--selected .document-templates__template-preview,
  .chapter-templates__template:focus-visible ~ .document-templates__template--selected .chapter-templates__template-preview,
  .chapter-templates__template:focus-visible ~ .chapter-templates__template--selected .document-templates__template-preview,
  .chapter-templates__template:focus-visible ~ .chapter-templates__template--selected .chapter-templates__template-preview {
    outline: none;
  }
  .document-templates__template-preview,
  .chapter-templates__template-preview {
    flex: 1;
    border-style: var(--border-style, solid);
    border-color: var(--border-color, var(--clr-neutral-100, #f0f0f0));
    border-width: 0;
    border-width: var(--border-width, thin);
    display: block;
    max-width: 100%;
    height: 100%;
    transition: transform var(--transition-fast, 0.3s);
    background-color: #fbfbfb;
    box-shadow: 0 0.25rem 0.5rem hsla(0, 0%, 0%, 0.4);
    pointer-events: none;
    background-image: var(--thumbnail), var(--fallback);
    background-size: 100% 100%;
  }
  .document-templates__template-caption,
  .chapter-templates__template-caption {
    align-self: center;
    height: 3em;
  }
}
@layer page {
  .page-documents-sidebar .sidebar__content {
    padding: var(--spacing-3, 1rem);
  }
  .page-documents-sidebar .e-treegrid .e-gridheader .e-columnheader {
    display: none;
  }
  .page-documents-sidebar .e-detailcell {
    padding-inline-start: 1.25rem;
  }
  .page-documents__floating-buttons {
    position: absolute;
    left: 2rem;
    bottom: 2rem;
  }
  .page-documents__floating-button {
    height: 3em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: white;
    background-color: var(--clr-primary-500, #2b73aa);
    border: 0.2em solid var(--clr-primary-500, #2b73aa);
  }
  .page-documents__floating-button:hover {
    color: var(--clr-primary-500, #2b73aa);
    background-color: white;
    text-decoration: none;
    cursor: pointer;
  }
  .page-documents__floating-button:focus, .page-documents__floating-button.focused, .page-documents__floating-button--focused {
    color: var(--clr-primary-500, #2b73aa);
    background-color: white;
  }
  .page-documents__floating-button:active, .page-documents__floating-button.active, .page-documents__floating-button--active {
    color: var(--clr-primary-500, #2b73aa);
    background-color: var(--clr-neutral-100, #f0f0f0);
  }
  .page-documents__floating-button[disabled], .page-documents__floating-button.disabled, .page-documents__floating-button--disabled {
    color: var(--clr-muted-500, #878f97);
    background-color: var(--clr-neutral-100, #f0f0f0);
    cursor: default;
    pointer-events: none;
  }
  .page-documents__floating-button {
    border-radius: 1.5em;
  }
}
.page-documents-sidebar .eas-grid .e-altrow td {
  background-color: transparent;
}

@layer page {
  .documents-partial__buttons {
    margin-bottom: 1rem;
  }
  .documents-partial__button {
    box-sizing: border-box;
    text-align: inherit;
    cursor: pointer;
    outline: var(--clickable-outline-color, transparent) solid var(--clickable-outline-width, 0.5rem);
    outline-offset: var(--clickable-outline-offset, 0);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: var(--clickable-button-gap-inside, 0.5em);
    text-align: var(--clickable-button-text-align, center);
    min-width: var(--clickable-button-width, 2em);
    min-height: var(--clickable-button-height, 2em);
    border-radius: var(--clickable-button-roundness, 0);
    padding-inline: var(--clickable-button-spacing-inline, 0.7em);
    padding-block: var(--clickable-button-spacing-block, 0.25em);
    border: var(--clickable-button-border-color, transparent) solid var(--clickable-button-border-width, thin);
    color: var(--clickable-button-text-color);
    background-color: var(--clickable-button-background-color);
    transition-property: box-shadow, transform;
    transition-duration: var(--clickable-button-effect-duration);
    box-shadow: 0 0.125rem 0.125rem hsl(0, 0%, 0%, var(--clickable-button-shadow-opacity));
    transform: translateY(var(--clickable-button-effect-offset));
  }
  .documents-partial__button:where(:focus-visible) {
    --clickable-outline-color: var(--clr-primary-500, #2b73aa);
  }
  .documents-partial__button:where([aria-disabled=true]), .documents-partial__button--disabled, .documents-partial__button[disabled] {
    filter: grayscale(100%);
    cursor: default;
  }
  .documents-partial__button:where(:hover) {
    text-decoration: none;
  }
  @layer theme {
    .documents-partial__button {
      --clickable-button-text-color: var(--clr-primary-500, #2b73aa);
      --clickable-button-border-color: transparent;
      --clickable-button-background-color: transparent;
      --clickable-button-shadow-opacity: 0;
    }
  }
  @layer theme {
    .documents-partial__button:where(:hover) {
      --clickable-button-background-color: var(--clr-neutral-100, #f0f0f0);
      --clickable-button-effect-offset: 0;
      --clickable-button-shadow-opacity: 0;
    }
  }
  .documents-partial__documents-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: var(--spacing-1, 0.5rem);
  }
  .documents-partial__document {
    border: none;
    padding-block-end: var(--spacing-3, 1rem);
  }
  .documents-partial__document:where([aria-checked]), .documents-partial__document:where([aria-selected=true]), .documents-partial__document--selected {
    --clickable-outline-color: var(--clr-primary-500, #2b73aa);
    --clickable-outline-width: .25em;
  }
  .documents-partial__document-icon {
    position: absolute;
    top: var(--spacing-1, 0.5rem);
    right: var(--spacing-1, 0.5rem);
    font-size: 250%;
    color: var(--icon-color);
  }
  .documents-partial .lb-card__body::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 10rem;
    height: 10rem;
    background-image: linear-gradient(0deg, var(--clr-primary-500, #2b73aa), transparent);
    rotate: 205deg;
    translate: 3rem -7rem;
  }
  .documents-partial__badge {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 80%;
    line-height: 1;
    vertical-align: baseline;
    border-radius: 0.25rem;
    background-color: var(--clr-primary-500, #2b73aa);
    color: white;
  }
  .documents-partial__document-table {
    width: 100%;
    color: var(--clr-neutral-900, #292929);
  }
  .documents-partial__document-table-value {
    text-align: right;
  }
  .documents-partial .lb-card__header {
    text-align: start;
    line-height: normal;
    letter-spacing: 0.025em;
    color: var(--clr-primary-500, #2b73aa);
    font-size: 1.15rem;
    font-weight: bold;
    text-overflow: ellipsis;
    overflow-x: hidden;
    white-space: nowrap;
    text-decoration: none;
    padding-inline-end: 2.25rem;
  }
  .documents-partial .lb-card__header:last-child {
    margin-block-end: 0;
  }
  .documents-partial .loading-container__content {
    padding: var(--spacing-1, 0.5rem);
  }
}
@layer page {
  .eas-button-wrapper {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
  }
  .eas-button--central {
    font-size: 2.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: white;
    background-color: var(--clr-primary-500, #2b73aa);
    border: 0.2em solid var(--clr-primary-500, #2b73aa);
  }
  .eas-button--central:hover {
    color: var(--clr-primary-500, #2b73aa);
    background-color: white;
    text-decoration: none;
    cursor: pointer;
  }
  .eas-button--central:focus, .eas-button--central.focused, .eas-button--central--focused {
    color: var(--clr-primary-500, #2b73aa);
    background-color: white;
  }
  .eas-button--central:active, .eas-button--central.active, .eas-button--central--active {
    color: var(--clr-primary-500, #2b73aa);
    background-color: var(--clr-neutral-100, #f0f0f0);
  }
  .eas-button--central[disabled], .eas-button--central.disabled, .eas-button--central--disabled {
    color: var(--clr-muted-500, #878f97);
    background-color: var(--clr-neutral-100, #f0f0f0);
    cursor: default;
    pointer-events: none;
  }
  .eas-button--central {
    width: 3em;
    height: 3em;
    border-radius: 1.5em;
    border-width: medium;
  }
}

/*# sourceMappingURL=compound.css.map */
