/* ── "Sign in with Google" on the admin login card ────────────────────────────
   The second door under the password form (src/views/admin/AdminLogin.vue).
   Everything the button itself looks like is drawn by Google inside its own
   iframe and cannot be styled from here; what this file owns is the divider
   above it, the box the pill is centred in, and the spacing that keeps the two
   doors reading as one card rather than two stacked forms.

   Named `admin-google-signin.css` because the prefix is load-bearing:
   scripts/bundle-css.mjs sorts stylesheets into the public bundle and the admin
   bundle on the literal `/css/admin` prefix alone, so a differently-named sheet
   would ship to every marketing visitor on the site.

   The login card is RTL like the rest of the panel; the pill inside the frame
   is drawn by Google with locale `iw`, so nothing here needs a direction. */

.admin-google {
  margin-top: 1.25rem;
}

/* A rule with the word sitting in a gap in it. `flex: 1` on the two
   pseudo-elements is what makes the two halves share whatever the word leaves,
   so the line stays centred at any card width and in either direction. */
.admin-google__divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 1rem;
  color: #8e8f9e;
  font-size: 0.8rem;
}

.admin-google__divider::before,
.admin-google__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #e6e6ec;
}

/* THE MEASURED BOX. AdminLogin reads this element's width to size the Google
   pill, because GIS draws a fixed-pixel button that no CSS can reflow
   afterwards. Keep it a plain full-width block: a padding, a max-width or a
   transform here silently becomes the button's width. The min-height reserves
   the pill's row so the card does not jump as the iframe arrives. */
.admin-google__button {
  display: flex;
  justify-content: center;
  min-height: 44px;
}

/* The failure line belongs to this door, not to the form above it, so it needs
   the top margin the form's own error gets from its position in the flow. */
.admin-google .login-error {
  margin-top: 0.75rem;
}