/* so_endorse_table_html — the Specials Ordering endorsement queue.
 *
 * The form's rules, kept here because the Anvil server strips a style body out
 * of an HTML template. Declarations are unchanged.
 *
 * Every rule is scoped :where(.so-endorse-root), which adds no specificity, so
 * nothing here can change which rule wins on its own. That private class is new:
 * this form's root is .px-table-wrapper.px-anvil-reset, a
 * shared pair, and scoping on it would reach every table on the page. There is
 * no root rule: the wrapper is not styled here.
 *
 * The five rules this leaf shared byte for byte with the outstanding and
 * history tables (.so-order-id, .so-filter-row th and its dark twin, the
 * .so-filter-row input/select pair and the placeholder rule) live in
 * specials_ordering.css instead, so the head does not load three copies.
 *
 * NO DESIGNER GATE. Nothing in this file hides content
 * until JavaScript runs, so the designer canvas shows the full markup.
 */

/* .px-btn doubled on all three .so-endorse-btn rules: the dependency's
   .px-btn-sm is (0,1,0) with font-size: 12px and padding: 5px 10px, the same
   two properties and the same specificity as the sizing rule below, and it is
   appended to <head> at runtime, i.e. AFTER this link. In a body <style> these
   rules won on document order; from a head link the sizes would lose the tie
   and both buttons would shrink. Both blocks are doubled together so the two
   cannot disagree about which one wins. */
:where(.so-endorse-root) .px-btn.so-endorse-btn {
  background: var(--so-success);
  color: #fff;
}

:where(.so-endorse-root) .px-btn.so-endorse-btn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--so-success) 85%, black);
}

:where(.so-endorse-root) .so-sendback-btn {
  background: var(--accent);
  color: #fff;
}

:where(.so-endorse-root) .so-sendback-btn:hover:not(:disabled) {
  background: var(--accent-hover);
}

:where(.so-endorse-root) .so-endorse-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

:where(.so-endorse-root) .px-btn.so-endorse-btn {
  padding: 8px 16px;
  font-size: 0.85rem;
  font-weight: 600;
}

/* Replaces the loading placeholder's inline style="..." attribute, which is
   banned in a template. Same four declarations, same order. Kept private to
   this leaf rather than folded into the shared asset: the outstanding leaf
   carries the same set as .so-loading and the history leaf as
   .so-history-loading, and a third private name keeps this a conversion rather
   than a refactor. */
:where(.so-endorse-root) .so-endorse-loading {
  text-align: center;
  padding: 28px;
  color: var(--accent);
  font-weight: 600;
}
