/* Variables */
:root {
    --main-bg-color: #EFF1F7;
    --main-accent-color: #F5A623;
    --main-secondary-color: #D0021B;
}

/* Site Layout/Structure */
body,
html {
    background: var(--main-bg-color);
}

nav.navbar {
    border-top: 4px solid var(--main-accent-color);
}

.navbar-nav .nav-link.active {
    background-color: var(--main-accent-color);
    color: #000 !important;
}

.site__wrapper {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

.site__navigation { margin-bottom: 1rem; }

.site__content {
    display: flex;
    flex: 1;
    padding: 0 .75rem;
    width: 100%;
}

.site__content__body {
    width: 100%;
}

.site__footer {
    margin-top: 1rem;
    padding: .5rem;
}

.topbar-divider {
    width: 0;
    border-right: 1px solid #E3E6F0;
    height: calc(4.375rem - 2rem);
    margin: auto 1rem;
}

/* Search Explorer */
.searchExplorer__wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.searchExplorer__header {

}

.searchExplorer__content {
    display: flex;
    flex: 1;
    flex-direction: row;
    width: 100%;
}

.searchExplorer__content__sidebar {
    /*margin-right: 1rem;*/
/*    min-width: 300px;
    width: 20%;*/
}

.searchExplorer__content__body {
    display: flex;
    flex-grow: 1;
}

/* Toast Notifications */
.toast-container {
    position: absolute;
    top: 1rem;
    right: .5rem;
}

.toast.toast-success,
.toast.toast-success .toast-header { 
    border-color: #00AC69;
}
    .toast.toast-success .toast-header {
        background-color: #D1E7DD;
        color: #00AC69;
    }

.toast.toast-info,
.toast.toast-info .toast-header {
    border-color: #00CFD5;
}
.toast.toast-info .toast-header {
    background-color: #CFF4FC;
    color: #00CFD5;
}

.toast.toast-warning,
.toast.toast-warning .toast-header {
    border-color: #F4A100;
}
    .toast.toast-warning .toast-header {
        background-color: #FFF3CD;
        color: #F4A100;
    }

.toast.toast-danger,
.toast.toast-danger .toast-header {
    border-color: #E81500;
}
    .toast.toast-danger .toast-header {
        background-color: #F8D7DA;
        color: #E81500;
    }

.validation-summary-errors ul {
    margin-bottom: 0;
}

.btn.btn-shadow {
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
}
.btn.btn-shadow:hover {
    box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);
}

.btn.btn-circle {
    border-radius: 15px;
    font-size: 12px;
    height: 30px;
    line-height: 1.4;
    padding: 0;
    text-align: center;
    width: 30px;
}
.btn.btn-circle.btn-lg {
    border-radius: 25px;
    font-size: 20px;
    height: 50px;
    line-height: 1.33;
    width: 50px;
}

a[hx-get]:not([href]) { color: #0D6EFD; cursor: pointer; }
a[hx-get]:not([href]):hover { color: #0A58CA; }

/* Divider */
.divider {
    position: relative;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    color: #7A7A7A;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .5px;
    margin: 25px 0;
}

    .divider:after,
    .divider:before {
        content: "";
        display: block;
        flex: 1;
        height: 1px;
        background-color: #DBDBDB;
    }

    .divider:not(.is-left)::before {
        margin-right: 10px;
    }

    .divider:not(.is-right)::after {
        margin-left: 10px;
    }

    .divider.is-vertical {
        flex-direction: column;
        margin: 0 25px;
    }

    .divider:not(:empty).is-vertical::before {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .divider.is-vertical::after,
    .divider.is-vertical::before {
        height: auto;
        width: 1px;
    }

    .divider.is-info::after,
    .divider.is-info::before {
        background-color: #3298DC;
    }

    .divider.is-success::after,
    .divider.is-success::before {
        background-color: #48C774;
    }

    .divider.is-warning::after,
    .divider.is-warning::before {
        background-color: #FFDD57;
    }

    .divider.is-danger::after,
    .divider.is-danger::before {
        background-color: #F14668;
    }

    .divider.is-branded::after,
    .divider.is-branded::before {
        background-color: var(--main-accent-color);
    }

/* dbExplorer Styles */
#dbExplorer__DetailsPanel {
    background-color: #D7D7D7;
    border-top: 2px solid var(--main-accent-color);
    height: 45vh;
    transition: height .3s ease-in-out, transform .3s ease-in-out;
}

body.offcanvas-max #dbExplorer__DetailsPanel.show { height: 75vh; transition: height .3s ease-in-out; }
body.offcanvas-max #dbExplorer__DetailsPanel { height: 0; }

#dbExplorer__DetailsPanel__Body {
    display: flex;
    flex: 1;
    flex-direction: column;
    max-height: 100%;
}
#dbExplorer__DetailsPanel__Body .offcanvas-header { padding: .5rem 1rem; }

.dbObjects__Table tbody > *[data-details] { cursor: pointer; }
.dbObjects__Table tbody > tr:hover > * { background-color: rgba(0, 0, 0, 0.075); color: #212529; }
.dbObjects__Table table td[data-details] { color: #0D6EFD; text-decoration: underline; }

table.table tbody *[data-details] { cursor: pointer; }
table.table td[data-details] span {
    color: #0D6EFD;
    text-decoration: underline;
}

/* Box Styles */
.box {
    background-color: #FFFFFF;
    border-radius: 6px;
    box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
    color: #4A4A4A;
    display: block;
    padding: 1.25rem;
}

.box:not(:last-child) { margin-bottom: 1.5rem; }

/* Panel Styles */
.panel {
    position: relative;
    border-radius: .25rem;
    background: #FFF;
    border-width: 3px 1px 1px 1px;
    border-style: solid;
    border-color: #D2D6DE;
    margin-bottom: 20px;
    width: 100%;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
}

.panel.is-primary {
    border-top-color: var(--main-accent-color);
}
.panel.is-danger {
    border-top-color: #DD4B39;
}


.panel-header {
    border-bottom: 1px solid #D2D6DE;
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
}

.panel-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
}

.panel-footer {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top: 1px solid #D2D6DE;
    padding: 10px;
    background-color: #FFF;
}

.panel-footer:last-child {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.panel-header::before, .panel-body::before, .panel-footer::before,
.panel-header::after, .panel-body::after, .panel-footer:after {
    content: " ";
    display: table;
}

/* Hero Styles */
.hero {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hero-body {
    flex-grow: 1;
    flex-shrink: 0;
    padding: 3rem 1.5rem;
}

.hero.is-hero-bar { border-bottom: 1px solid rgba(24, 28, 33, 0.06); }
.hero.is-hero-bar .hero-body { padding: 1.5rem; }

/* Menu-List Styles */
.menu-list { line-height: 1.25; }

.menu-list a { 
    border-radius: 2px;
    color: #4A4A4A;
    display: block;
    padding: .5em .75em;
}

.menu-list a:hover {
    background-color: #F5F5F5;
    color: #363636;
}

.menu-list a.active {
    background-color: var(--main-accent-color);
    color: #000;
}

.menu-list a.is-disabled {
    color: #6C757D;
    opacity: .275;
    pointer-events: none;
    cursor: default;
}

/* Misc */
input:-webkit-autofill {
    background-color: transparent;
    transition: background-color 600000s 0s, color 600000s 0s;
}

.input-group input:focus,
.input-group select:focus {
    border-color: rgb(206, 212, 218);
    box-shadow: none;
}

.card-raised {
    border: none;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.progress.progress-dark {
    background-color: #CCC;
    border: 1px solid #AAA;
}

.scroll-to-top {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    display: none;
    width: 2.75rem;
    height: 2.75rem;
    text-align: center;
    color: #FFF;
    background: rgba(90, 92, 105, .5);
    line-height: 46px;
}

select[data-url] {
    min-width: 100px;
}

/* Loading Animations */
#dbObjectDetails__Indicator.htmx-request::before,
.site__content__body.htmx-request::before,
.offcanvas-body.htmx-request::before {
    animation: progress 1.5s infinite ease-in-out;
    background: var(--main-accent-color);
    content: '';
    height: 2px;
    position: absolute;
    z-index: 1000;
    margin-top: -1rem;
}

#queryBuilder__ModalBody.htmx-request::before {
    animation: progress 1.5s infinite ease-in-out;
    background: var(--main-accent-color);
    content: '';
    height: 2px;
    position: absolute;
    z-index: 1000;
    margin-top: -1rem;
}

select[data-url],
select[data-url] + label { 
    opacity: 1; 
    transition: opacity 1s ease-out; 
}

select[data-url].ces-ajax-beforeLoad,
select[data-url].ces-ajax-beforeLoad + label {
    opacity: 0;
}

.htmx-request .htmx-indicator { display: inline; }
.htmx-indicator { display: none; }

.card.loading::after {
    animation: progress 1.5s infinite ease-in-out;
    background: var(--main-accent-color);
    content: '';
    height: 2px;
    position: absolute;
    z-index: 1000;
}

@keyframes progress {
    0% { left: 0; width: 0; }
    50% { width: 100%; }
    100% { right: 0; width: 0; }
}

/* Page Navigation */
.page-navigation {
    align-items: stretch;
    display: flex;
    font-size: 1rem;
    justify-content: space-between;
    overflow: hidden;
    overflow-x: auto;
    white-space: nowrap;
}

.page-navigation.is-centered ul { justify-content: center; }
.page-navigation.is-spaced ul { justify-content: space-between; }
.page-navigation.is-start ul { justify-content: start; }

.page-navigation ul { 
    align-items: center;
    border-bottom: none;
    display: flex;
    flex-grow: 1;
    flex-shrink: 0;
    justify-content: flex-start;
    list-style: none;
    margin-bottom: 0;
    padding: 0;
}

.page-navigation li { border-bottom: 3px solid transparent; }

.page-navigation li.active {
    border-bottom-color: var(--main-secondary-color);
    border-bottom-style: solid;
    border-bottom-width: 3px;
}

.page-navigation li.active a {
    color: var(--main-secondary-color);
    font-weight: 600;
    pointer-events: none;
}

.page-navigation li.disabled { opacity: .275; }

.page-navigation a { color: #000; }
.page-navigation span { color: #6C757D; }

.page-navigation a.has-icon {
    padding: .75em 2em .5em;
}

.page-navigation a,
.page-navigation span {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: -4px;
    padding: 1.5em 2em;
    text-decoration: none;
    vertical-align: top;
}

.page-navigation a:hover {
    border-bottom-color: #363636;
    color: #363636;
}

.page-navigation .icon-wrapper {
    display: block;

}

.page-navigation .icon-wrapper i {
    font-size: 1.7rem;
}

/* Custom Colors */
.text-burnt-orange { color: #CC5500; }

/* Table - Fixed Head */
table.table-head-fixed thead tr:nth-child(1) th {
    background-color: #FFF;
    box-shadow: inset 0 2px 0 #dee2e6,inset 0 -1px 0 #dee2e6;
    position: sticky;
    top: 0;
    z-index: 10;
}

table.table-fixed thead tr:nth-child(1) th,
table.table-fixed thead tr:nth-child(1) td,
table.table-fixed tfoot tr:nth-child(1) td {
    background-color: #FFF;
    position: sticky;
    z-index: 10;
}

table.table-fixed thead th,
table.table-fixed thead td {
    box-shadow: inset 0 -1px 0 #dee2e6;
    top: 0;
}

table.table-fixed tfoot td {
    box-shadow: inset 0 1px 0 #dee2e6;
    bottom: -1px;
}

table.table-fixed tr th:first-child,
table.table-fixed tr td:first-child {
    padding-left: 1rem;
}

table.table-fixed tr th:last-child,
table.table-fixed tr td:last-child {
    padding-right: 1rem;
}

/* Table Navigation */
.table>tbody>tr[data-href]:hover>* { background-color: rgba(0, 0, 0, 0.075); color: #212529; }
.table>tbody>tr[data-href]>td { cursor: pointer; }

/* Media Styles */
.media {
    align-items: flex-start;
    display: flex;
    text-align: inherit;
}

.media-content {
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    text-align: inherit;
}

.media .content:not(:last-child) {
    margin-bottom: 0.75rem;
}

.media+.media {
    border-top: 1px solid rgba(219, 219, 219, .5);
    margin-top: 1rem;
    padding-top: 1rem;
}

/* Glossary */
.glossary-term { box-shadow: 0 2px 6px 0 rgb(0 0 0 / 20%); }
.glossary-term.box { padding: 0.75rem; }

.glossary-term .glossary-header { display: flex;}
.glossary-term .glossary-body { padding: .5rem 0; }
.glossary-term .glossary-footer { display: flex; }

.glossary-term .glossary-description { 
    border-color: #DBDBDB;
    border-radius: 4px;
    border-style: solid;
    border-width: 0 0 0 4px;
    color: #4A4A4A;
    margin-bottom: 1.25rem;
    padding: 1.25em 1.5em;
}

.glossary-term .glossary-use {
    background: linear-gradient(-30deg, #273149, #1C273F);
    border-radius: 0.25rem;
    padding: 0.75rem 1.25rem;
}
.glossary-term .glossary-use:not(:last-child) {
    margin-bottom: 1.25rem;
}
.glossary-tags {
    display: flex;
    justify-content: space-between;
}

.box,
.card,
.card-body,
.modal-content {
    opacity: 1;
    transition: opacity 1s ease-out;
}
*.htmx-added {
    opacity: 0;
}

*.htmx-swapping {
    opacity: 0;
    transition: opacity 1s ease-out;
}
*.htmx-settling {
    opacity: 0;
    transition: opacity 1s ease-out;
}

/* Buttons */
.buttons {
    align-items: center;
    display: flex;
    /*flex-wrap: wrap;*/
    justify-content: flex-start;
}

.buttons:last-child {
    margin-bottom: -0.5rem;
}

.buttons .button:not(:last-child) {
    margin-right: 0.5rem;
}

.buttons .button {
    margin-bottom: 0.5rem;
}

.buttons.are-small { border-radius: 2px; font-size: .75rem; }

.button {
    background-color: #FFF;
    border-color: transparent;
    border-radius: 3px;
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
    color: #363636;
    cursor: pointer;
    justify-content: center;
    text-transform: uppercase;
    font-weight: 500;
    text-align: center;
    transition: box-shadow 280ms cubic-bezier(.4,0,.2,1),background-color 300ms ease;
    position: relative;
    overflow: hidden;
    padding-bottom: calc(0.5em - 1px);
    padding-left: 1em;
    padding-right: 1em;
    padding-top: calc(0.5em - 1px);
    transform: translate3d(0,0,0);
    white-space: nowrap;
}

.button {
    height: 2.5em;
}

    .button::before {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        pointer-events: none;
        background-image: radial-gradient(circle,#000 10%,transparent 10.01%);
        background-repeat: no-repeat;
        background-position: 50%;
        transform: scale(10,10);
        opacity: 0;
        transition: transform .5s, opacity 1s;
    }

    a.button {
        text-decoration: none;
    }

/* Accordion Icon */
.accordion-icon {
    color: #212529;
    display: flex;
}
    .accordion-icon::after {
        flex-shrink: 0;
        width: 1.25rem;
        height: 1.25rem;
        margin-left: auto;
        margin-right: auto;
        content: "";
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-size: 1.25rem;
        transition: transform .2s ease-in-out;
    }

.accordion-icon:not(.collapsed) {

}

    .accordion-icon:not(.collapsed)::after {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
        transform: rotate(-180deg);
    }

/* Window Size Icons */
.offcanvas-header .btn-window-toggle {
    padding: 0.5rem 0.5rem;
    margin-top: -0.5rem;
    margin-right: -0.5rem;
    margin-bottom: -0.5rem;
}

.btn-window-toggle {
    background: transparent url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3C%21--%21%20Font%20Awesome%20Pro%206.1.1%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%20%28Commercial%20License%29%20Copyright%202022%20Fonticons%2C%20Inc.%20--%3E%3Cpath%20d%3D%22M448%2032C483.3%2032%20512%2060.65%20512%2096V416C512%20451.3%20483.3%20480%20448%20480H64C28.65%20480%200%20451.3%200%20416V96C0%2060.65%2028.65%2032%2064%2032H448zM96%2096C78.33%2096%2064%20110.3%2064%20128C64%20145.7%2078.33%20160%2096%20160H416C433.7%20160%20448%20145.7%20448%20128C448%20110.3%20433.7%2096%20416%2096H96z%22%2F%3E%3C%2Fsvg%3E) center/1.2em no-repeat;
    border: 0;
    border-radius: 0.25rem;
    box-sizing: content-box;
    color: #000;
    height: 1em;
    opacity: .5;
    padding: 0.25em 0.25em;
    width: 1em;
}

    .btn-window-toggle:hover {
        color: #000;
        text-decoration: none;
        opacity: .75;
    }

body.offcanvas-max .btn-window-toggle {
    background: transparent url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3C%21--%21%20Font%20Awesome%20Pro%206.1.1%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%20%28Commercial%20License%29%20Copyright%202022%20Fonticons%2C%20Inc.%20--%3E%3Cpath%20d%3D%22M0%20448C0%20430.3%2014.33%20416%2032%20416H480C497.7%20416%20512%20430.3%20512%20448C512%20465.7%20497.7%20480%20480%20480H32C14.33%20480%200%20465.7%200%20448z%22%2F%3E%3C%2Fsvg%3E) center/1.2em no-repeat;
}

/* Tree */
.tree {
    background: #FFFFFF;
    padding: 1rem;
    border: 1px solid #D7D7D7;
    border-radius: .25rem;
    box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02); 
    margin-top: .5rem;
}

.tree ul {
    list-style: none;
    padding-left: 0;
}

.tree ul:not(:last-child) {
    margin-bottom: 0;
}

.tree-list {
    line-height: 1.25;
}

.tree-list a {
    color: #4A4A4A;
    display: block;
    padding: 0 1rem;
    text-decoration: none;
}

.tree-list-item {
    padding: .5rem;
}

.tree-list .is-active {
    background-color: #BADCE3;
    border-radius: .25rem;
    color: #000;
    font-weight: 600;
}

.tree-list li ul {
    margin: 0 0 0 0.75em;
    padding-left: 2rem;
}

/* Scrollbars */
:not(code)::-webkit-scrollbar {
    height: 9px;
    width: 9px;
}

:not(code)::-webkit-scrollbar-track {
    background: transparent;
}

:not(code)::-webkit-scrollbar-thumb {
    background-color: rgba(155, 155, 155, .5);
    border: transparent;
    border-radius: 20px;
}

/* Card Column */
.card-column {
    display: flex;
    flex-direction: column;
}

.card-column {
    flex-grow: 1;
    height: 100%;
}

.card-column > .card {
    flex: 1;
    min-height: 2.4rem;
}

.card-column > .card:not(:last-of-type) {
    margin-bottom: 1.5rem;
}

.card-column > .card.collapsed {
    flex-grow: 0;
}

.card-column > .card.collapsed > .card-body {
    display: none;
}

.criteria-count {
    display: none;
}

.card-column > .card.collapsed .criteria-count {
    display: block;
}

/* Scrollable Card */
.card.card-scrollable { overflow: hidden; }
.card.card-scrollable > .card-header { flex-grow: 0; }
.card.card-scrollable > .card-body { flex-grow: 1; overflow-y: auto; }

/* Sortable */
.sortable-ghost {
    opacity: 0.4;
}

.sortable-chosen {
    color: #000;
    background-color: #CFE2FF;
}

/* Form Horizontal */
.form-horizontal .form-floating:not(:last-child) { margin-right: 0.25rem; }

/* Form Styles */
.form-label {
    font-weight: 500;
}

/* Colors */
.text-bg-lightGrey {
    background-color: #F1F3F4;
    color: #80868B;
}

/* Diagram */
.diagram {
    --diagram-border-color: #D7D7D7;
    min-height: 50px;
    overflow-y: auto;
    position: relative;
}

.diagram-label {
    display: block;
    min-width: 150px;
    padding: 5px 10px;
    line-height: 20px;
    text-align: center;
    border: 2px solid var(--diagram-border-color);
    border-radius: 5px;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -15px;
}

.diagram-branch {
    position: relative;
    margin-left: 250px;
}

    .diagram-branch:before {
        content: "";
        width: 50px;
        border-top: 2px solid var(--diagram-border-color);
        position: absolute;
        left: -100px;
        top: 50%;
        margin-top: 1px;
    }

.diagram-entry {
    position: relative;
    min-height: 60px;
}

    .diagram-entry:before {
        content: "";
        height: 100%;
        border-left: 2px solid var(--diagram-border-color);
        position: absolute;
        left: -50px;
    }

    .diagram-entry:after {
        content: "";
        width: 50px;
        border-top: 2px solid var(--diagram-border-color);
        position: absolute;
        left: -50px;
        top: 50%;
        margin-top: 1px;
    }

    .diagram-entry:first-child:before {
        width: 10px;
        height: 50%;
        top: 50%;
        margin-top: 2px;
        border-radius: 10px 0 0 0;
    }

    .diagram-entry:first-child:after {
        height: 10px;
        border-radius: 10px 0 0 0;
    }

    .diagram-entry:last-child:before {
        width: 10px;
        height: 50%;
        border-radius: 0 0 0 10px;
    }

    .diagram-entry:last-child:after {
        height: 10px;
        border-top: none;
        border-bottom: 2px solid var(--diagram-border-color);
        border-radius: 0 0 0 10px;
        margin-top: -9px;
    }

    .diagram-entry:only-child:before,
    .diagram-entry.sole:before {
        display: none;
    }

    .diagram-entry:only-child:after,
    .diagram-entry.sole:after {
        width: 50px;
        height: 0;
        margin-top: 1px;
        border-radius: 0;
    }

/* Select 2 in form-floating */
.form-floating .select2-selection {
    height: calc(3.5rem + 2px);
}

.select2-container--default .select2-selection--single {
    border-color: #CED4DA;
}

.form-floating .select2-selection__rendered {
    font-size: 14px;
    margin-top: 22px;
}

.form-floating .select2-selection__arrow {
    margin-top: 20px;
}

.form-floating .select2-selection__arrow > b {
    border: none !important;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    height: 16px !important;
    left: auto !important;
    margin: 0 !important;
    top: auto !important;
    width: 12px !important;
}