.display-flex {
    display: flex;
}
.display-none {
    display: none;
}
.hide-if-empty:not(:has(> *)) {
    display: none;
}
/* .show-if-empty-sibling {
    display: none;
} */

.hide-if-empty:not(:has(> *)) ~ .show-if-empty-sibling {
    display: block !important;
}
.display-block {
    display: block;
}
.display-inline-block {
    display: inline-block;
}
.display-grid {
    display: grid;
}
.align-items-center {
    align-items: center;
}
.justify-content-between {
    justify-content: space-between;
}

.border-pill {
    border-radius: var(--border-pill)!important;
}
.border-rounded {
    border-radius: var(--border-rounded)!important;
}
.border-primary {
    border-color: rgb(var(--primary))!important;
}
.border-secondary {
    border-color: rgb(var(--secondary))!important;
}
.border-pos-accent {
    border-color: rgb(var(--pos-accent));
}
.border-neg-accent {
    border-color: rgb(var(--neg-accent));
}
.bg-primary {
    background-color: rgb(var(--primary)) !important;
}
.bg-secondary {
    background-color: rgb(var(--secondary)) !important;
}
.bg-pos-accent {
    background-color: rgb(var(--pos-accent)) !important;
}
.bg-neg-accent {
    background-color: rgb(var(--neg-accent)) !important;
}
.bg-darkgrey {
    background-color: darkgrey !important;
}
:is(.btn, button).bg-primary:hover, :is(.btn, button).bg-primary:focus {
    background-color: rgb(var(--primary-hovered)) !important;
    color: rgb(var(--secondary));
}
:is(.btn, button).bg-secondary:hover, :is(.btn, button).bg-secondary:focus {
    background-color: rgb(var(--secondary-hovered)) !important;
    color: rgb(var(--primary));
}

.color-primary {
    color: rgb(var(--primary))!important;
}
.color-secondary {
    color: rgb(var(--secondary))!important;
}
.color-pos-accent {
    color: rgb(var(--pos-accent));
}
.color-neg-accent {
    color: rgb(var(--neg-accent));
}
.color-red {
    color: red;
}

.bold {
    font-weight: 600 !important;
}
.italic {
    font-style: italic;
}
.fs-xxs * {
    font-size: var(--fs-1);
}
.fs-xs * {
    font-size: var(--fs-2);
}
.fs-s * {
    font-size: var(--fs-3);
}
.fs-m * {
    font-size: var(--fs-4);
}
.fs-l * {
    font-size: var(--fs-5);
}
.fs-xl * {
    font-size: var(--fs-6);
}
.fs-xxl * {
    font-size: var(--fs-7);
}
.shadow {
    box-shadow: 0 .1rem 0.5rem rgba(0,0,0,.15)!important;
}
.spaced {
    letter-spacing: 5px;
}

.sticky-header {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.06);
    background: #fff;
    position: fixed;
    width: 100%;
    z-index: 1000;
    top: 0;
}
.uppercase, .uppercase * {
    text-transform: uppercase;
}

.absolute-overlay {
    position: absolute;
    width: 100dvw;
    height: 100dvh;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 1000000;
}

.hovered-image:hover {
    box-shadow: 0 0 0 4px #a78bfa !important;
}
.hovered-image.selected, .hovered-image.selected:hover {
    box-shadow: 0 0 0 6px #a78bfa !important;
}

.w-10 {
    width: 10%;
}
.w-20 {
    width: 20%;
}
.w-30 {
    width: 30%;
}
.w-40 {
    width: 40%;
}
.w-60 {
    width: 60%;
}
.w-70 {
    width: 70%;
}
.w-80 {
    width: 80%;
}
.w-90 {
    width: 90%;
}

.vh-10 {
    height: 10vh!important;
}
.vh-20 {
    height: 20vh!important;
}
.vh-25 {
    height: 25vh!important;
}
.vh-30 {
    height: 30vh!important;
}
.vh-40 {
    height: 40vh!important;
}
.vh-50 {
    height: 50vh!important;
}
.vh-60 {
    height: 60vh!important;
}
.vh-70 {
    height: 70vh!important;
}
.vh-75 {
    height: 75vh!important;
}
.vh-80 {
    height: 80vh!important;
}
.vh-90 {
    height: 90vh!important;
}
.vh-100 {
    height: 100vh!important;
}

.vw-10 {
    width: 10vw!important;
}
.vw-20 {
    width: 20vw!important;
}
.vw-25 {
    width: 25vw!important;
}
.vw-30 {
    width: 30vw!important;
}
.vw-40 {
    width: 40vw!important;
}
.vw-50 {
    width: 50vw!important;
}
.vw-60 {
    width: 60vw!important;
}
.vw-70 {
    width: 70vw!important;
}
.vw-75 {
    width: 75vw!important;
}
.vw-80 {
    width: 80vw!important;
}
.vw-90 {
    width: 90vw!important;
}
.vw-100 {
    width: 100vw!important;
}


.min-vh-10 {
    min-height: 10vh!important;
}
.min-vh-20 {
    min-height: 20vh!important;
}
.min-vh-25 {
    min-height: 25vh!important;
}
.min-vh-30 {
    min-height: 30vh!important;
}
.min-vh-40 {
    min-height: 40vh!important;
}
.min-vh-50 {
    min-height: 50vh!important;
}
.min-vh-60 {
    min-height: 60vh!important;
}
.min-vh-70 {
    min-height: 70vh!important;
}
.min-vh-75 {
    min-height: 75vh!important;
}
.min-vh-80 {
    min-height: 80vh!important;
}
.min-vh-90 {
    min-height: 90vh!important;
}
.min-vh-100 {
    min-height: 100vh!important;
}

.min-vw-10 {
    min-width: 10vw!important;
}
.min-vw-20 {
    min-width: 20vw!important;
}
.min-vw-25 {
    min-width: 25vw!important;
}
.min-vw-30 {
    min-width: 30vw!important;
}
.min-vw-40 {
    min-width: 40vw!important;
}
.min-vw-50 {
    min-width: 50vw!important;
}
.min-vw-60 {
    min-width: 60vw!important;
}
.min-vw-70 {
    min-width: 70vw!important;
}
.min-vw-75 {
    min-width: 75vw!important;
}
.min-vw-80 {
    min-width: 80vw!important;
}
.min-vw-90 {
    min-width: 90vw!important;
}
.min-vw-100 {
    min-width: 100vw!important;
}

img.rounded-image, rounded-images img {
    border-radius: var(--border-pill);
}

.zoom {
    transition: all 200ms;
}
.zoom:hover {
    transform: scale(1.035);
    transition: all 350ms;
}
.shadow.zoom:hover {
    box-shadow: 0em 0em 0.5rem rgba(0,0,0,0.35)!important;
}
.list-style-none li {
    list-style-type: none;
}
.required::after {
    content: "*";
    color: red;
}
.no-wrap {
    white-space: nowrap;
}

.cursor-pointer {
    cursor: pointer;
}

label[id^="fileinput-"]:has(input[type="file"]:enabled) {
    cursor: pointer;
}

label[id^="fileinput-"]:has(input[type="file"]:disabled) {
    cursor: not-allowed;
    opacity: 0.8
}

.button:disabled {
    cursor: not-allowed;
    opacity: 0.8
}

.line-through {
    text-decoration: line-through;
}

.floating-tools-button {
    padding: 0.5em 0.85em;
    position: fixed;
    z-index: 1040;
    transition: all 0.2s;
}
.floating-tools-button:is(:hover, :focus, :disabled) {
    opacity: 0.85;
}
