/* Ping Custom Styles - Ganger Dermatology */
/* Survives Cinny updates - just re-link in index.html */

/* ===== HIDE LOGIN PAGE ELEMENTS ===== */

/* Hide Cinny logo in header */
header svg,
[class*="AuthHeader"] svg,
[class*="AuthHeader"] img {
  display: none !important;
}

/* Hide Cinny brand text */
header > div > span,
[class*="AuthHeader"] > div > span {
  visibility: hidden;
  width: 0;
  overflow: hidden;
}

/* Hide homeserver picker section entirely */
form > div:first-of-type,
[class*="ServerPicker"],
label + [class*="Input"] {
  display: none !important;
}

/* Hide username field and its label */
input[name="username"],
input[autocomplete="username"],
label:has(+ input[name="username"]),
div:has(> input[name="username"]),
div:has(> label):has(input[name="username"]) {
  display: none !important;
}

/* Hide password field and its label */
input[type="password"],
input[name="password"],
label:has(+ input[type="password"]),
div:has(> input[type="password"]),
div:has(> label):has(input[type="password"]) {
  display: none !important;
}

/* Hide password login submit button */
form button[type="submit"]:not([class*="SSO"]) {
  display: none !important;
}

/* Hide Or divider */
[class*="OrDivider"],
[class*="Divider"] {
  display: none !important;
}

/* Hide register link */
a[href*="register"],
[class*="register"],
footer a:last-child {
  display: none !important;
}

/* Hide forgot password */
a[href*="reset-password"] {
  display: none !important;
}


/* ===== ADD PING BRANDING ===== */

/* Add Ping text as header branding */
header::before,
[class*="AuthHeader"]::before {
  content: "Ping";
  font-size: 2rem;
  font-weight: 700;
  background: linear-gradient(135deg, #1a73e8 0%, #4285f4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-right: auto;
}


/* ===== STYLE SSO BUTTON ===== */

/* Make SSO button prominent and centered */
[class*="SSOLogin"],
[class*="sso-login"] {
  display: flex;
  justify-content: center;
  margin: 2rem 0;
}

[class*="SSOLogin"] button,
button[class*="sso"] {
  min-width: 280px !important;
  padding: 14px 28px !important;
  font-size: 1rem !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
  transition: all 0.2s ease !important;
}

[class*="SSOLogin"] button:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.2) !important;
  transform: translateY(-1px);
}


/* ===== CUSTOM FOOTER ===== */

footer::after,
[class*="AuthFooter"]::after {
  content: "Ganger Dermatology Internal Communications";
  display: block;
  text-align: center;
  font-size: 0.75rem;
  color: #888;
  margin-top: 0.5rem;
}


/* ===== HIDE ELEMENTS IN MAIN APP ===== */

/* Hide "Powered by Cinny" or similar */
[class*="powered"],
footer small {
  display: none !important;
}


/* ===== RESPONSIVE ADJUSTMENTS ===== */

@media (max-width: 600px) {
  header::before,
  [class*="AuthHeader"]::before {
    font-size: 1.5rem;
  }
  
  [class*="SSOLogin"] button {
    min-width: 240px !important;
  }
}