/* Toschke e.V. Corporate Design
   Primär: Portal-Leisten-Blau #132849 / #1e3a5f / #2a4a73
   Logo: Original-Wappen (kein nachgezeichnetes Gelb), Hell=dunkler Text, Dunkel=weißer Text
*/
:root {
  --toschke-brand: #1e3a5f;
  --toschke-brand-mid: #2a4a73;
  --toschke-brand-dark: #132849;
  --toschke-bg: #eef1f4;
  --toschke-gradient: linear-gradient(135deg, #132849 0%, #1e3a5f 55%, #2a4a73 100%);
  --bs-primary: #1e3a5f !important;
  --bs-primary-rgb: 30, 58, 95 !important;
  --bs-success: #1e3a5f !important;
  --pngx-primary: 214, 52% !important;
  --pngx-primary-lightness: 25% !important;
  --pngx-primary-text-contrast: #ffffff !important;
  --pngx-primary-darken-5: #132849 !important;
  --pngx-primary-lighten-18: #2a4a73 !important;
  --color-primary: #1e3a5f !important;
  --color-primary-element: #1e3a5f !important;
  --color-primary-element-hover: #2a4a73 !important;
  --color-primary-element-text: #ffffff !important;
}

/* === Menüleisten (Portal-Blau) === */
html body .navbar,
html body .navbar.bg-primary,
html body nav.navbar,
html body nav.navbar.bg-primary,
html body nav#id_main_nav,
html body .bg-primary,
html body header.navbar,
.navbar.bg-primary {
  --bs-primary: #1e3a5f !important;
  --bs-primary-rgb: 30, 58, 95 !important;
  --pngx-primary: 214, 52% !important;
  --pngx-primary-lightness: 25% !important;
  --pngx-primary-text-contrast: #ffffff !important;
  background-color: #1e3a5f !important;
  background-image: var(--toschke-gradient) !important;
  background: var(--toschke-gradient) !important;
  border-color: #132849 !important;
  color: #fff !important;
}
html body .navbar .nav-link,
html body .navbar .navbar-brand,
html body .navbar .navbar-text,
html body .navbar .btn,
html body .navbar .dropdown > .btn,
html body nav#id_main_nav a {
  color: #fff !important;
}
html body .navbar .navbar-toggler-icon {
  filter: invert(1);
}

/* Paperless hard override of baked HSL primary on navbar */
html body .navbar.bg-primary {
  --pngx-primary: 214, 52% !important;
  --pngx-primary-lightness: 25% !important;
}

/* Tandoor beige kill */
html body nav#id_main_nav,
html body nav.navbar[style*="ddbf86"],
html body [style*="background-color: #ddbf86"],
html body [style*="background-color:#ddbf86"] {
  background-color: #1e3a5f !important;
  background-image: var(--toschke-gradient) !important;
  background: var(--toschke-gradient) !important;
}
html body nav#id_main_nav .brand-icon,
html body .navbar-brand img.brand-icon,
html body .navbar-brand img {
  height: 40px !important;
  width: auto !important;
  max-height: 44px !important;
  object-fit: contain !important;
}

/* Buttons */
.btn-primary, .btn-success, .btn-blue, .btn-login,
.button-vue--vue-primary, button.primary,
button[type=submit].btn-primary, button[type=submit].btn-success {
  background-color: #1e3a5f !important;
  background-image: none !important;
  border-color: #132849 !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-success:hover, .button-vue--vue-primary:hover {
  background-color: #2a4a73 !important;
}
a.text-primary, .text-primary { color: #1e3a5f !important; }


/* Wolke Fläche */
html:has(#body-login), body#body-login, #body-login, .body-login,
#body-user, #body-public, #body-settings {
  background: var(--toschke-gradient) !important;
  background-attachment: fixed !important;
}
#body-login .wrapper, #body-login main, #body-login .login-wrapper { background: transparent !important; }

/* Wolke: Login gestapelt, Header-Leiste inline (kein Text-Cutoff) */
:root {
  --image-logo: url("/toschke-brand-dark.png") !important;
  --image-logoheader: url("/toschke-brand-nav.png") !important;
}
#body-login .logo,
.body-login .logo,
.header-guest .logo,
#header.header-guest .logo {
  background-image: url("/toschke-brand-dark.png") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  width: min(200px, 62vw) !important;
  aspect-ratio: 3 / 4 !important;
  height: auto !important;
  max-height: min(280px, 38vh) !important;
  min-height: 180px !important;
  margin: 8px auto 20px !important;
  position: relative !important;
  inset: auto !important;
  display: block !important;
  filter: none !important;
}
#header:not(.header-guest) #nextcloud {
  padding-inline-start: 196px !important;
  overflow: visible !important;
}
#header:not(.header-guest) #nextcloud .logo {
  background-image: url("/toschke-brand-nav.png") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  width: 160px !important;
  height: 40px !important;
  filter: none !important;
  top: 50% !important;
  transform: translateY(-50%);
  bottom: auto !important;
  inset-inline-start: 10px !important;
}
#header:not(.header-guest) .header-appname {
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Tandoor-Leiste CD-Logo */
html body nav#id_main_nav .navbar-brand,
html body .navbar .navbar-brand {
  overflow: visible !important;
  max-width: none !important;
}
html body nav#id_main_nav .brand-icon,
html body .navbar-brand img.brand-icon,
html body .navbar-brand img,
img[src="/toschke-brand-nav.png"],
img[src*="toschke-brand-nav"],
img[src*="brand_logo"] {
  height: 44px !important;
  width: auto !important;
  max-width: min(280px, 65vw) !important;
  object-fit: contain !important;
  object-position: left center !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
}


/* CloudPanel Login: dunkler Verlauf hinter Logo (weißes Brand-Text) */
html:has(.login-container),
body:has(.login-container),
body:has(.login-container) html,
.login-container {
  background: linear-gradient(135deg, #132849 0%, #1e3a5f 55%, #2a4a73 100%) !important;
  background-color: #1e3a5f !important;
  min-height: 100vh;
}
.login-container {
  width: min(400px, 92vw) !important;
  margin: 64px auto 40px !important;
  padding-bottom: 24px;
  background: transparent !important;
}
.login-container .logo {
  text-align: center !important;
  padding: 12px 0 20px !important;
  background: transparent !important;
}
.login-container .logo img,
img[src*="cloudpanel-cloud.svg"] {
  width: auto !important;
  max-width: 240px !important;
  height: auto !important;
  max-height: 280px !important;
  object-fit: contain !important;
}
.login-form-container {
  border: 1px solid rgba(255,255,255,0.18) !important;
  border-radius: 10px !important;
  padding: 28px 24px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 28px rgba(0,0,0,0.22) !important;
}
.login-form-container .row { padding: 0 0 14px !important; margin: 0 !important; }
.login-form-container .row:last-child { padding: 0 !important; }
.login-form-container .col { padding: 0 !important; width: 100% !important; }
.btn-login {
  width: 100% !important;
  display: block !important;
  background: #1e3a5f !important;
  border-color: #132849 !important;
  color: #fff !important;
}
.footer-container {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 16px 0 0 !important;
  color: #e8eef6 !important;
  width: 100% !important;
}
.footer-container .language-selector {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}
.footer-container .language-selector label {
  margin: 0 !important;
  color: #e8eef6 !important;
  font-weight: 600 !important;
}
.footer-container .language-selector select,
.footer-container .language-selector .form-select {
  min-width: 160px !important;
  color: #132849 !important;
  background: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.55) !important;
  border-radius: 6px !important;
}