/* ============================================================================
     Wiki.js Login-Seiten-Styling im Quickmail CI 2026
     Wird via IIS Outbound Rule auf /login injiziert (web.config).
     Standalone -- enthaelt eigene CI-Variablen, weil injectBody hier NICHT
     gerendert wird.
     ============================================================================ */

  @import url('https://fonts.googleapis.com/css2?family=Onest:wght@300;400;500;600;700&display=swap');

  :root {
    --qm-primary: #18687d;
    --light-blue: #a4d8de;
    --bright-pink: #ff8a8f;
    --urban-green: #b0d194;
    --sand-stone: #c6bcb8;
    --urban-grey: #ebebeb;
    --grey-blue: #60758b;
    --radius: 14px;
  }

  .v-application,
  .v-application .v-main,
  .v-application .overline,
  .v-application .body-2 {
    font-family: 'Onest', sans-serif !important;
  }

  /* Hintergrund: Quickmail Petrol */
  .login,
  .is-login {
    background: var(--qm-primary) !important;
  }

  /* Login-Card */
  .login .v-card {
    border-radius: var(--radius) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35) !important;
    background: #fff !important;
  }

  /* Logo-Bereich */
  .login-boxlogo {
    padding: 1.5rem 0 0.5rem !important;
  }
  .login-boxlogo img {
    max-width: 220px !important;
    height: auto !important;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25));
  }

  /* Tagline / Overline */
  .login .overline,
  .login-tagline {
    color: var(--qm-primary) !important;
    letter-spacing: 0.15em !important;
    font-weight: 600 !important;
  }

  /* Eingabefelder */
  .login .v-input .v-input__slot {
    background-color: rgba(0, 0, 0, 0.04) !important;
    border-radius: calc(var(--radius) / 2) !important;
  }
  .login .v-text-field input {
    color: #000 !important;
  }
  .login .v-label {
    color: var(--grey-blue) !important;
  }
  .login .v-text-field--outlined fieldset {
    border-color: var(--grey-blue) !important;
  }

  /* ----------------------------------------------------------------------------
     Login-Button: alle Vuetify-Varianten erschlagen (Inline-Style + Theme-Klassen)
     ---------------------------------------------------------------------------- */
  .login button.v-btn,
  .login a.v-btn,
  .login .v-btn--has-bg,
  .login .v-btn.theme--light,
  .login .v-btn.theme--dark,
  .login .v-btn.primary,
  .login .v-btn.indigo,
  .login .login-actions .v-btn {
    background-color: var(--qm-primary) !important;
    background: var(--qm-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-radius: var(--radius) !important;
    letter-spacing: 0.08em !important;
    font-weight: 600 !important;
    height: 48px !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
  }

  .login button.v-btn .v-btn__content,
  .login a.v-btn .v-btn__content {
    color: #fff !important;
  }

  .login button.v-btn:hover,
  .login a.v-btn:hover,
  .login .login-actions .v-btn:hover {
    background-color: var(--qm-primary) !important;
    filter: brightness(1.12);
    box-shadow: 0 6px 20px rgba(24, 104, 125, 0.45) !important;
    transform: translateY(-1px);
  }

  /* Vuetify-Overlay-Layer entfernen, der die Farbe sonst aufweicht */
  .login .v-btn::before {
    background-color: transparent !important;
  }

  /* Buttons mit hartem Inline-Style ueberschreiben */
  .login .v-btn[style] {
    background-color: var(--qm-primary) !important;
    background-image: none !important;
  }

  /* ----------------------------------------------------------------------------
     Provider-Auswahl (bei mehreren Auth-Strategien)
     ---------------------------------------------------------------------------- */
  .login-providers .v-list-item {
    border-radius: calc(var(--radius) / 2) !important;
    margin: 4px 0;
  }
  .login-providers .v-list-item:hover {
    background-color: var(--light-blue) !important;
  }

  /* Sprachauswahl */
  .login-locale {
    background: rgba(255, 255, 255, 0.15) !important;
    border-radius: var(--radius) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  .login-locale .v-btn {
    color: #fff !important;
    background: transparent !important;
  }

  /* Copyright / Footer-Links */
  .login-copyright,
  .login-copyright a,
  .login .white--text {
    color: rgba(255, 255, 255, 0.85) !important;
  }

  /* Snackbars (Error/Success) */
  .login .v-snack__wrapper.error {
    background-color: var(--bright-pink) !important;
    color: #000 !important;
    border-radius: var(--radius) !important;
  }
  .login .v-snack__wrapper.success {
    background-color: var(--urban-green) !important;
    color: #000 !important;
    border-radius: var(--radius) !important;
  }

  .login,
  .login *,
  .is-login,
  .is-login * {
    text-shadow: none !important;
  }
  
  /* Vuetify primary--text auf der Login-Seite ueberschreiben */
  .login .v-application .primary--text,
  .login .primary--text,
  .is-login .primary--text,
  .v-application .login .primary--text {
    color: var(--qm-primary) !important;
    caret-color: var(--qm-primary) !important;
  }

  Falls der blaue Text innerhalb der Login-Card auf weisses Hintergrund unleserlich werden sollte (z. B. Links im Helper-Text), nimm stattdessen für die Card-Inhalte einen dunkleren Ton:

  .login .v-card .primary--text {
    color: var(--qm-primary) !important;
    caret-color: var(--qm-primary) !important;
  }

  /* Wenn primary--text auf dem Petrol-Hintergrund aussen liegt -> weiss */
  .login > .primary--text,
  .login-copyright .primary--text,
  .login-locale .primary--text {
    color: #fff !important;
  }
  
  .login-subtitle{
     background-image: initial !important
  }
  
   /* Alle Vuetify-Farbklassen mit "blue" oder "indigo" auf Login plattmachen */
  .login [class*="blue--text"],
  .login [class*="indigo--text"],
  .login-form [class*="blue--text"],
  .login-form [class*="indigo--text"],
  .is-login [class*="blue--text"],
  .is-login [class*="indigo--text"] {
    color: var(--qm-primary) !important;
    caret-color: var(--qm-primary) !important;
  }
.v-application .blue--text.text--darken-2
{
	  color: var(--qm-primary) !important;
    caret-color: var(--qm-primary) !important;
	
}

.v-image__image {
	background-image: url("https://wiki.myquickmail.ch/custom/qm_logo_neu.svg");
  background-position: center center;
	     /* drop-shadow rasterisiert das SVG -> waescht Konturen aus */
    filter: none !important;

    /* Browser-Skalierung explizit auf hochwertig stellen */
    image-rendering: auto;

    /* Subpixel-Verschiebung durch Transforms vermeiden */
    transform: translateZ(0);
    backface-visibility: hidden;
}