/* footer.css — the New Energy Wire's footer band (AQ-391, AQ-407).
 *
 * Every AXIOM wire's footer has one format (build/footer_format.py) and this
 * one look. Everything from "the band" down is the DFC Wire's assets/footer.css
 * rule for rule; keep the copies alike, and put anything that belongs to this
 * wire alone at the end. The markup is docs/wire-footer.html, rendered into
 * the pages by build/shared_footer.py.
 */

/* ---- the band ------------------------------------------------------------ */
/* The index's brand blue, fixed rather than themed: the same band in light
   and dark. Full-bleed, with the same left-edge expression as the topbar and
   clock strip, so the footer's text lines up with the feed above it. */
.ftr {
  display: block; box-sizing: border-box; width: 100%;
  margin: 30px 0 0; border: 0;
  padding: 34px max(20px, calc((100% - 1560px) / 2 + 20px)) 30px;
  background: #1D6BB4; color: #e9f2fb;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 12px; font-weight: 400; font-style: normal; line-height: 1.55;
  letter-spacing: normal; text-align: left; text-transform: none;
}
.ftr *, .ftr *::before, .ftr *::after { box-sizing: border-box; }
.ftr [hidden] { display: none !important; }
.ftr p { margin: 0; padding: 0; }
.ftr .ftwrap { max-width: 1520px; margin: 0; padding: 0; }

/* GEI's footer is one left-flush narrative stack, not columns: brand, then
   credits, then parent company, then the rule, then the disclaimer. */
.ftr .ftcols { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.ftr .ftlogo { display: block; height: 40px; width: auto; max-width: none;
               margin: 0 0 12px; opacity: .95; filter: brightness(0) invert(1); }
.ftr .ftdesc { max-width: 560px; font-size: 12.5px; line-height: 1.6; color: #e9f2fb; }
.ftr .ftdesc b { color: #fff; font-weight: 700; }
.ftr .ftcredits { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
/* .94, not .82: .82 composited to 4.27:1 on the band; .94 is 5.24:1. */
.ftr .cred { font-size: 12px; line-height: 1.55; color: rgba(255,255,255,.94); }

.ftr .ftparent { margin: 22px 0 0; font-size: 13px; line-height: 1.55; font-weight: 600; color: #fff; }
/* .90, not .72: .72 composited to 3.67:1; .90 is 4.83:1. */
.ftr .ftdisc { margin: 12px 0 0; padding: 16px 0 0; max-width: 900px;
               font-size: 11.5px; line-height: 1.65; color: rgba(255,255,255,.90);
               border-top: 1px solid rgba(255,255,255,.24); }

/* THE FOURTEEN LEGAL LINKS, the only route to the Terms, the Privacy Policy
   and the cancellation route on most pages. White on the band, underlined
   because fourteen links in a row need a boundary colour alone cannot give,
   at .94 because .82 does not clear 4.5:1 at this size. */
.ftr .ftlegal { margin: 12px 0 0; max-width: 900px;
                font-size: 12px; line-height: 1.95; color: rgba(255,255,255,.94); }
.ftr .ftcopy { margin: 10px 0 0; font-size: 12px; line-height: 1.55; color: rgba(255,255,255,.94); }
/* .86, not .55: .55 measured 2.79:1 and an 11px stamp needs 4.5:1. The release
   and its commit are one identifier, v1.9.001 (5db0b702), so they share a face (AQ-407). */
.ftr :is(.ftver, .ftrev) { font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
              font-size: 11px; letter-spacing: .06em; color: rgba(255,255,255,.86); }

/* ---- links and the one link-shaped button ------------------------------- */
/* Carbon link guidance: destinations read as links before pointer hover;
   interaction states stay visible against the fixed blue footer band. */
.ftr a { color: #fff; font-weight: 600; text-decoration: underline;
         text-decoration-color: rgba(255,255,255,.72); text-underline-offset: 2px; }
.ftr a:hover { color: #e5f2ff; text-decoration-color: currentColor; }
.ftr a:active { color: #c6e3ff; text-decoration-thickness: 2px; }

/* The focus ring is white: the page ring is brand blue, and brand blue on
   this band measured 1.05:1 in light and 1.86:1 in dark. */
.ftr :is(a, button):focus-visible {
  outline: 2px solid #fff; outline-offset: 2px; border-radius: 4px;
}

/* ---- the two footer controls, and the Wire's own tools ---------------- */
/* AQ-407: Analytics settings (legal row) and Report a bug (copyright row) are
   the same compact control on every wire. Report a bug is an email link that
   the Wire page turns into its form, so it must not look like prose. Touch
   sizing is applied at the phone breakpoint. */
.ftr .ftbug {
  display: inline-flex; align-items: center; min-height: 30px; margin: 0;
  text-decoration: none; vertical-align: middle;
  padding: 3px 9px; border-radius: 4px; cursor: pointer;
  border: 1px solid rgba(255,255,255,.68); background: #104f88;
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px; font-weight: 400; letter-spacing: .07em; line-height: 1.7;
  text-transform: uppercase; color: #fff;
}
.ftr .ftbug:hover { border-color: #fff; background: #0c416f; color: #fff; }
.ftr .ftbug:active { background: #fff; color: #123b5c; }
/* the operator's room links get their own line, with room to breathe */
.ftr #footOps { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0 0;
                font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
                font-size: 10px; letter-spacing: .08em; }
.ftr #footOps:empty { margin-top: 0; }
.ftr #footOps a { color: #fff; font-weight: 600; }
.ftr #footOps a:hover { text-decoration: underline; }

/* Keys: real <kbd> chips on their own row. */
.ftr .ftkeys { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px;
               margin: 24px 0 0; padding: 16px 0 0;
               border-top: 1px solid rgba(255,255,255,.24); }
.ftr .ftkeys-l { margin-right: 2px;
                 font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
                 font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase;
                 color: rgba(255,255,255,.92); }
.ftr .ftkeys .k { display: inline-flex; align-items: center; gap: 6px;
                  font-size: 11.5px; color: #e9f2fb; }
/* The Esc chip: white on a 14%-white wash left 4.19:1. Deepening the wash
   rather than brightening the glyph keeps it reading as a key cap. */
.ftr .ftkeys kbd {
  min-width: 20px; padding: 5px 6px; text-align: center;
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px; line-height: 1;
  color: #fff; background: rgba(3, 32, 60, .40);
  border: 1px solid rgba(255,255,255,.44); border-bottom-width: 2px; border-radius: 4px;
}
/* AQ-272: opens the keyboard help dialog, which reuses this key list. */
.ftr .ftkeys-help {
  min-height: 30px; margin: 0; padding: 4px 9px; border: 1px solid rgba(255,255,255,.68); border-radius: 4px;
  background: #104f88; color: #fff; cursor: pointer;
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px; letter-spacing: .05em; text-transform: uppercase;
}
.ftr .ftkeys-help:hover { border-color: #fff; background: #0c416f; }
.ftr .ftkeys-help:active { background: #fff; color: #123b5c; }
.ftr .ftkeys-help:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---- phones ----------------------------------------------------------------- */
@media (max-width: 780px) {
  .ftr { padding: 22px 14px 20px; }
  .ftr .ftcols { gap: 18px; }
  .ftr .ftkeys { gap: 6px 12px; }
  /* Only standalone destinations get a full target box. Inline prose links
     keep their own line boxes, so adjacent targets never overlap. */
  .ftr .ftbug, .ftr .ftkeys-help { min-height: 44px; }
  .ftr #footOps a { display: inline-flex; align-items: center; min-height: 44px; }
}

/* Screenshot reference: the same credit wordmark and compact reading column. */
.ftr .madeby { display: inline-flex; align-items: center; gap: 8px; width: fit-content; font-weight: 400; }
.ftr .madeby .anthropic-logo { height: 13px; width: auto; display: block; filter: brightness(0) invert(1); opacity: .94; }
.ftr .ftkeys-note { font-size: 11.5px; color: #e9f2fb; }

/* AQ-373: billing/session actions keep the main navigation focused. */
.ftr #acctBtns { display:flex; flex-wrap:wrap; gap:8px; }
.ftr .ftaccount { display:inline-flex; align-items:center; min-height:32px; padding:4px 9px; border:1px solid #ffffffad; border-radius:4px; background:transparent; color:#fff; font:600 11px/1.4 "IBM Plex Mono",ui-monospace,monospace; cursor:pointer; }
.ftr .ftaccount:hover { background:#0c416f; }
.ftr .ftaccount:active { background:#fff; color:#123b5c; }
@media (max-width:780px), (any-pointer:coarse) { .ftr .ftaccount { min-height:44px; } }

/* New Energy only: the account controls sit in their own row under the
   copyright line. */
.ftr .fttools { margin: 14px 0 0; }
