.o-ui-popover {
    background-color: var(--o-ui-bg-alias-surface);
    padding: var(--o-ui-sp-4);
    border-radius: var(--o-ui-br-3);
    box-shadow: var(--o-ui-bs-alias-floating);
    /* Must keep a max width. */
    max-width: var(--o-ui-sz-16);
    width: 100%;
    position: relative;
    outline: transparent;
}

/* HEADER | SECTION */
.o-ui-popover-header-section {
    margin-bottom: var(--o-ui-sp-2);
}

/* CONTENT */
.o-ui-popover-content {
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

/* FOOTER | SECTION */
.o-ui-popover-footer-section {
    margin-top: var(--o-ui-sp-4);
    display: grid;
    align-items: center;
    grid-template-columns: max-content auto;
    grid-template-areas: "text button";
}

/* FOOTER | TEXT */
.o-ui-popover-footer {
    grid-area: text;
    margin-right: var(--o-ui-sp-2);
}

/* BUTTONS */
.o-ui-popover-button {
    grid-area: button;
    justify-self: end;
}

.o-ui-popover-button-group {
    grid-area: button;
    justify-self: end;
}

/* DISMISS BUTTON */
.o-ui-popover .o-ui-popover-dismiss-button {
    position: absolute;
    right: var(--o-ui-sp-3);
    top: var(--o-ui-sp-3);
}

/* DISMISSABLE */
.o-ui-popover-dismissable .o-ui-popover-header-section {
    padding-right: var(--o-ui-sp-6);
}