/* Marketiism OS WP-15 layer (loaded by every shell right after components.css). Tokens only.
   Stacked phone tables (T1), sticky table empty state (T2), touch + zoom-safe controls (FM1), upright placeholders
   (FM5), two-line action list (F1), standalone filter bar (T4), slim cookie bar (PU4), command palette (N1),
   nav group badge (N4), table meta size (A1). */

/* ---------------------------------------------------------------- A1: small text at 13px */
.table .who__sub, .table td.muted, .alist__meta { font-size: var(--fs-13); }

/* ---------------------------------------------------------------- FM5: placeholders upright */
.input::placeholder, .textarea::placeholder, input::placeholder, textarea::placeholder { font-style: normal; }

/* ---------------------------------------------------------------- F1: action list second line */
.alist__link--multi { align-items: flex-start; }
.alist__link--multi .alist__icon, .alist__link--multi .alist__go { margin-top: var(--s-1); }
.alist__text { min-width: 0; flex: 1 1 auto; }
.alist__sub {
  display: block; margin-top: var(--s-1); color: var(--muted); font-size: var(--fs-13);
  font-weight: var(--fw-regular); line-height: var(--lh-snug); white-space: normal;
}

/* ---------------------------------------------------------------- T4: filter bar outside a card */
.filterbar--card, .stack > .filterbar, .c-content > .filterbar {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-card, none); padding: var(--s-3) var(--s-4); margin-inline: 0;
}

/* ---------------------------------------------------------------- T2: empty state stays in view */
.table-wrap:has(.table__state) { container-type: inline-size; }
.table__empty { position: sticky; left: 0; width: 100%; max-width: 100%; }
@supports (width: 1cqi) {
  .table__empty { width: calc(100cqi - 2 * var(--s-4)); }
}
.table__empty > * { max-width: var(--empty-max); margin-inline: auto; }

/* ---------------------------------------------------------------- FM1: touch targets, no iOS zoom */
@media (max-width: 640px), (pointer: coarse) {
  .input, .select, .textarea,
  .field__control > input, .field__control > select, .field__control > textarea {
    font-size: var(--fs-16); min-height: var(--touch-min);
  }
  .btn:not(.btn--sm):not(.btn--link) { min-height: var(--touch-min); }
  .btn--icon:not(.btn--sm) { min-width: var(--touch-min); }
  .btn.btn--sm { min-height: var(--control-h-lg); }
  .btn--icon.btn--sm { min-width: var(--control-h-lg); }
}

/* ---------------------------------------------------------------- T1: stacked tables under 640px */
@media (max-width: 640px) {
  .table.table--stack, .table.table--stack tbody { display: block; width: 100%; }
  .table.table--stack thead {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
  .table.table--stack tbody tr:not(.table__state) {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s-3); row-gap: var(--s-1);
    padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line);
  }
  .table.table--stack tbody tr:not(.table__state):has(> td.table__sel) { grid-template-columns: auto minmax(0, 1fr) auto; }
  .table.table--stack tbody tr:not(.table__state) > td {
    display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-3);
    grid-column: 1 / -1; min-width: 0; height: auto; padding: 0; border: 0; text-align: right; white-space: normal;
  }
  .table.table--stack tbody tr:not(.table__state) > td::before {
    content: attr(data-label); flex: 0 0 auto; max-width: var(--stack-label-max);
    color: var(--muted); font-size: var(--fs-13); font-weight: var(--fw-regular); text-align: left;
  }
  .table.table--stack tbody tr > td[data-label=""]::before,
  .table.table--stack tbody tr > td.t-key::before,
  .table.table--stack tbody tr > td.t-amt::before,
  .table.table--stack tbody tr > td.table__actions::before { content: none; }
  .table.table--stack tbody tr:not(.table__state) > td.t-key {
    display: block; grid-column: 1; grid-row: 1; text-align: left; font-weight: var(--fw-medium);
  }
  .table.table--stack tbody tr:not(.table__state) > td.t-amt {
    display: block; grid-column: 2; grid-row: 1; font-weight: var(--fw-semibold); white-space: nowrap;
  }
  .table.table--stack tbody tr:not(.table__state) > td.table__sel { display: block; grid-column: 1; grid-row: 1; }
  .table.table--stack tbody tr:has(> td.table__sel) > td.t-key { grid-column: 2; }
  .table.table--stack tbody tr:has(> td.table__sel) > td.t-amt { grid-column: 3; }
  .table.table--stack tbody tr:not(.table__state) > td.table__actions {
    order: 2; justify-content: flex-end; flex-wrap: wrap; padding-top: var(--s-2);
  }
  .table.table--stack tbody tr > td.hide-sm,
  .table.table--stack tbody tr > td.hide-md,
  .table.table--stack tbody tr > td.t-nostack { display: none; }
  .table.table--stack tbody tr.table__state, .table.table--stack tbody tr.table__state > td { display: block; }
}

/* ---------------------------------------------------------------- N4: nav group badge (shown while collapsed) */
.c-nav__gbadge { margin-inline-start: auto; }
.c-nav__toggle[aria-expanded="true"] .c-nav__gbadge { display: none; }
.is-rail .c-nav__gbadge { display: none; }

/* ---------------------------------------------------------------- PU4: slim cookie bar */
.cookiebar .cookiebar__in { align-items: center; gap: var(--s-3); padding: var(--s-2) var(--s-4); }
.cookiebar .cookiebar__title { display: inline; margin: 0 var(--s-2) 0 0; font-size: var(--fs-14); }
.cookiebar .cookiebar__body { display: block; min-width: 0; flex: 1 1 auto; }
.cookiebar .cookiebar__text { display: inline; margin: 0; font-size: var(--fs-13); line-height: var(--lh-snug); }
.cookiebar .cookiebar__actions { flex: none; flex-direction: row; gap: var(--s-2); margin: 0; }
@media (max-width: 640px) {
  .cookiebar .cookiebar__icon { display: none; }
  .cookiebar .cookiebar__in { padding: var(--s-2) var(--s-3); }
  .cookiebar .cookiebar__actions .btn { width: auto; flex: none; }
  .cookiebar .cookiebar__title { display: none; }
}

/* ---------------------------------------------------------------- N1: command palette (console shell) */
.pal {
  width: min(var(--pal-w), calc(100vw - 2 * var(--s-4))); max-width: none; max-height: min(var(--pal-h), calc(100vh - 2 * var(--pal-top)));
  margin: var(--pal-top) auto auto; padding: 0; border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--surface); color: var(--ink); box-shadow: var(--shadow-pop); overflow: hidden;
}
.pal[open] { display: flex; flex-direction: column; }
.pal::backdrop { background: var(--scrim); }
.pal__box { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-2) var(--s-4); border-bottom: 1px solid var(--line); }
.pal__box:focus-within { box-shadow: inset 0 calc(-1 * var(--focus-width)) 0 var(--focus); }
.pal__glass { color: var(--muted); flex: none; }
.pal__input {
  flex: 1 1 auto; min-width: 0; min-height: var(--touch-min); border: 0; background: transparent; color: var(--ink);
  font: inherit; font-size: var(--fs-16); outline: none;
}
.pal__list { flex: 1 1 auto; overflow: auto; padding: var(--s-2); overscroll-behavior: contain; }
.pal__heading {
  padding: var(--s-2) var(--s-3) var(--s-1); color: var(--muted); font-size: var(--fs-12); font-weight: var(--fw-semibold);
  letter-spacing: var(--track-caps); text-transform: uppercase;
}
.pal__opt {
  display: flex; align-items: center; gap: var(--s-3); min-height: var(--pal-row-h); padding: var(--s-2) var(--s-3);
  border-radius: var(--r); color: var(--ink); cursor: pointer;
}
.pal__opt.is-active { background: var(--surface-sel); box-shadow: inset var(--focus-width) 0 0 var(--focus); }
.pal__icon { flex: none; color: var(--muted); }
.pal__opt.is-active .pal__icon { color: var(--link); }
.pal__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pal__meta { flex: none; color: var(--muted); font-size: var(--fs-12); }
.pal__none { margin: 0; padding: var(--s-6) var(--s-4); color: var(--muted); text-align: center; }
.pal__foot {
  display: flex; gap: var(--s-4); margin: 0; padding: var(--s-2) var(--s-4); border-top: 1px solid var(--line);
  color: var(--muted); font-size: var(--fs-12);
}
.pal kbd {
  padding: 0 var(--s-1); border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface-2);
  color: var(--ink-2); font-family: var(--mono); font-size: var(--fs-12);
}
@media (max-width: 640px) {
  .pal { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .pal__foot, .pal__kbd { display: none; }
}