/* Humanitas branding for the Authelia sign-in portal.
   Authelia exposes no CSS hook, so nginx injects this into the page.
   Selectors are attribute-based on purpose: MUI/emotion class names are
   hashed at build time and change on every Authelia upgrade.
   Palette sampled from HS_logo_blue_n.png. */

:root {
    --hs-blue: #0094C8;
    --hs-blue-dark: #006C94;
    --hs-blue-deep: #0B475E;
}

/* --- the logo, given real presence --- */
img[src*="logo"] {
    height: 150px !important;
    width: auto !important;
    max-width: 82% !important;
    margin: .5rem auto 1.4rem !important;
    display: block !important;
}

/* --- page ground: a cool wash picked from the mark --- */
body {
    background:
        radial-gradient(1200px 560px at 50% -10%, #e2f2f9 0%, rgba(226,242,249,0) 64%),
        #f2f6f8 !important;
}

/* --- primary action --- */
button[type="submit"] {
    background-color: var(--hs-blue) !important;
    border-color: var(--hs-blue) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: .01em !important;
    padding-top: .6rem !important;
    padding-bottom: .6rem !important;
    box-shadow: 0 1px 2px rgba(0, 60, 85, .22) !important;
}

button[type="submit"]:hover {
    background-color: var(--hs-blue-dark) !important;
    border-color: var(--hs-blue-dark) !important;
}

button[type="submit"]:focus-visible {
    outline: 2px solid var(--hs-blue-deep) !important;
    outline-offset: 2px !important;
}

a { color: var(--hs-blue-dark) !important; }

/* --- dark scheme --- */
@media (prefers-color-scheme: dark) {
    body {
        background:
            radial-gradient(1200px 560px at 50% -10%, #102b36 0%, rgba(16,43,54,0) 64%),
            #0f1719 !important;
    }
    button[type="submit"] { color: #04222e !important; background-color: #29b4e4 !important; border-color: #29b4e4 !important; }
    button[type="submit"]:hover { background-color: #52c5ea !important; border-color: #52c5ea !important; }
    a { color: #4cc2ec !important; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}