[overflow]:has(table){
  overflow: auto; }
  [overflow] table {
    min-width: 500px;
    width: -webkit-fill-available; }
    caption {
      color-scheme: dark;
      font-family: monospace;
      color: #ddd;}
    th, caption { 
      padding: 5px 10px !important;
      background: var(--b_override, black); }
    th {
      box-shadow: 0 0 5px var(--theme_transparent_333);
      color: wheat;
      white-space: nowrap }
      th[not_main]{
        --b_override: light-dark(#333, #111); }
    td {
      backdrop-filter: brightness(0.8);
      padding: 3px 7px;}
    :is(td, th).left { text-align: left; }
    :is(td, th).center { text-align: center; }
    :is(td, th).right { text-align: right; }


table[css='light']{
  --css_l_b: #bbb;

  :is(tbody, tfoot) {
    background: var(--css_l_b); }

  :is(tbody, tfoot) td {
    backdrop-filter: unset;
    color-scheme: light; }
}

table[inputs="clear"]{
  input:not([type="checkbox"]) {
    all: unset;
    background: var(--css_l_b) !important;
    
    &:-webkit-autofill {
      -webkit-box-shadow: 0 0 0 1000px var(--css_l_b) inset !important;
      -webkit-text-fill-color: #000;
    }
  
  }
}

body[data-portal="tenant"] :is(.table-wrap, [overflow]) {
  overflow-x: auto;
}

body[data-portal="tenant"] :is(.table-wrap, [overflow]) table,
body[data-portal="tenant"] table:not([unstyled]) {
  width: 100%;
  min-width: 640px;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--override-border, #d9dee7);
  overflow: hidden;
  background: var(--override-section, #ffffff);
}

body[data-portal="tenant"] table:not([unstyled]) thead th {
  padding: 10px 12px !important;
  border: 0;
  background: color-mix(in srgb, var(--override-section, #ffffff) 18%, #000000) !important;
  color: #ffffff !important;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
}

body[data-portal="tenant"] table:not([unstyled]) tbody td,
body[data-portal="tenant"] table:not([unstyled]) tfoot td {
  padding: 12px;
  border-top: 1px solid var(--override-border, #eaecf0);
  background: var(--override-section, #ffffff) !important;
  color: var(--override-text, #344054) !important;
  vertical-align: top;
  backdrop-filter: none;
}

body[data-portal="tenant"] table:not([unstyled]) tbody tr:hover td {
  background: color-mix(in srgb, var(--override-box, #fcfcfd) 84%, var(--override-section, #ffffff)) !important;
}

body[data-portal="tenant"] table:not([unstyled]) :is(td, th).left { text-align: left; }
body[data-portal="tenant"] table:not([unstyled]) :is(td, th).center { text-align: center; }
body[data-portal="tenant"] table:not([unstyled]) :is(td, th).right { text-align: right; }
