/* Custom compact "Continue" label, with Google's light-pill geometry.
   This is not a GIS label preset. Official G and Google Sans Medium are local.
   Branding reference: developers.google.com/identity/branding-guidelines. */
@font-face {
  font-family: 'HPD Google Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/static/fonts/google-sans-500.ttf?v=continue-1') format('truetype');
}

.header-google-signin {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #747775;
  border-radius: 9999px;
  background: var(--color-paper,white);
  color: #1f1f1f;
  font: 500 14px/20px 'HPD Google Sans', Arial, sans-serif;
  letter-spacing: 0.25px;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 150ms ease, box-shadow 150ms ease;
}

.header-google-signin img {
  display: block;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}

.header-google-signin:hover {
  color: #1f1f1f;
  background: #f8faff;
  box-shadow: 0 1px 2px #3c404326;
  text-decoration: none;
}

.header-google-signin:focus-visible,
.header-email-signin:focus-visible {
  outline: 3px solid #0b57d0;
  outline-offset: 3px;
}

.header-email-signin {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--color-line, #d4d4d4);
  border-radius: 9999px;
  color: inherit;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}

/* The canonical shell keeps its existing colors, border and spacing. Use its
   drawer when the labelled account action would crowd the full navigation. */
@media (min-width: 880px) and (max-width: 1099px) {
  .hp-site-header.hp-header--anonymous .hp-header__hamburger,
  .hp-site-header.hp-header--anonymous .hp-header__mobile-account { display: flex; }
  .hp-site-header.hp-header--anonymous [data-test='top-nav'],
  .hp-site-header.hp-header--anonymous .hp-header__desktop-account { display: none; }
}

@media (min-width: 880px) and (max-width: 1279px) {
  .hp-site-header.hp-header--guest .hp-header__hamburger,
  .hp-site-header.hp-header--guest .hp-header__mobile-account { display: flex; }
  .hp-site-header.hp-header--guest [data-test='top-nav'],
  .hp-site-header.hp-header--guest .hp-header__desktop-account { display: none; }
}

/* Preserve the visible label and 44px touch controls on narrow phones. */
@media (max-width: 479px) {
  .hp-site-header.hp-header--anonymous > div:first-child { padding-inline: 8px; gap: 4px; }
  .hp-site-header.hp-header--anonymous .brand-wordmark { font-size: 16px; }
  .hp-site-header.hp-header--anonymous .hp-header__hamburger { flex-shrink: 0; }
}

@media (max-width: 359px) {
  .hp-site-header.hp-header--anonymous > div:first-child { gap: 0; padding-inline: 4px; }
  .hp-site-header.hp-header--anonymous .brand-wordmark { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .header-google-signin { transition: none; }
}
