/* ============================================
   IfV Keycloak Theme - Login Styles
   Angepasst an ANWEISUNG.md (Website-Redesign, 11.08.2026)
   Primär:        #2E49C2   (Logo-Blau)
   Primär dunkel: #22358E   (Hover)
   Sekundär:      #81A5D6
   Akzent:        #00A7C6
   Heller BG:     #F4F6F9
   Fließtext-Grau:#687080
   Schrift:       Montserrat 600 (Titel) / Public Sans (Text), selbst-gehostet
   Hinweis offener Punkt #69: Logo-/Markenfarbe evtl. -> Violett #3F3AAA
   ============================================ */

/* --- Selbst-gehostete Schriften (DSGVO, keine Google-Fonts) --- */
@font-face {
    font-family: 'Public Sans'; font-style: normal; font-weight: 100 900; font-display: swap;
    src: url('../fonts/public-sans-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Public Sans'; font-style: normal; font-weight: 100 900; font-display: swap;
    src: url('../fonts/public-sans-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap;
    src: url('../fonts/montserrat-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap;
    src: url('../fonts/montserrat-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    --ifv-primary: #2E49C2;
    --ifv-primary-dark: #22358E;
    --ifv-secondary: #81A5D6;
    --ifv-accent: #00A7C6;
    --ifv-bg: #F4F6F9;
    --ifv-muted: #687080;
    --ifv-text: #1d1d1d;
    --ifv-font-text: 'Public Sans', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --ifv-font-head: 'Montserrat', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    --keycloak-logo-url: none !important;
    --keycloak-bg-logo-url: none !important;
    --keycloak-card-top-color: var(--ifv-primary);
}

div.kc-logo-text {
    background-image: none !important;
    width: auto !important;
    height: auto !important;
}

/* --- Grundschrift: Public Sans; Titel: Montserrat 600 --- */
body,
.pf-v5-c-login,
input, button, select, textarea,
.pf-v5-c-form-control,
.pf-v5-c-form__label-text,
.pf-v5-c-button {
    font-family: var(--ifv-font-text) !important;
}
#kc-page-title, h1, h2, h3 {
    font-family: var(--ifv-font-head) !important;
    font-weight: 600 !important;
}

/* --- Hintergrund: dezente on-brand Grafik --- */
.login-pf body,
html.pf-v5-theme-dark body,
#keycloak-bg {
    background: var(--ifv-bg) url('../img/ifv-bg.svg') center center / cover no-repeat fixed !important;
}

/* --- Keycloak Dark Mode deaktivieren --- */
.pf-v5-theme-dark { color-scheme: light !important; }
html.pf-v5-theme-dark,
html.pf-v5-theme-dark body,
.pf-v5-theme-dark .pf-v5-c-login,
.pf-v5-theme-dark .pf-v5-c-login__container,
.pf-v5-theme-dark .pf-v5-c-login__main {
    --pf-v5-global--BackgroundColor--100: #fff;
    --pf-v5-global--BackgroundColor--200: var(--ifv-bg);
    --pf-v5-global--Color--100: var(--ifv-text);
    --pf-v5-global--Color--200: #333;
    color: var(--ifv-text);
}

/* --- Akzentbalken oben (Marken-Verlauf) --- */
.pf-v5-c-login::before {
    content: "";
    display: block;
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, var(--ifv-primary-dark), var(--ifv-primary) 55%, var(--ifv-secondary) 80%, var(--ifv-accent));
    position: fixed;
    top: 0; left: 0;
    z-index: 1000;
}

/* --- Logo im Header --- */
#kc-header { text-align: center; padding-bottom: 0; padding-top: 20px; }
#kc-header-wrapper {
    font-size: 0 !important;
    line-height: 0 !important;
    letter-spacing: 0 !important;
    text-align: center;
    padding: 30px 0 20px 0;
    color: transparent !important;
    text-transform: none !important;
}
#kc-logo { display: inline-block; }
#kc-logo a { display: block; text-decoration: none !important; }
img.ifv-logo {
    display: block;
    width: 300px;      /* Seitenverhältnis 2,98:1 -> ~100px hoch */
    height: auto;
    max-width: 90vw;
    margin: 0 auto;
}

/* --- Login-Karte --- */
.pf-v5-c-login__main-header {
    border-top: 4px solid var(--ifv-primary) !important;
}
.pf-v5-c-login__main,
.pf-v5-theme-dark .pf-v5-c-login__main,
.card-pf {
    border-radius: 8px;
    box-shadow: 0 4px 24px rgba(34, 53, 142, 0.14);
    background-color: #fff !important;
    color: var(--ifv-text) !important;
}

/* --- Primär-Buttons --- */
.pf-v5-c-button.pf-m-primary,
.btn-primary,
input[type="submit"].pf-v5-c-button.pf-m-primary {
    background-color: var(--ifv-primary) !important;
    border-color: var(--ifv-primary) !important;
    color: #fff !important;
    border-radius: 4px;
    font-weight: 600;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}
.pf-v5-c-button.pf-m-primary:hover,
.btn-primary:hover,
input[type="submit"].pf-v5-c-button.pf-m-primary:hover {
    background-color: var(--ifv-primary-dark) !important;
    border-color: var(--ifv-primary-dark) !important;
    box-shadow: 0 2px 10px rgba(46, 73, 194, 0.40);
}
.pf-v5-c-button.pf-m-primary:focus,
.btn-primary:focus {
    background-color: var(--ifv-primary-dark) !important;
    border-color: var(--ifv-primary-dark) !important;
    outline: 2px solid rgba(46, 73, 194, 0.5);
    outline-offset: 2px;
}

/* --- Links --- */
.pf-v5-c-login__main a,
.pf-v5-c-login__main-footer-links-item a,
.pf-v5-c-button.pf-m-link {
    color: var(--ifv-primary) !important;
}
.pf-v5-c-login__main a:hover,
.pf-v5-c-button.pf-m-link:hover {
    color: var(--ifv-primary-dark) !important;
    text-decoration: underline;
}

/* --- Header-Link ohne Farbe --- */
#kc-logo a, #kc-header a { color: transparent !important; }

/* --- Formular-Labels & Text --- */
.pf-v5-c-form__label-text,
.pf-v5-c-check__label,
.pf-v5-theme-dark .pf-v5-c-form__label-text,
.pf-v5-theme-dark .pf-v5-c-check__label {
    color: var(--ifv-text) !important;
}

/* --- Formular-Inputs --- */
.pf-v5-c-form-control,
.pf-v5-theme-dark .pf-v5-c-form-control {
    --pf-v5-c-form-control--BackgroundColor: #fff;
    background-color: #fff !important;
    color: var(--ifv-text) !important;
}
.pf-v5-c-form-control > input,
.pf-v5-c-form-control > textarea { color: var(--ifv-text) !important; }
.pf-v5-c-form-control > input:focus,
.pf-v5-c-form-control > textarea:focus {
    border-bottom-color: var(--ifv-primary) !important;
}

/* --- Passwort-Sichtbarkeits-Button --- */
.pf-v5-c-button.pf-m-control,
.pf-v5-theme-dark .pf-v5-c-button.pf-m-control {
    background-color: #f0f0f0 !important;
    color: #333 !important;
}

/* --- Titel & Beschreibung --- */
#kc-page-title,
.pf-v5-c-login__main-header-desc,
.pf-v5-theme-dark #kc-page-title {
    color: var(--ifv-text) !important;
}

/* --- Info-Alert --- */
.pf-v5-c-alert.pf-m-info {
    --pf-v5-c-alert--BackgroundColor: rgba(46, 73, 194, 0.08);
}

/* --- Footer --- */
.pf-v5-c-login__footer,
.pf-v5-c-login__main-footer { color: var(--ifv-muted) !important; }

/* --- Social-Login --- */
.pf-v5-c-login__main-footer-links-item-link img,
.kc-social-icon-text { color: var(--ifv-primary); }

/* --- Tab-Leiste --- */
.pf-v5-c-tabs__link::after { background-color: var(--ifv-primary) !important; }

/* --- Checkbox --- */
.pf-v5-c-check__input:checked {
    background-color: var(--ifv-primary);
    border-color: var(--ifv-primary);
}

/* --- Responsive --- */
@media (max-width: 768px) {
    img.ifv-logo { width: 240px; }
    #kc-header-wrapper { padding: 20px 0 10px 0; }
}
