/* File: /hr/assets/css/table-sort.css
   =================================================================
   Looks for assets/js/table-sort.js - sortable column headers and the
   "Řadit" select above card lists. Own class names on purpose: the prebuilt
   Tailwind file has no rule for a class it has never seen. The arrows match
   the ones admin/nemocenska.php always had (↕ idle, ▲ ▼ active, indigo).
   Dark mode follows html.dark, using the admin --ad-* tokens where they
   exist and the portal greys where they don't.
   ================================================================= */

.ts-th { cursor: pointer; -webkit-user-select: none; user-select: none; }
.ts-th:focus { outline: none; }
.ts-th:focus-visible { outline: 2px solid #6366f1; outline-offset: -2px; border-radius: 4px; }
.ts-ico {
  display: inline-block;
  margin-left: .3em;
  font-size: .72em;
  line-height: 1;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  vertical-align: .05em;
  color: #cbd5e1;
  white-space: nowrap;
}
.ts-th:hover .ts-ico { color: #64748b; }
.ts-th.ts-on .ts-ico { color: #4f46e5; }
html.dark .ts-ico { color: #475569; }
html.dark .ts-th:hover .ts-ico { color: #94a3b8; }
html.dark .ts-th.ts-on .ts-ico { color: #a5b4fc; }

.ts-listbar { display: flex; justify-content: flex-end; margin: 0 0 .5rem; }
.ts-listlab { display: inline-flex; align-items: center; gap: .4rem; font-size: 12px; color: #64748b; }
.ts-listsel {
  font-size: 12px;
  line-height: 1.2;
  padding: .3rem 1.6rem .3rem .55rem;
  border: 1px solid #cbd5e1;
  border-radius: .6rem;
  background-color: #fff;
  color: #0f172a;
  max-width: 16rem;
}
html.dark .ts-listlab { color: var(--ad-muted, #9ca3af); }
html.dark .ts-listsel {
  background-color: var(--ad-inset, #1f2937);
  color: var(--ad-text, #e5e7eb);
  border-color: var(--ad-border, #374151);
}

@media print {
  .ts-ico, .ts-listbar { display: none !important; }
}