/* Bellísima ERP: sólo tablas opt-in. Desktop queda intacto. */
@media (max-width: 767.98px) {
  table[data-mobile-cards], table[data-mobile-cards] > tbody {
    display: block; width: 100%; max-width: 100%;
  }
  table[data-mobile-cards] > thead {
    position: absolute; width: 1px; height: 1px; padding: 0;
    margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
  }
  table[data-mobile-cards] > tbody { padding: .6rem; box-sizing: border-box; }
  table[data-mobile-cards] > tbody > tr {
    display: block; margin-bottom: .7rem; background: #fff;
    border: 1px solid #e5e7eb; border-radius: .7rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 5%); overflow: hidden;
  }
  table[data-mobile-cards] > tbody > tr:last-child { margin-bottom: 0; }
  table[data-mobile-cards] > tbody > tr > td,
  table[data-mobile-cards] > tbody > tr > th {
    display: block; box-sizing: border-box; width: 100%;
    max-width: 100%; min-width: 0; padding: .65rem .8rem;
    text-align: left !important; white-space: normal !important;
    overflow-wrap: anywhere; border-bottom: 1px solid #f3f4f6;
  }
  table[data-mobile-cards] > tbody > tr > :last-child { border-bottom: 0; }
  table[data-mobile-cards] > tbody > tr > td[data-mobile-label]::before {
    content: attr(data-mobile-label); display: block; margin-bottom: .2rem;
    font-size: .72rem; line-height: 1.1rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: .025em; color: #6b7280;
  }
  table[data-mobile-cards] > tbody > tr > td > * { max-width: 100%; }
  table[data-mobile-cards] > tbody > tr > td a,
  table[data-mobile-cards] > tbody > tr > td button { min-height: 40px; align-content: center; }
}