.onboard-asset-style .onboard-asset-library__title,
.onboard-asset-style .onboard-asset-library__card-title,
.onboard-asset.onboard-asset-style .onboard-asset__title {
    color: var(--onboard-asset-title-color, inherit);
    font-size: var(--onboard-asset-title-size, inherit);
    font-weight: var(--onboard-asset-title-weight, inherit);
    text-align: var(--onboard-asset-title-align, inherit);
}

.onboard-asset-style--title-treatment-italic .onboard-asset-library__title,
.onboard-asset-style--title-treatment-italic .onboard-asset-library__card-title,
.onboard-asset-style--title-treatment-italic .onboard-asset__title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset-library__title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset-library__card-title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset__title { font-style: italic; }

.onboard-asset-style--title-treatment-secondary .onboard-asset-library__title,
.onboard-asset-style--title-treatment-secondary .onboard-asset-library__card-title,
.onboard-asset-style--title-treatment-secondary .onboard-asset__title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset-library__title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset-library__card-title,
.onboard-asset-style--title-treatment-secondary-italic .onboard-asset__title {
    font-family: var(--onboard-secondary-font-family, var(--thegem-to-h6-font-family, inherit));
}

.onboard-asset-style .onboard-asset-library__summary,
.onboard-asset-style .onboard-asset-library__meta,
.onboard-asset.onboard-asset-style .onboard-asset__summary,
.onboard-asset.onboard-asset-style .onboard-asset__meta {
    color: var(--onboard-asset-description-color, inherit);
    font-size: var(--onboard-asset-description-size, inherit);
}

.onboard-asset-style--custom-background .onboard-asset-library__card,
.onboard-asset.onboard-asset-style--custom-background { background-color: var(--onboard-asset-card-background); }

.onboard-asset-style--custom-background .onboard-asset-library__card-body { background-color: var(--onboard-asset-card-background); }

.onboard-asset-style--custom-border .onboard-asset-library__card,
.onboard-asset.onboard-asset-style--custom-border {
    border-color: var(--onboard-asset-border-color, currentColor);
    border-style: solid;
    border-width: var(--onboard-asset-border-width, 1px);
}

.onboard-asset-style--custom-radius .onboard-asset-library__card,
.onboard-asset.onboard-asset-style--custom-radius { border-radius: var(--onboard-asset-radius); overflow: hidden; }

.onboard-asset-style--custom-padding .onboard-asset-library__card-body,
.onboard-asset.onboard-asset-style--custom-padding { padding: var(--onboard-asset-padding); }

.onboard-asset-style .onboard-asset-library__grid { gap: var(--onboard-asset-gap, 1.5rem); }

.onboard-asset-style--media-aspect-16-9 { --onboard-asset-media-aspect: 16 / 9; }
.onboard-asset-style--media-aspect-4-3 { --onboard-asset-media-aspect: 4 / 3; }
.onboard-asset-style--media-aspect-1-1 { --onboard-asset-media-aspect: 1 / 1; }
.onboard-asset-style--media-aspect-natural { --onboard-asset-media-aspect: auto; }

.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset-library__embed,
.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset-library__play,
.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset-library__thumbnail,
.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset-library__media,
.onboard-asset.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset__embed,
.onboard-asset.onboard-asset-style[class*="onboard-asset-style--media-aspect-"] .onboard-asset__preview {
    aspect-ratio: var(--onboard-asset-media-aspect);
}

.onboard-asset-style--image-treatment-cover .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-cover .onboard-asset__preview,
.onboard-asset-style--image-treatment-contain .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-contain .onboard-asset__preview { aspect-ratio: inherit; height: 100%; width: 100%; }
.onboard-asset-style--image-treatment-cover .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-cover .onboard-asset__preview { object-fit: cover; }
.onboard-asset-style--image-treatment-contain .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-contain .onboard-asset__preview { object-fit: contain; }
.onboard-asset-style--image-treatment-rounded .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-rounded .onboard-asset__preview { border-radius: 10px; }
.onboard-asset-style--image-treatment-circle .onboard-asset-library__thumbnail,
.onboard-asset-style--image-treatment-circle .onboard-asset__preview { aspect-ratio: 1; border-radius: 50%; object-fit: cover; }

.onboard-asset-action-shell.gem-button-container.gem-button-position-inline { display: inline-block; vertical-align: top; }

:where(.onboard-asset-action.gem-button) {
    align-items: center;
    background-color: var(--thegem-to-button-basic-background-color, var(--thegem-button-basic-background-color, #2f2e40));
    color: var(--thegem-to-button-basic-color, var(--thegem-button-basic-color, #fff));
    display: inline-flex;
    justify-content: center;
    padding: .65em 1em;
    text-decoration: none;
}

:where(.onboard-asset-action.gem-button:hover),
:where(.onboard-asset-action.gem-button:focus-visible) {
    background-color: var(--thegem-to-button-basic-background-color-hover, var(--thegem-button-basic-background-hover-color, #f5cf25));
    color: var(--thegem-to-button-basic-color-hover, var(--thegem-button-basic-hover-color, #2f2e40));
}

.onboard-asset-style--custom-button-background .onboard-asset-action.gem-button { background-color: var(--onboard-asset-button-background) !important; }
.onboard-asset-style--custom-button-color .onboard-asset-action.gem-button { color: var(--onboard-asset-button-color) !important; }
.onboard-asset-style--custom-button-radius .onboard-asset-action.gem-button { border-radius: var(--onboard-asset-button-radius) !important; }

.onboard-asset-style--hover-lift .onboard-asset-library__card,
.onboard-asset.onboard-asset-style--hover-lift,
.onboard-asset-style--hover-scale .onboard-asset-library__card,
.onboard-asset.onboard-asset-style--hover-scale { transition: transform 180ms ease, box-shadow 180ms ease; }
.onboard-asset-style--hover-lift .onboard-asset-library__card:hover,
.onboard-asset.onboard-asset-style--hover-lift:hover { box-shadow: 0 12px 28px rgb(0 0 0 / 14%); transform: translateY(-3px); }
.onboard-asset-style--hover-scale .onboard-asset-library__card:hover,
.onboard-asset.onboard-asset-style--hover-scale:hover { transform: scale(1.015); }
.onboard-asset-style--hover-border .onboard-asset-library__card:hover,
.onboard-asset.onboard-asset-style--hover-border:hover { box-shadow: 0 0 0 2px var(--onboard-asset-border-color, currentColor); }

@media (prefers-reduced-motion: reduce) {
    .onboard-asset-style--hover-lift .onboard-asset-library__card,
    .onboard-asset.onboard-asset-style--hover-lift,
    .onboard-asset-style--hover-scale .onboard-asset-library__card,
    .onboard-asset.onboard-asset-style--hover-scale { transition: none; }
}
