/* ==========================================================================
   24 · SIGNED-IN CLIENT — templates/partials/header.php (.hdr-client, .icon-btn.is-signed-in)
   While a client is signed in to the client area, the website header marks it the same way the team's BETA badge
   does, in green: the cell between the menus and Contact gets fine green stripes with a solid green "SIGNED IN"
   pill, and the person button on the right turns solid green. Both open the client area. Nothing changes height,
   so pages line up exactly as visitors see them.
   ========================================================================== */
.hdr-client { display: inline-flex; align-items: center; flex: none; align-self: center; margin-left: -24px; color: #fff; text-decoration: none; font-family: inherit; }
.hdr-client-pill { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 26px; padding: 0 11px 0 9px; border: 1px solid #16a34a; border-radius: 2px; background: #16a34a; color: #fff; font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: .08em; white-space: nowrap; box-shadow: 0 6px 16px -6px rgba(22, 163, 74, .7); }
.hdr-client:hover .hdr-client-pill, .hdr-client:focus-visible .hdr-client-pill { border-color: #15803d; background: #15803d; }
.hdr-client:focus-visible { outline: 2px solid #16a34a; outline-offset: 2px; }
.hdr-client-dot { width: 7px; height: 7px; flex: none; border-radius: 50%; background: #fff; animation: gt-cli-ping 1.8s ease-out infinite; }
@keyframes gt-cli-ping { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .85); } 100% { box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); } }
@media (prefers-reduced-motion: reduce) { .hdr-client-dot { animation: none; } }
.hdr-client-who { max-width: 8em; overflow: hidden; text-overflow: ellipsis; letter-spacing: 0; font-size: 12px; font-weight: 600; }
.hdr-client-who:empty { display: none; }
.gt-sb + .hdr-client { margin-left: 8px; }
/* The person button: solid green while signed in, so the way back to the client area is easy to spot. */
.icon-btn.is-signed-in, .hdr-actions > .icon-btn.is-signed-in { background: #16a34a; color: #fff; }
.icon-btn.is-signed-in:hover, .hdr-actions > .icon-btn.is-signed-in:hover { background: #15803d; color: #fff; }
@media (min-width: 1021px) and (max-width: 1240px) { .hdr-client-who { display: none; } }
@media (max-width: 800px) { .hdr-client { margin-left: 10px; } .hdr-client-who { display: none; } }
/* Desktop: like the BETA badge, the link fills its whole grid cell, striped green, with the pill centred inside. */
@media (min-width: 1021px) {
  .hdr-left > .hdr-client { box-sizing: border-box; justify-self: stretch; align-self: stretch; justify-content: center; min-width: 0; margin-left: 0; padding: 0 14px; background: repeating-linear-gradient(135deg, rgba(22, 163, 74, .13) 0 6px, transparent 6px 12px); }
  .hdr-left > .hdr-client .hdr-client-pill { width: 100%; height: 32px; font-size: 11.5px; }
  .hdr-left > .hdr-client:focus-visible { outline-offset: -4px; }
}