/* site-footer — an optional TOP REGION of three zones over a one-line BOTTOM
 * ROW under a hairline. The same header-footer/ catalog everywhere. Element
 * paint lives on the parts; this sheet is band and zone geometry. */

/* The bar holds still across a page change: it names itself for the document's
 * view transition. */
.sk-footer {
  view-transition-name: sk-footer;
}

/* A NAMED group paints above the root snapshot the lightbox's scrim rides on,
 * so this bar drops its name while one is open. The lightbox stamps the root;
 * answering it is the bar's own business. */
html[data-sk-lightbox-vt] .sk-footer {
  view-transition-name: none;
}

.sk-footer {
  display: flex;
  flex-direction: column;
  gap: var(--kit-space-3);
  padding-block: var(--kit-space-5);
  /* The page's rail: the strip bleeds under its hairline, the sitemap and
   * fineprint sit on the content rail. */
  padding-inline: var(--sk-page-rail);
  border-top: 1px solid var(--sk-stroke);
  background-color: var(--sk-bg);
}

/* Three lanes that STACK their elements. A flex row, NOT a rigid 1fr auto 1fr
 * grid: a grid's empty tracks still eat their share of the band, so instead
 * empty lanes COLLAPSE. The exception: while the CENTER lane is populated,
 * empty side lanes stay as equal springs so it stays truly centred. */
.sk-footer-top {
  display: flex;
  align-items: flex-start;
  gap: var(--kit-space-4) var(--kit-space-5);
  margin-bottom: var(--kit-space-4);
}
.sk-footer-top:not(:has(.sk-footer-zone > *)) {
  display: none;
}
.sk-footer-zone[data-region="top"] {
  /* Auto basis: a lane's share follows its content (a brand lockup stays
   * narrow beside a wide sitemap), and free space tops both up equally. */
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
}
.sk-footer-zone[data-region="top"][data-zone="center"] {
  flex: 0 1 auto;
  align-items: center;
}
.sk-footer-zone[data-region="top"][data-zone="right"] {
  align-items: flex-end;
}
/* An empty center lane always collapses (it would otherwise leave a
 * double gap between the sides); empty SIDE lanes collapse only while the
 * center lane is empty too — populated-center keeps them as springs. */
.sk-footer-zone[data-region="top"][data-zone="center"]:not(:has(> *)) {
  display: none;
}
.sk-footer-top:not(:has([data-zone="center"] > *)) > .sk-footer-zone:not(:has(> *)) {
  display: none;
}
/* A lane whose only content is a SITEMAP hugs its columns' natural row. */
.sk-footer-zone[data-region="top"] > .sk-el-sitemap {
  align-items: flex-start;
}

.sk-footer-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--kit-space-3) var(--kit-space-4);
}
/* An all-empty bottom row collapses like the top region does — otherwise its
 * rule + padding render a second, blank closing band under the real one. */
.sk-footer-row:not(:has(.sk-footer-zone > *)) {
  display: none;
}

.sk-footer-zone {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--kit-space-3);
}

/* Small screens: the top region relaxes to one column, lanes in order. */
@media (max-width: 640px) {
  .sk-footer-top {
    flex-direction: column;
  }
  .sk-footer-zone[data-region="top"] {
    flex: none;
  }
  .sk-footer-zone[data-region="top"][data-zone="center"],
  .sk-footer-zone[data-region="top"][data-zone="right"] {
    align-items: flex-start;
  }
}

/* The customize surface stamps data-sk-editing while its session is open, so
 * collapsed empty lanes come back and keep a real footprint to target. Same
 * specificity tier as the hide rules, declared later so source order settles
 * the ties. */
.sk-footer[data-sk-editing] .sk-footer-top,
.sk-footer[data-sk-editing] .sk-footer-row {
  display: flex;
}
.sk-footer[data-sk-editing] .sk-footer-zone {
  display: flex;
  min-height: 28px;
}
.sk-footer[data-sk-editing] .sk-footer-zone:not(:has(> *)) {
  min-width: 96px;
}

/* Opt-in, and drawn only when the top region is populated: with nothing above
 * it the hairline floats over the band's own padding. Keyed on the toggle's ON
 * value, never `:not([…=""])`: a sidecar that omits the prop serves the token
 * verbatim, and a negative key would read that as on. */
.sk-footer[data-bottom-rule="true"]:has(.sk-footer-top .sk-footer-zone > *) .sk-footer-row {
  border-top: var(--sk-border-width) solid var(--sk-stroke);
  padding-top: var(--kit-space-4);
}