/* SeeberUIComponents */
/* input elements - we can override the default styles with our CI styles */
label.accent {
    color: var(--petrol-color);
    font-weight: bold;
}

.required {
    color: var(--invert-color-dark);
    font-weight: bold;
}

input.accent {
}

    input.accent:disabled {
    }

    input.accent:focus {
    }

input[type=checkbox] {
    accent-color: var(--petrol-color) !important;
}

.form-switch .form-check-input.accent {
    background-color: var(--petrol-color-light);
}

    .form-switch .form-check-input.accent:checked {
        background-color: var(--petrol-color);
    }

textarea.accent {
}

    textarea.accent:disabled {
        color: dimgrey;
    }

select {
    font-family: SourceSansProLight, sans-serif;
    -moz-appearance: none; /* Firefox zeigt das Dropdown mit Times New Roman, so kann man zumindest auf Arial umstellen, Univers funktioniert jedenfalls nicht */
}

    select.accent {
    }

        select.accent:disabled {
        }

        select.accent:focus {
        }

/* special classes for special use cases */
.circle {
    width: 120px;
    height: 120px;
    background-color: var(--accent-light);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 50pt;
    font-weight: bold;
    color: var(--dark-accent);
    position: relative;
    box-shadow: 0 0 15px var(--accent-light);
}

    .circle::before {
        content: "";
        position: absolute;
        width: 120px;
        height: 120px;
        border-radius: 50%;
        box-shadow: 0 0 20px 10px var(--accent-light);
    }


/* close all button is white with Gebro blue border */
.btn-closeall-accent {
    border-color: var(--petrol-color);
    border-width: medium;
    background-color: var(--petrol-color-extralight);
}

/* info toast header colors - override if needed */
.seeber-toast-header-info {
    background-color: var(--petrol-color-dark);
    color: white;
}

/* info toast body colors lighter than header - override if needed */
.seeber-toast-info {
    background-color: var(--petrol-color-extralight);
    color: black;
}

.seeber-toast-header-warning {
    background-color: var(--amber-color-dark);
}
.seeber-toast-warning {
    background-color: var(--amber-color-extralight);
}
.seeber-toast-header-danger {
    background-color: var(--invert-color-dark);
}
.seeber-toast-danger {
    background-color: var(--invert-color-light);
}
.seeber-toast-header-success {
    background-color: var(--green-color-dark);
}
.seeber-toast-success {
    background-color: var(--green-color-extralight);
}

/* info toast icon url - allowing different images depending on background color */
.seeber-toast-header-info .toast-icon::before {
    background-image: url('/images/logo/logo_kuubik_white_65x75.png');
}

/* warning toast icon url - allowing different images depending on background color */
.seeber-toast-header-warning .toast-icon::before {
    background-image: url('/images/logo/logo_kuubik_white_65x75.png');
}

/* danger toast icon url - allowing different images depending on background color */
.seeber-toast-header-danger .toast-icon::before {
    background-image: url('/images/logo/logo_kuubik_white_65x75.png');
}

/* success toast icon url - allowing different images depending on background color */
.seeber-toast-header-success .toast-icon::before {
    background-image: url('/images/logo/logo_kuubik_white_65x75.png');
}