@media (prefers-color-scheme: light) {
    html {
        --info-bg-color: #d9edf7;
        --info-border-color: #bce8f1;

        --danger-bg-color: #f2dede;
        --danger-border-color: #ebccd1;

        --success-bg-color: #dff0d8;
        --success-border-color: #d6e9c6;

        --warning-bg-color: #fcf8e3;
        --warning-border-color: #faebcc;
    }
    /* Dark theme colors */
    html.dark-theme {
        --info-bg-color: #456f85;
        --info-border-color: #185460;

        --danger-bg-color: #7c2121;
        --danger-border-color: #570d1a;

        --success-bg-color: #24580f;
        --success-border-color: #233f0c;

        --warning-bg-color: #8e7911;
        --warning-border-color: #78550d;
    }
}

/* Styles for users who prefer dark mode at the OS level */
@media (prefers-color-scheme: dark) {
    /* defaults to dark theme */
    html {
        --info-bg-color: #456f85;
        --info-border-color: #185460;

        --danger-bg-color: #7c2121;
        --danger-border-color: #570d1a;

        --success-bg-color: #24580f;
        --success-border-color: #233f0c;

        --warning-bg-color: #8e7911;
        --warning-border-color: #78550d;
    }
    /* Override dark mode with light mode styles if the user decides to swap */
    html.light-theme {
        --info-bg-color: #d9edf7;
        --info-border-color: #bce8f1;

        --danger-bg-color: #f2dede;
        --danger-border-color: #ebccd1;

        --success-bg-color: #dff0d8;
        --success-border-color: #d6e9c6;

        --warning-bg-color: #fcf8e3;
        --warning-border-color: #faebcc;
    }
}

.alert-info {
    background-color: var(--info-bg-color);
    border-color: var(--info-border-color);
}
.alert-danger {
    background-color: var(--danger-bg-color);
    border-color: var(--danger-border-color);
}
.alert-success {
    background-color: var(--success-bg-color);
    border-color: var(--success-border-color);
}
.alert-warning {
    background-color: var(--warning-bg-color);
    border-color: var(--warning-border-color);
}

.alert {
    display: flow-root;
    color: var(--main-text-color);
}
.alert.alert-dismissible {
    position: fixed;
    right: 20px;
    top: 20px;
    z-index: 100;
}
.alert-dismissable,
.alert-dismissible {
    padding-right: 20px;
}
.alert-dismissable > .close,
.alert-dismissible > .close {
    padding-left: 10px;
}
.alert.alert-noFixed {
    position: relative !important;
}
button.close:hover {
    border: none;
    background: none;
}

.ui-dialog .internalPopup {
    padding: 0;
    background: var(--second-bg-color);
}
.ui-dialog .internalPopupContent {
    width: 100%;
    height: 98%;
    border: none;
}

.ui-dialog .aProposPopupContent {
    width: 100%;
    height: 97%;
    border: none;
}

.ui-dialog .ui-dialog-titlebar {
    z-index: 10;
    box-shadow: rgb(0 0 0 / 31%) 0px 3px 2px 0px;
    padding: 0;
}

.ui-dialog .ui-dialog-titlebar-close {
    font-family: "icomoon";
    left: initial;
    background-size: 18px 18px;
}

.ui-dialog .ui-dialog-titlebar-close:before {
    content: "\ea13";
}
.ui-dialog {
    background-color: var(--main-background-color);
    border: 2px solid black;
    box-shadow: 5px 5px 12px 4px var(--main-shadow-color);
}
.ui-dialog.animated {
    --appearTime: 0.2s;
    transition: display var(--appearTime) allow-discrete;
    animation: popinDisappear var(--appearTime) linear forwards;
}
.ui-dialog.animated.opened {
    animation: popinAppear var(--appearTime) ease-out forwards;
}

@keyframes popinAppear {
    0% {
        transform: scale(0, 0);
    }

    70% {
        transform: scale(1.05, 1.05);
    }

    100% {
        transform: scale(1, 1);
    }
}

@keyframes popinDisappear {
    0% {
        transform: scale(1, 1);
    }

    100% {
        transform: scale(0, 0);
    }
}

.ui-dialog-buttonpane {
    background-color: var(--main-background-color);
}
.ui-dialog iframe {
    background-color: var(--main-background-color);
}

.ui-widget-header {
    background-color: var(--third-bg-color);
    border-color: var(--main-border-color);
    color: var(--main-text-color);
}
.ui-widget-header .ui-dialog-title {
    padding-left: 0.5em;
    margin-right: 3em;
}

.ui-widget-content {
    color: var(--main-text-color);
    z-index: 1001 !important;
}
.ui-widget.ui-widget-content {
    border-color: var(--main-border-color);
}

.noBandeauPage {
    margin-top: 15px !important;
}