/* Site footer — only what the block conversion changes.

   The authored footer rules stay in public/css/korjin/components.css, which is
   global and therefore already loaded on every template (required for a section
   that renders in a group). This sheet loads after it and adjusts one thing:
   the column count. Tokens only, per tokens.css. */

/* The authored grid is `1.6fr repeat(3, 1fr)` — correct while three columns
   were hardcoded in JavaScript, wrong the moment a merchant adds a fourth,
   which would wrap onto a second row against an empty brand cell.

   Counted in CSS with :has() rather than passed down from the template.
   `section.blocks | size()` returns 0 on this platform even when the blocks
   demonstrably render, so a template-supplied count is a silent lie — and a
   count fed through a custom property fails badly: `repeat(var(--n), 1fr)`
   with an unusable value is invalid *at computed-value time*, which resolves
   the property to its initial `none` rather than falling back to the authored
   rule. The whole footer then stacks in one column.

   auto-fit is not an option either: a repeat(auto-fit, …) track may not sit
   beside a flexible one, so `1.6fr repeat(auto-fit, …)` is invalid and dropped
   at parse time.

   Three columns stays the authored default and needs no rule here. */

@media (min-width: 861px) {
  /* Children are the brand cell plus N columns, so the last column sits at
     nth-child(N+1). Matching :last-child pins each rule to an exact count. */
  .ftr__in:has(> .ftr__col:nth-child(2):last-child) {
    grid-template-columns: 1.6fr 1fr;
  }

  .ftr__in:has(> .ftr__col:nth-child(3):last-child) {
    grid-template-columns: 1.6fr repeat(2, 1fr);
  }

  .ftr__in:has(> .ftr__col:nth-child(5):last-child) {
    grid-template-columns: 1.6fr repeat(4, 1fr);
  }

  .ftr__in:has(> .ftr__col:nth-child(6):last-child) {
    grid-template-columns: 1.6fr repeat(5, 1fr);
  }

  .ftr__in:has(> .ftr__col:nth-child(7):last-child) {
    grid-template-columns: 1.6fr repeat(6, 1fr);
  }
}

/* The legal row — copyright, FDA disclaimer, credit — is meant to be one line
   on desktop, and stopped being one when the registered company address was
   added to the copyright on 16 Sep: "Designed & Powered by Power Commerce"
   dropped to a row of its own.

   The authored rule gives the disclaimer `flex: 1 1 auto`, so its hypothetical
   size is the whole sentence. A wrapping flex container decides where to break
   using that hypothetical size, BEFORE it shrinks anything — so a longer
   copyright pushes the third item to the next line even though the disclaimer
   had room to give. A zero basis takes it out of the wrap calculation and lets
   it grow into whatever the other two leave.

   The copyright gets the same treatment. Left at its content width it holds a
   full registered address and takes the row's whole middle, which crushed the
   disclaimer into a six-line ribbon at around 1024px. Two flexible items split
   what the credit leaves, so both wrap by a line or two instead of one being
   squeezed to nothing.

   Desktop only. Below 861px the row is supposed to stack, and zero-basis items
   would sit in slivers of columns beside each other. */
@media (min-width: 861px) {
  .ftr .ftr__legal > p:first-child,
  .ftr .ftr__fda {
    flex: 1 1 0;
  }
}