/* PD Mobile Cross-Platform CSS — 2026-06-01
 * Deploy-stabil: liegt AUSSERHALB der App-CSS, wird via <link> nach der App-CSS geladen.
 * Sorgt fuer einheitliche Tap-Targets (Apple HIG 44pt + Material 48dp),
 * Mobile-Tabellen-Card-Layout, Android-Chrome-Patterns.
 */
:root { --tap-target: 48px; }

* { -webkit-tap-highlight-color: rgba(15, 23, 42, 0.08); }
button, a, input, select, textarea, [role="button"] { touch-action: manipulation; }

@media (max-width: 1024px) {
  input[type="text"], input[type="email"], input[type="password"],
  input[type="tel"], input[type="number"], input[type="search"], input[type="url"],
  textarea, select { font-size: 16px !important; }
}

@media (max-width: 1024px) and (hover: none), (max-width: 640px) {
  button:not(.btn-sm):not(.btn-xs):not([type="checkbox"]):not([type="radio"]) { min-height: var(--tap-target); }
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not(.filter-input):not(.btn-sm) { min-height: var(--tap-target); }
  select:not(.filter-input):not(.btn-sm) { min-height: var(--tap-target); }
  nav a, .nav a, .topbar nav a, .nav-link, .nav-item, .nav-dd-btn, .nav-dd-item,
  .sidebar a, .menu a, .menu button { min-height: var(--tap-target); display: inline-flex; align-items: center; }
  .table-actions button, .cell-actions button, .emp-actions-icons button, td button, td a.btn-link {
    min-width: var(--tap-target); min-height: var(--tap-target); }
  .tab, .tab-btn, .pill-btn, .chip, [role="tab"], [role="menuitem"] { min-height: var(--tap-target); }
}

/* Mobile Tabellen-Cards (.tbl / .table) */
@media (max-width: 640px) {
  table.tbl, table.table { display: block; }
  table.tbl thead, table.table thead {
    position: absolute; width: 1px; height: 1px;
    overflow: hidden; clip: rect(0 0 0 0); }
  table.tbl tbody, table.table tbody { display: block; }
  table.tbl tr, table.table tr {
    display: block; background: #fff;
    border: 1px solid #e2e8f0; border-radius: 10px;
    padding: 11px 14px; margin-bottom: 9px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05); }
  table.tbl td, table.table td {
    display: flex; justify-content: space-between; align-items: flex-start;
    padding: 5px 0; border: none !important; text-align: right;
    font-size: 13.5px; line-height: 1.4; }
  table.tbl td::before, table.table td::before {
    content: attr(data-label); font-weight: 600; color: #64748b;
    font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
    margin-right: 12px; flex-shrink: 0; text-align: left; align-self: center; }
}