/* DMU notify color backgrounds */
.notify.alert-success {
    background-color: #E7EFE7 !important;
    border: 1px solid var(--success) !important;
    color: var(--success) !important;
}

.notify.alert-danger {
    background-color: #F3E5E7 !important;
    border: 1px solid var(--danger) !important;
    color: var(--danger) !important;
}

.notify.alert-warning {
    background-color: #F8F4E4 !important;
    border: 1px solid var(--warning) !important;
    color: var(--warning) !important;
}

.notify.alert-info {
    background-color: #E4EFF1 !important;
    border: 1px solid var(--info) !important;
    color: var(--info) !important;
}

.notify.alert-primary {
    background-color: #F1EDF6 !important;
    border: 1px solid var(--primary) !important;
    color: var(--primary) !important;
}

/* Remove default border */
.notify {
    border: none !important;
}

/* Close button */
.notify .close {
    position: absolute;
    top: 8px;
    right: 10px;

    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    box-shadow: none;
    outline: none;

    width: 20px;
    height: 20px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 16px;
    line-height: 1;
    opacity: 0.7;
    cursor: pointer;
    border-radius: 50%;
}

.notify .close:hover,
.notify .close:focus {
    opacity: 1;
}

.notify .close:focus-visible {
    outline: none;
}




/* ================================================
   DARK MODE — Notify Colors
   ================================================ */
html[data-color^="dark-"] .notify {
    border: none !important;
    color: var(--light-text, #f0f0f0) !important;
}

/* SUCCESS */
html[data-color^="dark-"] .notify.alert-success {
    background-color: rgba(var(--success-rgb, 65, 139, 56), 0.18) !important;
    border: 1px solid var(--success) !important;
    color: var(--success-darker, #285422) !important;
}

/* DANGER */
html[data-color^="dark-"] .notify.alert-danger {
    background-color: rgba(var(--danger-rgb, 182, 40, 54), 0.18) !important;
    border: 1px solid var(--danger) !important;
    color: var(--danger-darker, #771a23) !important;
}

/* WARNING */
html[data-color^="dark-"] .notify.alert-warning {
    background-color: rgba(var(--warning-rgb, 235, 183, 26), 0.18) !important;
    border: 1px solid var(--warning) !important;
    color: var(--warning-darker, #aa830f) !important;
}

/* INFO */
html[data-color^="dark-"] .notify.alert-info {
    background-color: rgba(var(--info-rgb, 41, 138, 153), 0.18) !important;
    border: 1px solid var(--info) !important;
    color: var(--info-darker, #19545d) !important;
}

/* PRIMARY — your purple palette */
html[data-color^="dark-"] .notify.alert-primary {
    background-color: rgba(var(--primary-rgb, 151, 103, 183), 0.20) !important;
    border: 1px solid var(--primary) !important;
    color: var(--primary-darker, #80579b) !important;
}

/* Close button color in dark mode */
html[data-color^="dark-"] .notify .close {
    color: var(--light-text, #f0f0f0) !important;
    opacity: 0.75;
}

html[data-color^="dark-"] .notify .close:hover {
    opacity: 1;
}