/* Shared V2 table sorting controls. Keep headings plain while preserving a full keyboard target. */
:where([data-sortable-table], .rcv2-sort-table) th[data-sort-key],
.rcv2-sort-table th[data-v2-sort-key],
[data-sortable-table] th:has(> .as-table-sort-button) {
  padding: 0 !important;
  vertical-align: middle;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button {
  align-items: center;
  appearance: none;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  cursor: pointer;
  display: inline-flex;
  filter: none !important;
  font: inherit !important;
  gap: 5px;
  justify-content: flex-start;
  line-height: inherit;
  min-height: 38px !important;
  padding: 7px 8px !important;
  text-align: inherit;
  text-decoration: none !important;
  transform: none !important;
  width: 100%;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button:hover {
  background: color-mix(in srgb, currentColor 9%, transparent) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button:focus-visible {
  outline: 2px solid #38bdf8 !important;
  outline-offset: -2px;
  position: relative;
  z-index: 1;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-label {
  min-width: 0;
  overflow-wrap: normal;
  white-space: nowrap;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph {
  align-items: center;
  color: currentColor;
  display: inline-block;
  flex: 0 0 14px;
  height: 16px;
  opacity: .62;
  position: relative;
  width: 14px;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph::before,
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph::after {
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  content: "";
  display: block;
  height: 5px;
  left: 4px;
  padding: 0;
  position: absolute;
  width: 5px;
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph::before {
  top: 1px;
  transform: rotate(-135deg);
}
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph::after {
  bottom: 1px;
  transform: rotate(45deg);
}
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="ascending"] .as-table-sort-glyph::before,
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="ascending"] .as-table-sort-glyph::before,
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="descending"] .as-table-sort-glyph::after,
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="descending"] .as-table-sort-glyph::after { opacity: 1; }
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="ascending"] .as-table-sort-glyph::after,
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="ascending"] .as-table-sort-glyph::after,
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="descending"] .as-table-sort-glyph::before,
:where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="descending"] .as-table-sort-glyph::before { opacity: .25; }
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="ascending"] .as-table-sort-label,
:where([data-sortable-table], .rcv2-sort-table) th[aria-sort="descending"] .as-table-sort-label { font-weight: 800; }
@media (max-width: 560px) {
  :where([data-sortable-table], .rcv2-sort-table) .as-table-sort-button { gap: 4px; min-height: 40px !important; padding-inline: 5px !important; }
  :where([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph { flex-basis: 14px; width: 14px; }
}

/* The authenticated shell has a broad, important button rule. Keep the
   sorting contract stronger without changing ordinary application buttons. */
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) th[data-sort-key],
html body.ui-2028 .rcv2-sort-table th[data-v2-sort-key],
html body.ui-2028 [data-sortable-table] th:has(> .as-table-sort-button) {
  padding: 0 !important;
  vertical-align: middle;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button,
html body.ui-2028 .as-table-sort-button[data-v2-sort] {
  appearance: none;
  align-items: center;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  cursor: pointer;
  display: inline-flex;
  filter: none !important;
  font: inherit !important;
  font-weight: inherit !important;
  gap: 5px;
  justify-content: flex-start;
  line-height: inherit;
  min-height: 38px !important;
  min-width: 0;
  overflow: visible;
  padding: 7px 8px !important;
  text-align: inherit;
  text-decoration: none !important;
  transform: none !important;
  width: 100%;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button:hover,
html body.ui-2028 .as-table-sort-button[data-v2-sort]:hover {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button:focus-visible,
html body.ui-2028 .as-table-sort-button[data-v2-sort]:focus-visible {
  outline: 2px solid #38bdf8 !important;
  outline-offset: -2px;
  position: relative;
  z-index: 1;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-label,
html body.ui-2028 .as-table-sort-button[data-v2-sort] .as-table-sort-label {
  min-width: 0;
  overflow-wrap: normal;
  white-space: nowrap;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-glyph,
html body.ui-2028 .as-table-sort-button[data-v2-sort] .as-table-sort-glyph {
  color: currentColor;
  flex: 0 0 14px;
  width: 14px;
}
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) th[aria-sort="ascending"] .as-table-sort-glyph::before,
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="ascending"] .as-table-sort-glyph::before,
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) th[aria-sort="descending"] .as-table-sort-glyph::after,
html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button[data-sort-direction="descending"] .as-table-sort-glyph::after { opacity: 1; }
@media (max-width: 560px) {
  html body.ui-2028 :is([data-sortable-table], .rcv2-sort-table) .as-table-sort-button,
  html body.ui-2028 .as-table-sort-button[data-v2-sort] { gap: 4px; min-height: 40px !important; padding-inline: 5px !important; }
}
