/* Content Block: Fakten / Zahlen (jsd_elli)
   Scoped Styles: .elli-fakten
   Abhängigkeiten: Bootstrap Container, globale JSD-Elli-Tokens
*/

.elli-fakten {
    padding-block: var(--elli-fakten-section-padding-block, 0.75rem);
}

.elli-fakten__box {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: var(--elli-fakten-gap, 1rem);
    padding: var(--elli-fakten-padding-y, 1.25rem) var(--elli-fakten-padding-x, 1.25rem);
    color: var(--elli-fakten-color, var(--text, #1a1a1a));
    background: var(--elli-fakten-bg, #f6f6f6);
    border: var(--elli-fakten-border-width, 1px) solid var(--elli-fakten-border-color, transparent);
    border-radius: var(--elli-fakten-border-radius, 0.75rem);
}

.elli-fakten--light .elli-fakten__box {
    color: var(--elli-fakten-light-color, #1a1a1a);
    background: var(--elli-fakten-light-bg, #f6f6f6);
    border-color: var(--elli-fakten-light-border-color, transparent);
}

.elli-fakten--dark .elli-fakten__box {
    color: var(--elli-fakten-dark-color, #ffffff);
    background: var(--elli-fakten-dark-bg, #1f2933);
    border-color: var(--elli-fakten-dark-border-color, transparent);
}

.elli-fakten--accent .elli-fakten__box {
    color: var(--elli-fakten-accent-color, #111111);
    background: var(--elli-fakten-accent-bg, #e7f0ff);
    border-color: var(--elli-fakten-accent-border-color, transparent);
}

.elli-fakten--neutral .elli-fakten__box {
    color: var(--elli-fakten-neutral-color, #1a1a1a);
    background: var(--elli-fakten-neutral-bg, #ffffff);
    border-color: var(--elli-fakten-neutral-border-color, #d9dee5);
}

.elli-fakten__icon-wrap {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: var(--elli-fakten-icon-box-size, 3rem);
    block-size: var(--elli-fakten-icon-box-size, 3rem);
    color: currentColor;
}

.elli-fakten__icon {
    display: block;
    inline-size: var(--elli-fakten-icon-size, 2.25rem);
    block-size: var(--elli-fakten-icon-size, 2.25rem);
    object-fit: contain;
}

.elli-fakten__content {
    min-inline-size: 0;
    max-inline-size: var(--elli-fakten-content-measure, 70ch);
    font-family: var(--font-body, inherit);
    font-size: var(--elli-fakten-font-size, 1rem);
    line-height: var(--elli-fakten-line-height, 1.55);
}

.elli-fakten__content > *:first-child {
    margin-block-start: 0;
}

.elli-fakten__content > *:last-child {
    margin-block-end: 0;
}

.elli-fakten__content strong,
.elli-fakten__content b {
    font-weight: var(--fw-bold, 700);
}

.elli-fakten__content a {
    color: currentColor;
    font-weight: var(--fw-bold, 700);
    text-decoration: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

.elli-fakten__content a:hover {
    text-decoration-thickness: 0.125rem;
}

.elli-fakten__content a:focus-visible {
    outline: var(--jsd-elli-focus-ring-width, 3px) solid var(--jsd-elli-focus-ring-color, #000000);
    outline-offset: var(--jsd-elli-focus-ring-offset, 0.1875rem);
    box-shadow: var(--jsd-elli-focus-ring-shadow, 0 0 0 3px #ffffff);
    border-radius: var(--elli-fakten-link-radius, 0.25rem);
}

@media (prefers-reduced-motion: reduce) {
    .elli-fakten,
    .elli-fakten * {
        transition: none !important;
        scroll-behavior: auto !important;
    }
}

@media (max-width: 575.98px) {
    .elli-fakten__box {
        flex-direction: column;
        gap: var(--elli-fakten-gap-sm, 0.75rem);
        padding: var(--elli-fakten-padding-sm-y, 1rem) var(--elli-fakten-padding-sm-x, 1rem);
    }

    .elli-fakten__icon-wrap {
        inline-size: var(--elli-fakten-icon-box-size-sm, 2.5rem);
        block-size: var(--elli-fakten-icon-box-size-sm, 2.5rem);
    }

    .elli-fakten__icon {
        inline-size: var(--elli-fakten-icon-size-sm, 2rem);
        block-size: var(--elli-fakten-icon-size-sm, 2rem);
    }
}

@media (min-width: 768px) {
    .elli-fakten__box {
        gap: var(--elli-fakten-gap-md, 1.25rem);
        padding: var(--elli-fakten-padding-md-y, 1.5rem) var(--elli-fakten-padding-md-x, 1.75rem);
    }

    .elli-fakten__content {
        font-size: var(--elli-fakten-font-size-md, 1.0625rem);
    }
}