.local-smartbanner {
    --local-smartbanner-gap: .5rem;
    display: contents;
}

.local-smartbanner__group {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    gap: var(--local-smartbanner-gap);
    margin: var(--local-smartbanner-gap);
    z-index: 1035;
}

.local-smartbanner__group--top,
.local-smartbanner__group--bottom {
    clear: both;
    width: calc(100% - (2 * var(--local-smartbanner-gap)));
    min-width: 0;
}

.local-smartbanner__group--top.local-smartbanner__group--edge-start,
.local-smartbanner__group--bottom.local-smartbanner__group--edge-start {
    align-items: flex-start;
}

.local-smartbanner__group--top.local-smartbanner__group--edge-centre,
.local-smartbanner__group--bottom.local-smartbanner__group--edge-centre {
    align-items: center;
}

.local-smartbanner__group--top.local-smartbanner__group--edge-end,
.local-smartbanner__group--bottom.local-smartbanner__group--edge-end {
    align-items: flex-end;
}

.local-smartbanner__group--sticky {
    position: sticky;
    z-index: 1035;
}

.local-smartbanner__group--top.local-smartbanner__group--sticky {
    top: 0;
}

.local-smartbanner__group--bottom.local-smartbanner__group--sticky {
    bottom: 0;
}

.local-smartbanner__group--fixed {
    position: fixed;
    z-index: 1040;
}

.local-smartbanner__group--top.local-smartbanner__group--fixed,
.local-smartbanner__group--bottom.local-smartbanner__group--fixed {
    right: 0;
    left: 0;
    width: 100%;
    margin: 0;
    padding: var(--local-smartbanner-gap);
    background: var(--bs-body-bg, #fff);
    max-height: 25vh;
    overflow: auto;
}

.local-smartbanner__group--top.local-smartbanner__group--sticky,
.local-smartbanner__group--bottom.local-smartbanner__group--sticky {
    margin-right: 0;
    margin-left: 0;
    padding: var(--local-smartbanner-gap);
    width: 100%;
    background: var(--bs-body-bg, #fff);
}

.local-smartbanner__group--left,
.local-smartbanner__group--right {
    width: max-content;
    min-width: 0;
    max-width: calc(100vw - 1rem);
}

.local-smartbanner__group--left.local-smartbanner__group--normal,
.local-smartbanner__group--left.local-smartbanner__group--sticky {
    margin-right: auto;
}

.local-smartbanner__group--right.local-smartbanner__group--normal,
.local-smartbanner__group--right.local-smartbanner__group--sticky {
    margin-left: auto;
}

.local-smartbanner__group--left.local-smartbanner__group--sticky,
.local-smartbanner__group--right.local-smartbanner__group--sticky {
    top: calc(var(--local-smartbanner-navbar-bottom, 0px) + .5rem);
}

.local-smartbanner__group--left.local-smartbanner__group--fixed,
.local-smartbanner__group--right.local-smartbanner__group--fixed {
    padding: var(--local-smartbanner-gap);
    background: var(--bs-body-bg, #fff);
    max-height: calc(100vh - var(--local-smartbanner-navbar-bottom, 0px) - 2rem);
    overflow: auto;
}

.local-smartbanner__group--left.local-smartbanner__group--sticky,
.local-smartbanner__group--right.local-smartbanner__group--sticky {
    padding: var(--local-smartbanner-gap);
    background: var(--bs-body-bg, #fff);
}

.local-smartbanner__banner {
    --local-smartbanner-headline-color: #172b4d;
    --local-smartbanner-body-color: #172b4d;
    --local-smartbanner-background-color: #e7f3ff;
    --local-smartbanner-accent-color: #0d6efd;
    position: relative;
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    color: var(--local-smartbanner-body-color);
    overflow-wrap: break-word;
}

.local-smartbanner__banner--styled {
    border: 1px solid rgba(0, 0, 0, .2);
    border-inline-start-width: .4rem;
    border-inline-start-color: var(--local-smartbanner-accent-color);
    border-radius: .35rem;
    background: var(--local-smartbanner-background-color);
    box-shadow: 0 .125rem .35rem rgba(0, 0, 0, .16);
}

.local-smartbanner__banner--unstyled {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.local-smartbanner__banner--placement-top,
.local-smartbanner__banner--placement-bottom {
    max-width: 100%;
}

.local-smartbanner__banner--placement-top .local-smartbanner__motion-viewport,
.local-smartbanner__banner--placement-bottom .local-smartbanner__motion-viewport {
    min-width: 0;
    flex: 0 1 auto;
}

.local-smartbanner__banner--placement-top .local-smartbanner__content,
.local-smartbanner__banner--placement-bottom .local-smartbanner__content {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .25rem .5rem;
}

.local-smartbanner__motion-viewport {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
}

.local-smartbanner__banner:not([data-smartbanner-movement="none"]) .local-smartbanner__motion-viewport {
    overflow: hidden;
}

.local-smartbanner__banner[data-smartbanner-movement="up"] .local-smartbanner__motion-viewport,
.local-smartbanner__banner[data-smartbanner-movement="down"] .local-smartbanner__motion-viewport {
    max-height: 40vh;
}

.local-smartbanner__motion-track {
    transform: none;
    will-change: auto;
}

.local-smartbanner__banner.local-smartbanner__banner--motion-ready .local-smartbanner__motion-track {
    will-change: transform;
}

.local-smartbanner__motion-control {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin: 0;
    padding: .25rem;
    line-height: 1;
}

.local-smartbanner__motion-control[hidden] {
    display: none;
}

.local-smartbanner__motion-icon {
    display: block;
    width: .8rem;
    height: .8rem;
}

.local-smartbanner__motion-icon[hidden] {
    display: none;
}

.local-smartbanner__motion-icon--pause {
    border-right: .22rem solid currentColor;
    border-left: .22rem solid currentColor;
}

.local-smartbanner__motion-icon--play {
    width: 0;
    height: 0;
    margin-left: .12rem;
    border-top: .42rem solid transparent;
    border-bottom: .42rem solid transparent;
    border-left: .68rem solid currentColor;
}

.local-smartbanner__motion-control:focus-visible {
    outline: .2rem solid currentColor;
    outline-offset: .15rem;
}

.local-smartbanner__interaction {
    flex: 0 0 auto;
    min-width: 2.75rem;
    min-height: 2.75rem;
}

.local-smartbanner__close-icon {
    font-size: 1.5rem;
    line-height: 1;
}

.local-smartbanner__interaction:focus-visible {
    outline: .2rem solid currentColor;
    outline-offset: .15rem;
}

.local-smartbanner__banner--success {
    --local-smartbanner-background-color: #e9f7ef;
    --local-smartbanner-accent-color: #198754;
}

.local-smartbanner__banner--warning,
.local-smartbanner__banner--maintenance {
    --local-smartbanner-background-color: #fff4ce;
    --local-smartbanner-accent-color: #b58105;
}

.local-smartbanner__banner--critical {
    --local-smartbanner-background-color: #f8d7da;
    --local-smartbanner-accent-color: #b02a37;
}

.local-smartbanner__banner--migration {
    --local-smartbanner-background-color: #eee7f8;
    --local-smartbanner-accent-color: #6f42c1;
}

.local-smartbanner__banner--info {
    --local-smartbanner-accent-color: #0d6efd;
}

.local-smartbanner__banner--none,
.local-smartbanner__banner--custom {
    --local-smartbanner-background-color: var(--bs-body-bg, #fff);
    --local-smartbanner-accent-color: var(--bs-border-color, #dee2e6);
}

.local-smartbanner__inner {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .625rem .875rem;
    width: auto;
    min-width: 0;
    max-width: 100%;
}

.local-smartbanner__icon-wrap {
    flex: 0 0 auto;
    line-height: 1.5;
}

.local-smartbanner__icon {
    width: 1.0625rem;
    height: 1.0625rem;
}

.local-smartbanner__content {
    min-width: 0;
    flex: 1 1 auto;
    max-width: 100%;
}

.local-smartbanner__scale-viewport {
    min-width: 0;
    max-width: 100%;
    flex: 1 1 auto;
    overflow: visible;
}

.local-smartbanner__scale-surface {
    transform-origin: top left;
}

.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__scale-viewport {
    overflow: hidden;
}

.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__scale-surface {
    width: max-content;
    max-width: none;
}

.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__content,
.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__message,
.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__message > * {
    max-width: none;
}

.local-smartbanner__banner[data-smartbanner-scale-width="true"] .local-smartbanner__message {
    overflow-wrap: normal;
}

.local-smartbanner__title {
    margin: 0;
    color: var(--local-smartbanner-headline-color);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
}

.local-smartbanner__message {
    color: var(--local-smartbanner-body-color);
    font-size: .875rem;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.local-smartbanner__message img,
.local-smartbanner__message video,
.local-smartbanner__message iframe,
.local-smartbanner__message object,
.local-smartbanner__message embed {
    max-width: 100%;
}

.local-smartbanner__message img,
.local-smartbanner__message video {
    height: auto;
}

.local-smartbanner__message > :last-child {
    margin-bottom: 0;
}

.local-smartbanner__message > * {
    max-width: 100%;
}

.local-smartbanner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .65rem;
}

.local-smartbanner__action-form {
    display: inline;
    margin: 0;
}

.local-smartbanner__banner--placement-top .local-smartbanner__actions,
.local-smartbanner__banner--placement-bottom .local-smartbanner__actions {
    margin-top: 0;
}

.local-smartbanner__banner--padding-compact .local-smartbanner__inner {
    padding: .375rem .625rem;
}

.local-smartbanner__banner--padding-spacious .local-smartbanner__inner {
    padding: 1rem 1.25rem;
}

.local-smartbanner__banner--unstyled .local-smartbanner__inner {
    padding: 0;
}

.local-smartbanner__banner--headline-small .local-smartbanner__title {
    font-size: .875rem;
}

.local-smartbanner__banner--headline-large .local-smartbanner__title {
    font-size: 1.125rem;
}

.local-smartbanner__banner--headline-style-badge .local-smartbanner__title {
    padding: .125rem .4rem;
    border: 1px solid var(--local-smartbanner-accent-color);
    border-radius: .25rem;
}

.local-smartbanner__banner--headline-style-header .local-smartbanner__content {
    align-items: stretch;
    flex-direction: column;
}

.local-smartbanner__banner--headline-style-header .local-smartbanner__title {
    padding-bottom: .25rem;
    border-bottom: .15rem solid var(--local-smartbanner-accent-color);
}

.local-smartbanner__banner--width-auto {
    width: max-content;
    max-width: 100%;
}

.local-smartbanner__banner--width-small {
    width: 16rem;
}

.local-smartbanner__banner--width-medium {
    width: 20rem;
}

.local-smartbanner__banner--width-large {
    width: 24rem;
}

.local-smartbanner__banner--width-full {
    width: 100%;
}

.local-smartbanner__banner--width-custom {
    width: var(--local-smartbanner-custom-width);
    max-width: calc(100vw - 1rem);
}

.local-smartbanner__banner--align-left .local-smartbanner__inner {
    margin-right: auto;
    margin-left: 0;
    text-align: left;
}

.local-smartbanner__banner--align-center .local-smartbanner__inner {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.local-smartbanner__banner--align-right .local-smartbanner__inner {
    margin-right: 0;
    margin-left: auto;
    text-align: right;
}

.local-smartbanner__banner--align-center .local-smartbanner__actions {
    justify-content: center;
}

.local-smartbanner__banner--align-right .local-smartbanner__actions {
    justify-content: flex-end;
}

.local-smartbanner__banner--height-compact .local-smartbanner__motion-viewport {
    max-height: 8rem;
    overflow: auto;
}

.local-smartbanner__banner--height-custom .local-smartbanner__motion-viewport {
    max-height: var(--local-smartbanner-custom-height);
    overflow: auto;
}

.local-smartbanner__action:focus-visible {
    outline: .2rem solid currentColor;
    outline-offset: .15rem;
}

body.local-smartbanner-has-fixed-top #page {
    padding-top: var(--local-smartbanner-fixed-top-space, 0);
}

body.local-smartbanner-has-persistent-top nav.navbar,
body.local-smartbanner-has-persistent-top .navbar.fixed-top,
body.local-smartbanner-has-persistent-top .navbar.sticky-top {
    top: var(--local-smartbanner-persistent-top-space, 0);
}

body.local-smartbanner-has-fixed-bottom #page {
    padding-bottom: var(--local-smartbanner-fixed-bottom-space, 0);
}

body.local-smartbanner-has-fixed-left #page {
    padding-inline-start: var(--local-smartbanner-fixed-left-space, 0);
}

body.local-smartbanner-has-fixed-right #page {
    padding-inline-end: var(--local-smartbanner-fixed-right-space, 0);
}

body.local-smartbanner-has-fixed-bottom .btn-footer-popover {
    bottom: calc(var(--local-smartbanner-fixed-bottom-space, 0px) + .5rem);
}

@media (max-width: 991.98px) {
    .local-smartbanner__group--left,
    .local-smartbanner__group--right {
        position: static;
        float: none;
        width: auto;
        max-height: none;
        margin: .5rem;
        overflow: visible;
    }

    .local-smartbanner__banner--placement-left,
    .local-smartbanner__banner--placement-right {
        width: 100%;
        max-width: 100%;
    }

    body.local-smartbanner-has-fixed-left #page,
    body.local-smartbanner-has-fixed-right #page {
        padding-inline: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .local-smartbanner .local-smartbanner__banner:not([data-smartbanner-movement="none"])
    .local-smartbanner__motion-viewport {
        max-height: none;
        overflow: visible;
    }

    .local-smartbanner .local-smartbanner__banner .local-smartbanner__motion-track {
        transform: none;
        will-change: auto;
    }

    .local-smartbanner .local-smartbanner__banner .local-smartbanner__motion-control {
        display: none;
    }
}

@media print {
    .local-smartbanner__group {
        position: static;
        float: none;
        width: auto;
        max-height: none;
        overflow: visible;
        box-shadow: none;
    }
}
.local-smartbanner__inline-slot {
    display: block;
    width: 100%;
    max-width: 100%;
    list-style: none;
    overflow-x: clip;
    margin-block: .75rem;
}

.local-smartbanner__group--inline,
.local-smartbanner__banner--placement-inline {
    max-width: 100%;
    position: static;
}

.local-smartbanner-overlay-layer {
    position: fixed;
    z-index: 1045;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    padding: 1rem;
    /* stylelint-disable csstree/validator */
    padding-top: max(1rem, env(safe-area-inset-top));
    padding-right: max(1rem, env(safe-area-inset-right));
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
    padding-left: max(1rem, env(safe-area-inset-left));
    /* stylelint-enable csstree/validator */
    pointer-events: none;
    overflow: clip;
    box-sizing: border-box;
}

.local-smartbanner-overlay-surface {
    width: max-content;
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
    pointer-events: auto;
    min-width: 0;
}

.local-smartbanner-overlay-surface--full {
    width: 100%;
}
.local-smartbanner-overlay-surface .local-smartbanner__group {
    position: static;
    inset: auto;
    width: auto;
    max-width: 100%;
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
}

.local-smartbanner-overlay-position-top-left {
    align-items: flex-start;
    justify-content: flex-start;
}
.local-smartbanner-overlay-position-top-centre {
    align-items: flex-start;
    justify-content: center;
}
.local-smartbanner-overlay-position-top-right {
    align-items: flex-start;
    justify-content: flex-end;
}
.local-smartbanner-overlay-position-centre-left {
    align-items: center;
    justify-content: flex-start;
}
.local-smartbanner-overlay-position-centre {
    align-items: center;
    justify-content: center;
}
.local-smartbanner-overlay-position-centre-right {
    align-items: center;
    justify-content: flex-end;
}
.local-smartbanner-overlay-position-bottom-left {
    align-items: flex-end;
    justify-content: flex-start;
}
.local-smartbanner-overlay-position-bottom-centre {
    align-items: flex-end;
    justify-content: center;
}
.local-smartbanner-overlay-position-bottom-right {
    align-items: flex-end;
    justify-content: flex-end;
}

@supports (height: 100dvh) {
    .local-smartbanner-overlay-layer {
        height: 100dvh;
    }
}

.modal-backdrop,
.modal-backdrop.show {
    background: var(--local-smartbanner-active-backdrop, #000);
    opacity: 1;
}

.local-smartbanner__modal--fullscreen .modal-dialog {
    width: 100vw;
    max-width: 100vw;
    min-height: 100vh;
    margin: 0;
}

.local-smartbanner__modal--fullscreen .modal-content {
    min-height: 100vh;
    border: 0;
    border-radius: 0;
    padding: 0;
    /* stylelint-disable csstree/validator */
    padding-top: env(safe-area-inset-top);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    /* stylelint-enable csstree/validator */
}

.local-smartbanner__modal .modal-body {
    overflow: auto;
}

/* A stateful notice has one authoritative close control inside the banner. */
.local-smartbanner__modal--managed-close .modal-header [data-action="hide"] {
    display: none;
}

.local-smartbanner__modal--size-small .modal-dialog {
    max-width: 24rem;
}
.local-smartbanner__modal--size-standard .modal-dialog {
    max-width: 40rem;
}
.local-smartbanner__modal--size-large .modal-dialog {
    max-width: 64rem;
}

@supports (height: 100dvh) {
    .local-smartbanner__modal--fullscreen .modal-dialog,
    .local-smartbanner__modal--fullscreen .modal-content {
        min-height: 100dvh;
    }
}

@media (max-width: 576px) {
    .local-smartbanner-overlay-layer {
        padding: .5rem;
        /* stylelint-disable csstree/validator */
        padding-top: max(.5rem, env(safe-area-inset-top));
        padding-right: max(.5rem, env(safe-area-inset-right));
        padding-bottom: max(.5rem, env(safe-area-inset-bottom));
        padding-left: max(.5rem, env(safe-area-inset-left));
        /* stylelint-enable csstree/validator */
    }

    .local-smartbanner__modal--modal .modal-dialog {
        display: flex;
        align-items: flex-end;
        min-height: 100%;
        margin: 0;
        max-width: none;
    }

    .local-smartbanner__modal--modal .modal-content {
        max-height: 90dvh;
        border-radius: 1rem 1rem 0 0;
        /* stylelint-disable-next-line csstree/validator */
        padding-bottom: env(safe-area-inset-bottom, 0);
    }
}

/* Responsive display ads need a real available width before the Google queue push. */
.local-smartbanner__banner--adsense .local-smartbanner__content {
    display: block;
}

.local-smartbanner__banner--adsense .local-smartbanner__inner {
    box-sizing: border-box;
    width: 100%;
}

.local-smartbanner__banner--adsense .local-smartbanner__motion-viewport,
.local-smartbanner__banner--adsense .local-smartbanner__motion-track {
    width: 100%;
}
