@layer components{.table{width:100%;border-collapse:collapse;background:var(--card-bg);box-shadow:var(--shadow)}.table thead th{background:#f9fafb;font-weight:600;text-align:left;padding:12px 16px;border-bottom:1px solid #e5e7eb;user-select:none;white-space:nowrap}.table tbody td{padding:12px 16px;border-bottom:1px solid #e5e7eb;font-size:.95rem;vertical-align:top}.table tr:hover td{background:#f3f4f6}.table a{color:var(--primary-hover);text-decoration:none;font-weight:600}.table a:hover{text-decoration:underline}.th--sortable{cursor:pointer;position:relative}.th--sortable::after{content:"⇅";position:absolute;right:8px;font-size:.8rem;opacity:.5}th[aria-sort="ascending"]::after{content:"↑";opacity:.9}th[aria-sort="descending"]::after{content:"↓";opacity:.9}}
/* status dot for due table */
.status{ text-align:center; }
.status-dot{ display:inline-block; width:12px; height:12px; border-radius:50%; box-shadow:0 0 0 2px #fff; }
.status-dot.ok{ background:#16a34a; }   /* green */
.status-dot.due{ background:#dc2626; }  /* red */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 1px 1px); white-space:nowrap; border:0; }

/* 1) Zellen-Inhalt in allen Tabellen vertikal zentrieren */
.table th,
.table td,
.data-table th,
.data-table td {
  vertical-align: middle !important;
}

/* 2) Button-Spalte sauber mittig halten (benötigt class="actions" am <td>) */
.table td.actions,
.data-table td.actions {
  display: flex;
  align-items: center;   /* vertikal zentriert */
  gap: 8px;
  height: 100%;
  white-space: nowrap;   /* Buttons nicht umbrechen */
}

/* 3) Typo konsistent (verhindert optisches “Hochrutschen”) */
.table td *,
.data-table td * {
  line-height: 1.35;
  margin: 0;
}


/* sort indicators: default neutral + override */
.table th.sortable::after{content:'\2195'; opacity:.5; margin-left:.35rem; font-size:.9em;}
.table th[aria-sort='ascending']::after{content:'\2191'; opacity:.9;}
.table th[aria-sort='descending']::after{content:'\2193'; opacity:.9;}
.table th.no-sort::after{content:none !important;}


/* --- indicator spacing + size tweaks --- */
.table thead th::after,
.data-table thead th::after{
  margin-left:5px;
  font-size:.72em;
  line-height:1;
  vertical-align:middle;
  opacity:.65;
}
.table thead th[aria-sort="ascending"]::after,
.data-table thead th[aria-sort="ascending"]::after,
.table thead th[aria-sort="descending"]::after,
.data-table thead th[aria-sort="descending"]::after{
  opacity:.85;
}


/* Auswahlspalte */
.table thead th.select-col,
.table tbody td.select-col{
  width:36px;
  text-align:center;
}
.table input[type="checkbox"]{
  appearance:auto;
  -webkit-appearance:auto;
}


/* Auswahlspalte und Bulkbar */
.table thead th.select-col,
.table tbody td.select-col{ width:42px; text-align:center; }
.table input[type="checkbox"]{ width:18px; height:18px; }

.bulkbar{ background:#eef2f6; border:1px solid #d8dee9; padding:12px; border-radius:0; }


/* Brand color for selected checkboxes */
.table input[type="checkbox"]{ accent-color:#006598; }


/* Do not render sort indicator on non-sortable columns */
.table th.no-sort::after { content: none !important; }
/* Ensure header checkbox stays clickable */
.table th.no-sort { cursor: default; }

/* v69 sticky sidebar */
.sidebar{
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}