#rt-floating-bars.rtfb {
    position: fixed;
    z-index: var(--rtfb-z-index, 999999);
    bottom: max(var(--rtfb-offset-y, 120px), env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    gap: var(--rtfb-gap, 10px);
    pointer-events: none;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

#rt-floating-bars.rtfb--position-right {
    right: 0;
    align-items: flex-end;
}

#rt-floating-bars.rtfb--position-left {
    left: 0;
    align-items: flex-start;
}

#rt-floating-bars .rtfb__bar {
    --rtfb-bg: #006ab5;
    --rtfb-text: #ffffff;
    --rtfb-icon: #ffffff;
    --rtfb-justify: center;
    --rtfb-gap: 10px;
    --rtfb-line-height: 1.2;
    --rtfb-icon-size: 22px;
    --rtfb-icon-outer-width: 22px;
    --rtfb-visible-left-width: calc(var(--rtfb-padding-left, 16px) + var(--rtfb-icon-outer-width, 22px));
    --rtfb-visible-right-width: calc(var(--rtfb-padding-right, 16px) + var(--rtfb-icon-outer-width, 22px));
    --rtfb-icon-padding: 0 0 0 0;
    --rtfb-icon-padding-top: 0px;
    --rtfb-icon-padding-right: 0px;
    --rtfb-icon-padding-bottom: 0px;
    --rtfb-icon-padding-left: 0px;
    --rtfb-text-padding: 0 0 0 0;
    --rtfb-text-padding-top: 0px;
    --rtfb-text-padding-right: 0px;
    --rtfb-text-padding-bottom: 0px;
    --rtfb-text-padding-left: 0px;
    --rtfb-text-margin: 0 0 0 0;
    --rtfb-text-margin-top: 0px;
    --rtfb-text-margin-right: 0px;
    --rtfb-text-margin-bottom: 0px;
    --rtfb-text-margin-left: 0px;
    --rtfb-padding: 0 16px 0 16px;
    --rtfb-padding-top: 0px;
    --rtfb-padding-right: 16px;
    --rtfb-padding-bottom: 0px;
    --rtfb-padding-left: 16px;
    --rtfb-icon-margin: 0 0 0 0;
    --rtfb-icon-margin-top: 0px;
    --rtfb-icon-margin-right: 0px;
    --rtfb-icon-margin-bottom: 0px;
    --rtfb-icon-margin-left: 0px;
    --rtfb-border-width: 0 0 0 0;
    --rtfb-border-color: transparent;
    --rtfb-radius: 999px 0 0 999px;
    --rtfb-font-family: inherit;
    --rtfb-font-size: 14px;
    --rtfb-font-weight: 700;
    --rtfb-shadow: 0 4px 16px 0 rgba(0,0,0,.22);

    display: inline-flex;
    align-items: center;
    justify-content: var(--rtfb-justify);
    width: max-content;
    max-width: min(420px, 100vw);
    min-width: calc(var(--rtfb-size, 56px) + var(--rtfb-padding-left, 16px) + var(--rtfb-padding-right, 16px));
    min-height: calc(var(--rtfb-size, 56px) + var(--rtfb-padding-top, 0px) + var(--rtfb-padding-bottom, 0px));
    gap: 0 !important;
    column-gap: 0 !important;
    overflow: hidden;
    padding: var(--rtfb-padding) !important;
    padding-top: var(--rtfb-padding-top) !important;
    padding-right: var(--rtfb-padding-right) !important;
    padding-bottom: var(--rtfb-padding-bottom) !important;
    padding-left: var(--rtfb-padding-left) !important;
    border-style: solid !important;
    border-width: var(--rtfb-border-width) !important;
    border-color: var(--rtfb-border-color) !important;
    border-radius: var(--rtfb-radius) !important;
    background: var(--rtfb-bg) !important;
    color: var(--rtfb-text) !important;
    box-shadow: var(--rtfb-shadow) !important;
    box-sizing: border-box;
    line-height: 1;
    text-decoration: none !important;
    pointer-events: auto;
    transition:
        transform var(--rtfb-duration, 240ms) var(--rtfb-easing, ease),
        opacity var(--rtfb-duration, 240ms) var(--rtfb-easing, ease),
        max-width var(--rtfb-duration, 240ms) var(--rtfb-easing, ease),
        filter .18s ease;
}

#rt-floating-bars .rtfb__bar:hover,
#rt-floating-bars .rtfb__bar:focus-visible {
    color: var(--rtfb-text) !important;
    text-decoration: none !important;
    filter: brightness(.96);
}

#rt-floating-bars .rtfb__bar:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 4px;
}

#rt-floating-bars .rtfb__bar--icon-left {
    flex-direction: row;
}

#rt-floating-bars .rtfb__bar--icon-right {
    flex-direction: row-reverse;
}

#rt-floating-bars .rtfb__bar--align-left {
    text-align: left;
}

#rt-floating-bars .rtfb__bar--align-center {
    text-align: center;
}

#rt-floating-bars .rtfb__bar--align-right {
    text-align: right;
}

#rt-floating-bars .rtfb__icon-wrap {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto !important;
    color: var(--rtfb-icon) !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

#rt-floating-bars .rtfb__icon {
    width: var(--rtfb-icon-size) !important;
    height: var(--rtfb-icon-size) !important;
    display: block;
    fill: currentColor !important;
    box-sizing: content-box;
    padding: var(--rtfb-icon-padding) !important;
    padding-top: var(--rtfb-icon-padding-top) !important;
    padding-right: var(--rtfb-icon-padding-right) !important;
    padding-bottom: var(--rtfb-icon-padding-bottom) !important;
    padding-left: var(--rtfb-icon-padding-left) !important;
    margin: var(--rtfb-icon-margin) !important;
    margin-top: var(--rtfb-icon-margin-top) !important;
    margin-right: var(--rtfb-icon-margin-right) !important;
    margin-bottom: var(--rtfb-icon-margin-bottom) !important;
    margin-left: var(--rtfb-icon-margin-left) !important;
}

#rt-floating-bars .rtfb__label {
    color: var(--rtfb-text) !important;
    font-family: var(--rtfb-font-family);
    font-size: var(--rtfb-font-size);
    font-weight: var(--rtfb-font-weight);
    line-height: var(--rtfb-line-height) !important;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: var(--rtfb-text-padding) !important;
    padding-top: var(--rtfb-text-padding-top) !important;
    padding-right: var(--rtfb-text-padding-right) !important;
    padding-bottom: var(--rtfb-text-padding-bottom) !important;
    padding-left: var(--rtfb-text-padding-left) !important;
    margin: var(--rtfb-text-margin) !important;
    margin-top: var(--rtfb-text-margin-top) !important;
    margin-right: var(--rtfb-text-margin-right) !important;
    margin-bottom: var(--rtfb-text-margin-bottom) !important;
    margin-left: var(--rtfb-text-margin-left) !important;
}

#rt-floating-bars .rtfb__bar--icon-left .rtfb__label {
    margin-left: calc(var(--rtfb-text-margin-left) + var(--rtfb-gap)) !important;
}

#rt-floating-bars .rtfb__bar--icon-right .rtfb__label {
    margin-right: calc(var(--rtfb-text-margin-right) + var(--rtfb-gap)) !important;
}

/* sichtbar bleibt nur der Iconbereich */
#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-left {
    transform: translateX(calc(100% - var(--rtfb-visible-left-width)));
}

#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-right {
    transform: translateX(calc(-100% + var(--rtfb-visible-right-width)));
}

#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-left:hover,
#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-left:focus-visible,
#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-right:hover,
#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-right:focus-visible {
    transform: translateX(0);
}

/* Icon steht außen: max-width öffnet den Balken */
#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-right,
#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-left {
    max-width: calc(var(--rtfb-padding-left, 16px) + var(--rtfb-padding-right, 16px) + var(--rtfb-icon-outer-width, 22px));
}

#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-right:hover,
#rt-floating-bars.rtfb--position-right .rtfb__bar--icon-right:focus-visible,
#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-left:hover,
#rt-floating-bars.rtfb--position-left .rtfb__bar--icon-left:focus-visible {
    max-width: min(420px, 100vw);
}

#rt-floating-bars.rtfb--effect-fade .rtfb__bar {
    transition-property: opacity, filter;
}

#rt-floating-bars.rtfb--effect-grow .rtfb__bar {
    transition-property: max-width, transform, opacity, filter;
}

#rt-floating-bars.rtfb--effect-none .rtfb__bar {
    transition: none !important;
}

@media (max-width: 767px) {
    #rt-floating-bars.rtfb--hide-mobile {
        display: none;
    }

    #rt-floating-bars.rtfb {
        --rtfb-size: min(var(--rtfb-size, 56px), 52px);
        --rtfb-offset-y: min(var(--rtfb-offset-y, 120px), 16px);
    }
}

@media (prefers-reduced-motion: reduce) {
    #rt-floating-bars,
    #rt-floating-bars * {
        transition: none !important;
        animation: none !important;
    }
}