/* Ticket RF8: the Outlets tab as D-OUT frame 6 draws it (design/brand/proposed/company-outlet/redesign-local/
   06-companies.html): one card per company with the outlets billed to it. Every rule is scoped to .rf8, the
   root of that page, because this file loads on every page. Tokens only; the page header, cards, buttons and
   chips are the web base's own. */

/* The design's stack (16 apart) and its row with the action pushed to the right. */
.rf8 .rf8-stack { display: grid; gap: var(--g-space-16); }
.rf8 .rf8-stack > * { min-width: 0; margin: 0; }
.rf8 .card + .card { margin-top: 0; }
.rf8 .card { padding: var(--g-space-16); }
.rf8 .rf8-row { display: flex; align-items: center; justify-content: space-between; gap: var(--g-space-12); flex-wrap: wrap; }
.rf8 .rf8-row h2, .rf8 .rf8-row p { margin: 0; }
.rf8 .actions form { margin: 0; }

/* The summary Pakcu, as frame 6 sizes it. */
.rf8 .rf8-pakcu { height: calc(var(--g-space-48) * 3); }

/* Company names and outlet names are whatever the owner typed, so they wrap anywhere. */
.rf8 .rf8-company__name { min-width: 0; overflow-wrap: anywhere; }
.rf8 .rf8-company__name .chip { margin-left: var(--g-space-8); }
.rf8 .rf8-label { margin: var(--g-space-12) 0 var(--g-space-8); }

/* Outlets billed here: each outlet a quiet link, its kind beside it, its own buttons to the right. */
.rf8 .rf8-outlets { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--g-space-8); }
.rf8 .rf8-outlet { display: flex; align-items: center; justify-content: space-between; gap: var(--g-space-12); flex-wrap: wrap; }
.rf8 .rf8-outlet__main { display: flex; align-items: center; gap: var(--g-space-8); flex-wrap: wrap; min-width: 0; }
.rf8 .rf8-outlet__name { overflow-wrap: anywhere; }
.rf8 .rf8-outlet__kind { margin: 0; }