/* apple.com global footer text links — measured 2026-10-26 from live CSS.
   Source: https://www.apple.com/ac/globalfooter/8/en_US/styles/ac-globalfooter.built.css
   Load after ../../tokens/base/tokens.css (and optional ../../colors/apple-neutral-palette/tokens.css).
   Set --gf-footer-link-color / --gf-footer-pipe-color to the client brand neutrals (not Apple blue). */

:root {
  --gf-footer-link-font-size: 12px;
  --gf-footer-link-line-height: 1.3333733333;
  --gf-footer-link-font-weight: 400;
  --gf-footer-link-letter-spacing: -0.01em;
  --gf-footer-link-color: rgba(0, 0, 0, 0.72);
  --gf-footer-pipe-color: rgba(0, 0, 0, 0.48);
  --gf-footer-link-focus-color: var(--accent, currentColor);
}

/* Pipe-separated inline text links (legal-row pattern: .ac-gf-footer-legal-links*) */
.gf-social-text-links {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--gf-footer-link-font-size);
  line-height: var(--gf-footer-link-line-height);
  font-weight: var(--gf-footer-link-font-weight);
  letter-spacing: var(--gf-footer-link-letter-spacing);
  color: var(--gf-footer-link-color);
}

.gf-social-text-links__item {
  position: relative;
  display: inline-block;
  margin-inline-end: 6px;
  margin-top: 5px;
}

.gf-social-text-links__item::after {
  content: "";
  position: absolute;
  height: 10px;
  width: 1px;
  background-color: var(--gf-footer-pipe-color);
  margin: 3px 0;
}

.gf-social-text-links__item:last-child::after {
  display: none;
}

.gf-social-text-links__item:focus-within:not(:has(:focus-visible))::before {
  outline: none;
}

.gf-social-text-links__item:has(:focus-visible)::before {
  content: "";
  position: absolute;
  inset: 0;
  inset-inline-end: 9px;
  pointer-events: none;
  outline: var(--focus-ring-width, 2px) solid var(--gf-footer-link-focus-color);
  outline-offset: var(--focus-ring-offset, 1px);
}

.gf-social-text-links__link {
  color: var(--gf-footer-link-color);
  text-decoration: none;
  display: inline-block;
  padding: 0 9px;
  margin-inline-start: -9px;
  white-space: nowrap;
}

@media (hover: hover) and (pointer: fine) {
  .gf-social-text-links__link:hover {
    text-decoration: underline;
  }
}

.gf-social-text-links__link:focus-visible {
  outline: none;
}

@media (max-width: 1023px) {
  .gf-social-text-links__item {
    margin-top: 4px;
  }
}

@media (max-width: 833px) {
  .gf-social-text-links {
    padding-top: 12px;
  }

  .gf-social-text-links__item {
    margin-top: 5px;
  }
}

/* ADDED (library, not Apple): 44px minimum tap targets on phones — same rule as demo.html footer */
@media (pointer: coarse), (max-width: 833px) {
  .gf-social-text-links__link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  .gf-social-text-links__item::after {
    margin: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}
