/* Ailis brand theme for Django admin */

:root,
html[data-theme="light"] {
    --primary: #1d4ed8;
    --secondary: #1e40af;
    --accent: #1d4ed8;
    --primary-fg: #fff;

    --header-color: #fff;
    --header-branding-color: var(--primary-fg);
    --header-bg: var(--primary);
    --header-link-color: var(--primary-fg);

    --breadcrumbs-fg: #dbeafe;
    --breadcrumbs-bg: var(--secondary);

    --link-fg: #1d4ed8;
    --link-hover-color: #1e3a8a;
    --link-selected-fg: var(--secondary);

    --error-fg: #a30000;

    --message-success-bg: #d1fae5;
    --message-warning-bg: #fef3c7;
    --message-error-bg: #fde8e8;

    --button-bg: var(--primary);
    --button-hover-bg: #1e40af;
    --default-button-bg: var(--secondary);
    --default-button-hover-bg: var(--primary);
    --delete-button-bg: #a30000;
    --delete-button-hover-bg: #820000;
}

html[data-theme="dark"] {
    --primary: #1d4ed8;
    --secondary: #3b5fd9;
    --header-bg: #1e3a8a;
    --link-fg: #60a5fa;
    --link-hover-color: #93c5fd;
    --error-fg: #e5484d;
    --message-success-bg: #064e3b;
    --message-warning-bg: #451a03;
    --message-error-bg: #450a0a;
    --delete-button-bg: #a30000;
    --delete-button-hover-bg: #c62828;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --primary: #1d4ed8;
        --secondary: #3b5fd9;
        --header-bg: #1e3a8a;
        --link-fg: #60a5fa;
        --link-hover-color: #93c5fd;
        --error-fg: #e5484d;
        --message-success-bg: #064e3b;
        --message-warning-bg: #451a03;
        --message-error-bg: #450a0a;
        --delete-button-bg: #a30000;
        --delete-button-hover-bg: #c62828;
    }
}

/* Custom status colors, available for admin.py `classes` hooks */
.ailis-status-success,
.ailis-status-green {
    color: #047857;
}

.ailis-status-error,
.ailis-status-red {
    color: #a30000;
}

.ailis-status-warning,
.ailis-status-yellow {
    color: #b45309;
}

/* Logo */
#header #site-name a {
    display: flex;
    align-items: center;
    gap: 10px;
}

.brand-logo {
    height: 28px;
    width: auto;
    display: block;
}

/* Login page branding */
.login-branding {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    color: var(--body-fg);
    font-size: 1.1rem;
    text-align: center;
}

.brand-logo-login {
    height: 56px;
    width: auto;
}

.login #content {
    padding-top: 10px;
}

.submit-row input[type="submit"] {
    background: var(--primary);
}

.submit-row input[type="submit"]:hover,
.submit-row input[type="submit"]:focus {
    background: var(--button-hover-bg);
}