/* ============================================================================
   RESPONSIVE DESIGN
   ============================================================================ */

@media (min-width: 1025px) {
  .scanner-inline-btn {
    display: none;
  }
}

@media (max-width: 1024px) {

  .ponto-status {
    flex-direction: column;
    text-align: center;
  }

  .status-icon {
    margin-right: 0;
  }

  .ponto-rapido-container {
    flex: none;
    width: 100%;
  }
}

@media (max-width: 768px) {
  .produto-imagem {
    flex-basis: 100%;
    max-width: 100%;
  }

  .dados-produto .info-row,
  .dados-cliente .info-row,
  .financeiro-table .info-row {
    padding: 10px;
    flex: 1 1 100%;
  }

  table {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    margin-top: 15px;
    overflow-x: auto;
    white-space: nowrap;
  }

  .form-row {
    flex-direction: column;
    align-items: stretch;
  }

  .form-row label {
    margin-bottom: 5px;
  }

  .atualizar-localizacao-btn,
  .pesquisar-btn,
  .limpar-btn {
    margin-top: 10px;
    width: 100%;
  }

  #cliente-input,
  #produto-input,
  #cidade-input {
    font-size: 16px;
  }

  .search-row {
    flex-direction: column;
  }

  .vitrola-login-container {
    padding: 20px;
  }

  .vitrola-welcome-container {
    flex-direction: column;
    text-align: center;
  }

  .vitrola-user-name {
    max-width: 80px;
  }

  .sinopse-text.collapsed {
    max-height: 70px;
  }



  .anotacoes-btn-fixed {
    bottom: 20px;
    right: 20px;
  }

  .anotacoes-btn-corner {
    padding: 10px 16px;
    font-size: 14px;
  }

  .pesquisa-rapida-section {
    flex-direction: column;
    gap: 20px;
  }

  .pesquisa-rapida-container {
    flex: none;
    width: 100%;
  }

  .preco-row {
    flex-direction: column;
  }

  .preco-container {
    flex-direction: row;
    align-items: center;
    margin-bottom: 10px;
    width: 100%;
  }

  .preco-label {
    margin-right: 10px;
    margin-bottom: 0px;
  }

  .preco-valor {
    margin-bottom: 0px;
  }

  .botao-container {
    width: 100%;
  }

  .calcular-desconto-btn {
    margin-top: 0;
    width: 100%;
    padding: 10px;
    text-align: center;
    font-size: 1em;
  }

  .desconto-modal-content {
    width: 95%;
    margin: 10% auto;
    padding: 15px;
  }

  /* Responsividade para sugestão do último cliente */
  .sugestao-cliente {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .usar-cliente-btn {
    align-self: stretch;
    text-align: center;
  }

  .sugestao-header {
    padding: 6px 10px;
  }

  .sugestao-titulo {
    font-size: 13px;
  }

  /* Responsividade para bipagem */
  .bipagem-container {
    padding: 15px;
  }

  .cliente-selecionado-bipagem {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }

  .trocar-cliente-btn {
    align-self: stretch;
  }

  .data-base-config {
    text-align: center;
  }

  #dias-base {
    width: 80px;
    margin: 0px;
  }

  .confirmar-dias-btn {
    margin: 20px 0px 10px 0px;
    padding: 10px 20px;
  }

  #isbn-input {
    font-size: 16px;
    padding: 12px;
  }

  .baixar-notas-btn,
  .iniciar-bipagem-btn,
  .parar-bipagem-btn {
    padding: 12px 20px;
    font-size: 14px;
  }

  .decisao-display {
    font-size: 1.2em;
  }

  .remover-produto-btn {
    margin-left: auto;
  }

  .produto-isbn-lista {
    font-size: 14px;
    padding: 3px 6px;
    margin: 0px;
  }

  .lista-produtos-bipados-container {
    padding: 15px;
  }

  .lista-produtos-bipados {
    max-height: 600px;
  }

  .produto-bipado-item {
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
  }

  .produto-info-lista {
    flex: 1 1 100%;
    gap: 8px;
  }

  .produto-nome-lista {
    font-size: 16px;
  }

  .produto-grupo-badge {
    font-size: 11px;
    padding: 3px 6px;
  }

  .zerar-bipagem-btn {
    font-size: 12px;
    padding: 6px 12px;
  }

  .zerar-bipagem-btn svg {
    width: 14px;
    height: 14px;
  }

  .produto-decisao-badge {
    font-size: 14px;
    padding: 3px 6px;
    margin-left: auto;
  }

  .editar-decisao-btn {
    padding: 6px 8px;
    margin-left: auto;
  }

  .editar-decisao-btn svg {
    width: 16px;
    height: 16px;
  }

  .bipagem-stats {
    gap: 12px;
  }

  .stat-card {
    padding: 12px;
  }

  .stat-icon {
    width: 40px;
    height: 40px;
    font-size: 16px;
    margin-right: 12px;
  }

  .stat-title {
    font-size: 15px;
  }

  .stat-details {
    flex-direction: column;
    gap: 3px;
    font-size: 13px;
  }

  .relatorio-info {
    padding: 12px;
  }

  .relatorio-devolucao-btn {
    padding: 10px 16px;
    font-size: 14px;
    width: 100%;
    justify-content: center;
  }

  .aviso-data-bipagem {
    font-size: 13px;
    padding: 6px;
  }

  .modo-data-base label {
    display: block;
    margin-bottom: 15px;
    margin-right: 0;
  }

  #data-especifica {
    width: 100%;
    max-width: 300px;
  }

  .filtros-checkboxes {
    flex-direction: column;
    gap: 15px;
  }

  .filtros-produtos-container {
    padding: 15px;
  }



  .pag-btn {
    padding: 6px 8px;
    font-size: 16px;
    min-width: 35px;
  }

}

@media (max-width: 480px) {
  .anotacoes-btn-corner span {
    display: none;
  }

  .anotacoes-btn-corner {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    padding: 0;
  }

  .anotacoes-btn-corner .anotacoes-icon {
    width: 30px;
    height: 30px;
  }

  .bipagem-container h3 {
    font-size: 1.5em;
  }

  .bipagem-container h4 {
    font-size: 1.1em;
    padding: 8px 12px;
  }



  .resultado-bipagem {
    padding: 15px;
  }

  .decisao-display {
    padding: 12px;
    font-size: 1.1em;
  }

  .confirmar-dias-btn {
    padding: 10px 20px;
  }

  #isbn-input {
    font-size: 16px;
    padding: 10px;
  }

  .lista-produtos-bipados-container h4 {
    font-size: 1em;
  }

  .produto-bipado-item {
    flex-wrap: wrap;
    gap: 8px;
  }

  .produto-info-lista {
    flex: 1 1 100%;
  }

  .teste-massivo-btn {
    margin-left: 0px;
    margin-top: 10px;
    font-size: 14px;
    align-items: center;
  }
}

/* ============================================================================
   RESPONSIVIDADE PEDIDOS
   ============================================================================ */

@media (max-width: 768px) {
  .pedidos-cliente-section {
    border-radius: 0px;
  }

  .tabs-content-wrapper {
    margin: 8px 0px 8px 0px;
    padding: 12px;
  }

  .tab {
    font-size: 12px;
    padding: 12px 8px;
  }

  .tab svg {
    width: 14px;
    height: 14px;
  }

  .top-produtos-lista {
    gap: 10px;
  }

  .top-produto-card {
    padding: 10px;
  }

  .acoes-container-pedidos {
    gap: 10px;
  }

  .btn-acao-footer {
    padding: 12px 16px;
    font-size: 14px;
  }

  .total-valor-resumo {
    font-size: 22px;
  }

  .trocar-cliente-pedidos-btn {
    align-self: stretch;
  }
}

@media (max-width: 560px) {
  .tab-badge {
    top: 8px;
    right: 4px;
  }

  .tab span {
    display: none;
  }

  .tab {
    padding: 12px 6px;
  }

  .top-produtos-lista {
    gap: 8px;
  }

  .top-produto-nome {
    font-size: 12px;
    min-height: 32px;
    max-height: 32px;
  }

  .top-produto-actions {
    flex-direction: column;
    gap: 6px;
    align-items: stretch;
  }

  .top-produto-actions .quantidade-control {
    width: 100%;
    justify-content: center;
  }

  .adicionar-top-produto-btn {
    width: 100%;
  }

  .cliente-nome-header {
    font-size: 14px;
  }
}

/* ============================================================================
   RESPONSIVIDADE MAPA
   ============================================================================ */

@media (max-width: 768px) {
  .vitrola-mapa-wrap {
    flex-direction: column;
  }

  .vitrola-mapa-sidebar {
    max-width: 100%;
    order: -1;
  }

  #vitrola-map {
    min-height: 60vh;
  }
}

/* ============================================================================
   RESPONSIVIDADE SCANNER
   ============================================================================ */

@media (min-width: 1025px) {
  #start-scanner {
    display: none;
  }
}

/* Responsividade Despesas */

@media (max-width: 768px) {
  .despesa-item {
    padding: 16px;
  }

  .despesa-meta-item,
  .despesa-description {
    font-size: 14px;
  }

  .comprovante-modal-content {
    max-width: 100%;
    max-height: 100%;
    padding: 5px;
    width: fit-content;
    height: fit-content;
  }

  .comprovante-modal img {
    max-width: 80vw;
  }

  .aviso-despesas-rejeitadas {
    padding: 12px 16px;
    gap: 10px;
  }

  .aviso-despesas-rejeitadas .aviso-icon {
    font-size: 20px;
  }

  .aviso-despesas-rejeitadas .aviso-texto {
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .categoria-icon {
    font-size: 18px;
  }

  .registrar-despesa-btn,
  .confirmar-etapa-btn {
    width: 100%;
  }

  .despesas-container h4 {
    font-size: 1.1em;
    padding: 16px;
  }

  .despesas-etapa h4 {
    font-size: 1.1em;
    padding: 8px 12px;
  }

  .despesa-item {
    padding: 14px;
  }

  .despesa-meta .despesa-meta-item:nth-child(2) {
    margin: 5px 0px 0px 0px;
    flex-basis: 100%;
  }

  .despesa-icon {
    width: 36px;
    height: 36px;
  }

  .comprovante-btn {
    padding: 8px;
  }

  .despesa-status {
    padding: 5px 10px;
    font-size: 12px;
  }

  .despesa-meta-item,
  .despesa-description {
    font-size: 12px;
  }
}