/* BSK Mobile Shell 0.2.0: phone log in and sign up on the agency page. Phones only (below 721px).
   Every rule starts with body.bsk-m-app. On desktop the switch stays hidden and both forms show. */

.bsk-m-seg { display: none; }

@media (max-width: 720px) {
  /* Log in / Sign up switch: silver at rest, green when touched or selected */
  body.bsk-m-app .bskpl-auth .bsk-m-seg {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    margin: 0 0 14px;
  }
  body.bsk-m-app .bsk-m-seg-btn {
    min-height: 48px;
    padding: 0 12px;
    border: 0;
    border-radius: 8px;
    background: var(--bsk-m-silver);
    color: var(--bsk-m-ink);
    font-family: var(--bsk-m-font);
    font-size: 16px;
    font-weight: 900;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  body.bsk-m-app .bsk-m-seg-btn:active,
  body.bsk-m-app .bsk-m-seg-btn[aria-selected="true"] { background: var(--bsk-m-green); color: #fff; }
  body.bsk-m-app .bsk-m-seg-btn:focus { outline: none; }
  body.bsk-m-app .bsk-m-seg-btn:focus-visible { outline: 2px solid var(--bsk-m-green); outline-offset: 2px; }

  /* One form at a time */
  body.bsk-m-app .bskpl-auth[data-bsk-view="login"] .bsk-m-box-signup,
  body.bsk-m-app .bskpl-auth[data-bsk-view="signup"] .bsk-m-box-login { display: none; }

  /* Touch-sized fields. 16px text stops iPhone Safari from zooming in when a field is tapped. */
  body.bsk-m-app .bskpl-auth input:not([type="checkbox"]):not([type="radio"]),
  body.bsk-m-app .bskpl-auth select,
  body.bsk-m-app .bskpl-auth textarea {
    min-height: 48px;
    font-size: 16px;
  }
  body.bsk-m-app .bskpl-auth .bskpl-pass-btn {
    min-height: 48px;
    background: var(--bsk-m-silver);
    color: var(--bsk-m-ink);
  }
  body.bsk-m-app .bskpl-auth .bskpl-pass-btn:active { background: var(--bsk-m-green); color: #fff; }
  body.bsk-m-app .bskpl-auth .bskpl-btn { min-height: 52px; font-size: 16px; font-weight: 900; }
}