@import "dxHelpers/text";

:host {
    display: block;
}

dx-card-title:hover {
    --dx-c-card-title-color: var(--dx-g-blue-vibrant-40);
}

dx-formatted-date-time,
.podcast-length {
    /* Push down a little to align with dx-image-and-label */
    margin-top: 3px;
    margin-right: var(--dx-g-spacing-sm);
}

.card-body {
    --dx-c-max-lines: var(--dx-c-body-max-lines, 3);
}

.card-extra-info {
    text-align: start;
}

.card-container {
    border-bottom: 1px solid var(--sds-g-gray-4);
    padding-bottom: var(--dx-g-spacing-xl);
    flex-direction: column;
    gap: var(--dx-g-spacing-smd);
    display: flex;
}

.card-extra-info .authors {
    margin-bottom: var(--dx-g-spacing-smd);
}

.card-extra-info .authors > *:not(:last-child) {
    padding-right: var(--dx-g-spacing-md);
}

.card-extra-info .authors > * {
    display: inline-flex;
}

.card-dot-separator {
    --size: 5px;

    height: var(--size);
    width: var(--size);
    background-color: var(--dx-g-text-label-color);
    border-radius: 100%;
    margin-bottom: 3px;
    display: inline-block;
    margin-right: var(--dx-g-spacing-sm);
}

.card-mobile .card-body {
    --dx-c-max-lines: var(--dx-c-body-max-lines, 2);
}