/*
 * CreaBootstrapBlocks — Grundgeometrie der Bloecke.
 *
 * Nachfolger von build/style-index.css des Alt-Plugins (Vertragsregel 4.1).
 * Inhaltlich unveraendert uebernommen, nur um den zweiten Klassensatz erweitert
 * und entminifiziert — das Plugin hat keinen JS/CSS-Build.
 *
 * Beide Klassensaetze stehen nebeneinander (Vertragsregel 2.2): Jeder Block
 * gibt `creabb-*` und `areoi-*` aus, solange die Legacy-Klassen aktiv sind.
 * Themes stylen direkt gegen `.areoi-element` und `.areoi-element.container`.
 *
 * Gemischte Selektoren (`.creabb-element .areoi-background`) gibt es bewusst
 * nicht: Jedes Element traegt entweder beide Klassen oder nur `creabb-*`. Ein
 * gemischter Selektor koennte deshalb nie zusaetzlich treffen.
 *
 * Blockspezifisches CSS gehoert NICHT hierher, sondern nach
 * blocks/<name>/style.css — Blockstudio laedt es bedarfsgerecht.
 */

/* Grundgeometrie ---------------------------------------------------------- */

.creabb-element,
.areoi-element {
    position: relative;
}

.creabb-element > *,
.areoi-element > * {
    position: relative;
}

.creabb-element > .modal,
.creabb-element > .offcanvas,
.creabb-element > .toast,
.creabb-element > .modal-backdrop,
.areoi-element > .modal,
.areoi-element > .offcanvas,
.areoi-element > .toast,
.areoi-element > .modal-backdrop {
    position: fixed;
}

.creabb-element .wp-block-image img,
.areoi-element .wp-block-image img {
    height: auto;
}

/* Hintergrundkonstrukt ---------------------------------------------------- */

.creabb-background,
.areoi-background {
    overflow: hidden;
}

.creabb-background div,
.areoi-background div {
    height: 100%;
}

.creabb-background__image,
.areoi-background__image {
    background-size: cover;
    background-position: center;
}

.creabb-background .col,
.areoi-background .col {
    overflow: hidden;
    position: relative;
}

.creabb-background img,
.creabb-background video,
.areoi-background img,
.areoi-background video {
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -o-object-fit: cover;
    object-fit: cover;
}

.creabb-background,
.creabb-background__image,
.creabb-background__color,
.creabb-background__overlay,
.areoi-background,
.areoi-background__image,
.areoi-background__color,
.areoi-background__overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

/* Ein verschachtelter Block wiederholt weder Muster noch Trenner des Eltern. */

.creabb-element .creabb-element .creabb-background-pattern,
.areoi-element .areoi-element .areoi-background-pattern {
    display: none;
}

.creabb-element .creabb-element .creabb-divider,
.areoi-element .areoi-element .areoi-divider {
    -webkit-mask: none;
    mask: none;
}

/* Vollflaechiger Link ueber einem Block ------------------------------------ */

.creabb-full-link,
.areoi-full-link {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

/* Bootstrap-Korrekturen ---------------------------------------------------- */

.alert .icon,
.list-group-item .icon {
    width: 24px;
    height: auto;
    display: block;
}

.alert :last-child,
.list-group-item :last-child {
    margin-bottom: 0;
}

.carousel {
    width: 100%;
    overflow: hidden;
}

.popover-container {
    display: inline-block;
}

.btn-group div:not(:last-child) .btn {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group div:not(:first-child) .btn {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    margin-left: -1px;
}

.btn-group-vertical div:not(:last-child) .btn {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btn-group-vertical div:not(:first-child) .btn {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.card .wp-block-image {
    margin-bottom: 0;
}

.card-header > :last-child,
.card-footer > :last-child,
.card-body > :last-child,
.modal-header .modal-header-content > :last-child,
.offcanvas-header .offcanvas-header-content > :last-child,
.toast-header .toast-header-content > :last-child,
.toast-body > :last-child {
    margin-bottom: 0;
}

.modal {
    width: 100% !important;
    max-width: 100% !important;
}

.wp-block-separator {
    border-top: none;
    border-bottom: none;
}