/* En pantallas pequeñas cada fila conserva todos sus datos en una ficha. */
@media (max-width: 991px) {
  .app-content, .main-content, .page-heading > div, .section-heading > div,
  .modal-content, .modal-body, .field-group, .order-welcome > div {
    min-width: 0;
  }
  h1, h2, h3, .accounting-note, .financial-list, .order-summary,
  .order-total, .payment-instructions, .form-text, .alert {
    overflow-wrap: anywhere;
  }
  .page-heading, .section-heading { align-items: stretch; }
  .section-heading { flex-direction: column; gap: 14px; }
  .section-heading .btn { white-space: normal; }
  .page-heading .btn, .section-heading > .btn { align-self: stretch; }
  .filter-bar { flex-wrap: wrap; }
  .filter-bar .form-control, .filter-bar .form-select { flex: 1 1 100%; min-width: 0; width: 100%; }
  .filter-bar > .btn { flex: 1 1 auto; white-space: normal; }
  .btn, .icon-button { min-height: 44px; }
  .icon-button { min-width: 44px; }
  .form-control, .form-select,
  .purchase-fields .form-control, .purchase-fields .form-select,
  .product-fields .form-control, .order-admin-fields .form-control,
  .order-admin-fields .form-select, .link-cell .form-control {
    min-width: 0;
    max-width: 100%;
    font-size: 16px;
  }
  .form-control[type="file"] { width: 100%; }
  .metric { min-width: 0; padding: 16px; }
  .metric strong { font-size: clamp(1.05rem, 4.3vw, 1.6rem); overflow-wrap: anywhere; }
  .activity-header { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .activity-back { justify-self: end; max-width: 100%; }
  .activity-status { font-size: .9rem; }
  .activity-actions { grid-template-columns: minmax(0, 1fr); }
  .financial-list div { flex-wrap: wrap; }
  .financial-list dt, .financial-list dd { min-width: 0; max-width: 100%; }
  .financial-list dd { margin-left: auto; text-align: right; }
  .order-summary, .order-total { flex-wrap: wrap; }
  .order-choice-grid .btn { flex: 1 1 110px; white-space: normal; }
  .order-message-tabs { flex-wrap: wrap; }
  .order-message-tabs .btn { flex: 1 1 130px; white-space: normal; }
  .modal { --bs-modal-margin: 12px; }
  .modal-dialog { margin: var(--bs-modal-margin); }
  .modal-title { min-width: 0; overflow-wrap: anywhere; }
  .modal-header, .modal-body, .modal-footer,
  .purchase-modal .modal-header, .purchase-modal .modal-body, .purchase-modal .modal-footer,
  .product-modal .modal-header, .product-modal .modal-body, .product-modal .modal-footer { padding: 16px; }
  .modal-footer .btn { flex: 1 1 130px; white-space: normal; }
  .modal-footer form { min-width: 0; max-width: 100%; }
  .modal-footer form .btn { width: 100%; }

  .table-responsive { overflow: visible; }
  .table-card { background: transparent; border: 0; box-shadow: none; overflow: visible; }
  .mobile-records { display: block; width: 100%; font-size: .9rem; }
  .mobile-records thead {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
  }
  .mobile-records tbody { display: grid; gap: 16px; width: 100%; }
  .mobile-records tbody tr {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px; padding: 18px; min-width: 0;
    background: #fff; border: 1px solid var(--line); border-radius: 14px;
  }
  .mobile-records tbody td {
    display: block; min-width: 0; padding: 0; border: 0;
    background: transparent; overflow-wrap: anywhere; box-shadow: none;
  }
  .mobile-records td::before {
    content: attr(data-label); display: block; margin-bottom: 5px;
    font-size: .74rem; font-weight: 600; color: var(--muted);
  }
  .mobile-records td:first-child { grid-column: 1 / -1; font-weight: 650; }
  .mobile-records td[data-label="Cliente"],
  .mobile-records td[data-label="Producto"],
  .mobile-records td[data-label="Dirección de entrega"],
  .mobile-records td[data-label="Pedido y consumo extra"],
  .mobile-records td[data-label="Entrega"],
  .mobile-records td[data-label="Link para compartir"],
  .mobile-records td[data-label="Correo"],
  .mobile-records td[data-label="Aviso"],
  .mobile-records td[data-label="Registro"],
  .mobile-records td[data-label="Cambios"],
  .mobile-records td[data-label="Acciones"],
  .mobile-records td[colspan] { grid-column: 1 / -1; }
  .mobile-records td[data-label="Acciones"] { border-top: 1px solid var(--line); padding-top: 14px; }
  .mobile-records td[data-label="Acciones"]::before { content: none; }
  .mobile-records td[data-label="Acciones"] > .d-flex,
  .purchase-row-actions { flex-wrap: wrap; justify-content: flex-start; }
  .mobile-records .empty-state { padding: 18px 0 !important; font-weight: 400; }
  .mobile-records .link-cell { min-width: 0; max-width: 100%; }
  .mobile-records .input-group { flex-wrap: nowrap; min-width: 0; }
  .mobile-records .input-group .form-control { width: 1%; }
  .mobile-records .link-actions { min-width: 0; gap: 10px 16px; }
  .mobile-records .link-actions > a { display: inline-flex; align-items: center; min-height: 44px; }
  .mobile-records details, .mobile-records dl, .mobile-records dd { min-width: 0; max-width: 100%; }
  .mobile-records summary { padding: 8px 0; }
}

@media (max-width: 360px) {
  .order-welcome { flex-wrap: wrap; }
  .order-waiter { margin-left: auto; }
  .public-form-panel, .confirmation-panel, .share-panel, .form-panel { padding: 20px; }
  .receipt { padding: 18px; }
  .order-payment-grid { grid-template-columns: minmax(0, 1fr); }
  .mobile-records tbody tr { padding: 16px; gap: 14px; }
}