/* Public legal footer (#1239) — the anonymous-visitor surface for Terms · Refund ·
   Privacy · Disclaimer. Mounted at the bottom of the landing page and /pro.

   No rules, no background: it is a legal footer, not a site map, and the pages above it
   (the landing hero, the /pro argument) are the reason anyone is here.

   Secondary rather than tertiary text, though — deliberately. --ij-text-tertiary is what
   the comparable ij-st-footer uses, but it measures 2.6:1 on white and 3.1:1 on black,
   under the 4.5:1 WCAG AA needs for body text. On most surfaces that is a de-emphasis
   choice; here it would defeat the whole point of the component, which exists so that a
   visitor — and a merchant-of-record reviewer — can FIND the terms. --ij-text-secondary
   measures 5.1:1 and 5.8:1 and still reads as secondary.

   Both tokens are redefined inside the dark block in tokens.css, so dark follows without
   a second rule here. */

.ij-pubfoot {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 20px;
    padding: 40px 24px 48px;
    font-size: 12.5px;
    color: var(--ij-text-secondary);
}

.ij-pubfoot-copy {
    white-space: nowrap;
}

.ij-pubfoot-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 20px;
}

.ij-pubfoot a {
    color: inherit;
    text-decoration: none;
    /* A legal link is a tap target on a phone before it is anything else. */
    padding: 2px 0;
}

/* The entry for the page you are already on (#1245): present and counted, but not a
   destination. Dimmer than its siblings so the difference is visible without a badge —
   this is the one place tertiary is right, because here it means "not actionable". */
.ij-pubfoot-current {
    color: var(--ij-text-tertiary);
    padding: 2px 0;
}

.ij-pubfoot a:hover {
    color: var(--ij-text-primary);
    text-decoration: underline;
}

/* Phone: stack the copyright above the links rather than letting four links wrap
   raggedly around it. */
@media (max-width: 599px) {
    .ij-pubfoot {
        flex-direction: column;
        gap: 12px;
        padding: 32px 20px 40px;
        text-align: center;
    }
}