/* =========================================================
   MintSafe Branding für WHMCS Lagom2 Theme (RS Studio)
   Aktualisiert nach neuestem mintsafe.ch Design (CD-konform)
   Datei ablegen unter:
   templates/lagom2/core/styles/depth/assets/css/theme-custom.css
   ========================================================= */

/* 1) Google Font "Inter" laden (passend zu mintsafe.ch) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Primärfarben überschreiben (Standard Lagom: #009aff) */
  --brand-primary: #6B3FE7;
  --brand-primary-lighter: #7c52ec;
  --brand-primary-lighter-3: #a588f5;

  --text-primary-color: #6B3FE7;

  /* Button-Farben */
  --btn-primary-bg: #6B3FE7;
  --btn-primary-border: #6B3FE7;
  --btn-primary-hover-bg: #5530c4;
  --btn-primary-hover-border: #5530c4;

  --btn-primary-faded-bg: #f5f2ff;
  --btn-primary-faded-border: #ddd5f0;
  --btn-primary-faded-color: #6B3FE7;
  --btn-primary-faded-hover-bg: #ede8fb;
  --btn-primary-faded-hover-border: #c4b8f0;
  --btn-primary-faded-hover-color: #5530c4;

  /* Heller Hintergrund (Content-Bereiche) */
  --body-bg: #faf9ff;

  /* Schrift */
  --text-heading-color: #18103a;
  --text-body-color: #6a5080;
}

/* Globale Schriftart auf Inter umstellen */
body, .lagom {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Dunkler Hero/Header-Bereich im aktuellen mintsafe-Stil (heller Fliederton-Gradient) */
.lagom-not-portal .banner,
.page-login .main-content {
  background: linear-gradient(155deg, #221a52 0%, #2d1f6e 50%, #1a2d5c 100%) !important;
}

/* Links in Primärfarbe */
a {
  color: #6B3FE7;
}
a:hover {
  color: #5530c4;
}

/* Sekundäre Textfarbe für Fliessext/Untertitel im mintsafe-Stil */
.text-muted,
.lagom p.subtitle {
  color: #7a6aaa;
}

/* Icheck / Checkbox-Akzente */
:root {
  --icheck-active-bg: #6B3FE7;
  --icheck-active-border-color: #6B3FE7;
}

/* MintSafe Logo statt Standard-Icon auf der Produktgruppen-Kachel */
.package-icon {
  background-image: url('/templates/lagom2/assets/img/mintsafe-icon.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 140px;
  height: 64px;
}
.package-icon svg.svg-icon {
  display: none;
}