/* UI mobile do com_imobiliaria — extraído de ImobiliariaController::injectMobileUiCss()
   (Epic 7 — externalização de CSS 100% estático p/ ser cacheado pelo navegador em
   vez de reenviado inline em toda página). Carregado 1x por request via addStyleSheet
   com cache-bust por mtime, em toda tela HTML (ver site/imobiliaria.php). */

/* Botões "Ajuda"/"Chamado" só-ícone no celular (<576px): o texto colapsa (continua
   no DOM p/ leitores de tela) e o ícone (.bi) é restaurado. */
@media (max-width: 575.98px) {
  [data-bs-toggle="modal"][data-bs-target="#helpModal"],
  [data-bs-toggle="modal"][data-bs-target="#ticketModal"],
  [data-bs-toggle="modal"][data-bs-target="#modal-help"],
  [data-bs-toggle="modal"][data-bs-target="#modal-ticket"] {
    font-size: 0 !important;
  }
  [data-bs-target="#helpModal"] .bi,
  [data-bs-target="#ticketModal"] .bi,
  [data-bs-target="#modal-help"] .bi,
  [data-bs-target="#modal-ticket"] .bi {
    font-size: 1rem !important;
    margin: 0 !important;
  }
}

/* Campos de formulário 1 por linha no celular (<768px): coluna só com breakpoint
   médio/grande e sem col-12 base não recebe largura abaixo do breakpoint. */
@media (max-width: 767.98px) {
  form .row > [class*="col-"],
  .row > [class*="col-"]:has(.form-control, .form-select, select, textarea, .input-group) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Legibilidade no celular (<576px): 16px evita zoom automático do iOS em inputs
   menores; alvos de toque >=44px na paginação/.btn-sm; leve aumento de fonte em
   tabelas densas e textos auxiliares. */
@media (max-width: 575.98px) {
  .form-control,
  .form-select,
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: 16px !important;
  }
  .pagination {
    flex-wrap: wrap;
    justify-content: center;
  }
  .pagination .page-link {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .btn-sm {
    min-height: 38px;
  }
  .table-responsive table {
    font-size: 0.95rem;
  }
  .badge {
    font-size: 0.8rem;
  }
  .form-text,
  .small,
  small,
  figcaption {
    font-size: 0.82rem !important;
  }
}

/* Tabela densa -> cartões empilhados no celular (<768px), opt-in via .table-cards
   (data-label preenchido por site-standard.js a partir do <thead>). */
@media (max-width: 767.98px) {
  table.table-cards thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
  table.table-cards,
  table.table-cards tbody,
  table.table-cards tr,
  table.table-cards td {
    display: block;
    width: 100%;
  }
  table.table-cards tr {
    margin-bottom: 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: #fff;
  }
  table.table-cards td {
    border: none;
    border-bottom: 1px solid #f1f1f1;
    padding: 0.45rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    text-align: right;
    min-height: 0;
  }
  table.table-cards tr td:last-child {
    border-bottom: 0;
  }
  table.table-cards td[data-label]::before {
    content: attr(data-label);
    font-weight: 600;
    color: #6c757d;
    text-align: left;
    margin-right: auto;
  }
}