/* GROWTHSTAR Design (design.growthstar.app) — injected into Penpot's index.html by
 * /etc/nginx/overrides/server.d/growthstar.conf (Penpot's own nginx override dir).
 * Accent only: Penpot's neutral greys stay, because a design tool needs neutral canvases to judge colour.
 * Light-theme accents are luminance-matched to Penpot's (reskin/palette.py). The dark-theme accent is a
 * dragon-fruit tint chosen at >=7:1 against the dark background and against black button text
 * (the exact luminance match was near-white and lost the brand).
 * Source + rollback: /srv/apps/penpot-suite/branding-src/README.md on the box. */

.default {
  --color-accent-primary: #f099be;
  --color-accent-primary-muted: #a9245c;
  --color-accent-overlay: rgba(240, 153, 190, 0.6);
}
.light {
  --color-accent-primary: #962052;
  --color-accent-primary-muted: #f4cede;
  --color-accent-overlay: rgba(150, 32, 82, 0.6);
}

/* Sign-in pages: GROWTHSTAR Design lockup in place of the inline Penpot logo. */
.main_ui_auth__logo-container { width: auto; z-index: 2; }
.main_ui_auth__logo-btn {
  display: block;
  width: 242px;
  height: 28px;
  background: url("/growthstar/design-lockup.png") left center / contain no-repeat;
}
.light .main_ui_auth__logo-btn { background-image: url("/growthstar/design-lockup-ink.png"); }
.main_ui_auth__logo-btn svg { display: none; }

/* The suite's chocolate starburst (same art family as Drive and the sign-in page), mirrored so the
 * burst sits where Penpot's illustration was and the form stays on a clean field. Dark theme only. */
.default .main_ui_auth__auth-section { position: relative; background: #221710; }
.default .main_ui_auth__auth-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/growthstar/design-login.png") center / cover no-repeat;
  transform: scaleX(-1);
  pointer-events: none;
  z-index: 0;
}
.default .main_ui_auth__auth-section > :not(.main_ui_auth__logo-container) { position: relative; z-index: 1; }
.main_ui_auth__login-illustration img { visibility: hidden; }

/* 2026-09-22: the single sign-on button. Label comes from translation.en.js (auth.login-with-oidc-submit);
 * the OpenID logo is swapped for the GROWTHSTAR starburst, drawn in the button's own text colour. */
.main_ui_auth_login__btn-oidc-auth .icon-brand-openid { display: none; }
.main_ui_auth_login__btn-oidc-auth .logo {
  display: inline-block; width: 18px; height: 18px; margin-right: 8px; vertical-align: -3px;
  background-color: currentColor;
  -webkit-mask: url("/growthstar/growthstar-mark.svg") center / contain no-repeat;
  mask: url("/growthstar/growthstar-mark.svg") center / contain no-repeat;
}

/* 2026-09-25: the sign-in box Penpot shows over a file link when you are signed out
 * (namespace main_ui_static, not main_ui_auth), and the small logo mark in the app's corners. */
.main_ui_static__logo { height: 40px; background: url("/growthstar/design-lockup.png") left center / contain no-repeat; }
.light .main_ui_static__logo { background-image: url("/growthstar/design-lockup-ink.png"); }
.main_ui_static__logo svg.icon-penpot-logo { display: none; }
svg.icon-penpot-logo-icon > * { display: none; }
svg.icon-penpot-logo-icon {
  background-color: currentColor;
  -webkit-mask: url("/growthstar/growthstar-mark.svg") center / contain no-repeat;
  mask: url("/growthstar/growthstar-mark.svg") center / contain no-repeat;
}