/* CRM — mejoras táctiles y modales en pantallas chicas */
.crm-touch a,
.crm-touch button,
.crm-touch select,
.crm-touch input,
.crm-touch textarea {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(249, 115, 22, 0.25);
}

.crm-modal-fullscreen,
.crm-stats-modal-inner {
  overscroll-behavior: contain;
}

@media (max-width: 767px) {
  .crm-touch select,
  .crm-touch input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  .crm-touch button,
  .crm-touch textarea {
    min-height: 44px;
    font-size: 16px;
  }

  .crm-modal-fullscreen {
    align-items: stretch !important;
    padding: 0 !important;
  }

  .crm-modal-fullscreen .crm-modal-card {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 100%;
    border-radius: 0 !important;
    margin: 0;
  }

  .crm-stats-modal-inner {
    max-height: 100vh;
    border-radius: 0 !important;
  }

  .crm-chart-wrap {
    height: 50vh !important;
    min-height: 220px;
  }

  /* Ficha de cliente: "Ficha Nº" y "Compartir Ficha" son absolutos en
     extremos opuestos para el look de pestaña en desktop. En mobile van en
     el mismo renglón (Ficha a la izquierda, Compartir a la derecha) pero
     en flujo normal, no absolutos — así el resto del contenido nunca se
     pisa con ellos. Si el ancho no alcanza, "Compartir Ficha" se queda
     solo con el ícono. */
  .ficha-card-wrap {
    padding-top: 0 !important;
  }

  .ficha-header-row {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
  }

  .ficha-card-wrap .ficha-tab,
  .ficha-card-wrap .compartir-ficha-tab {
    position: static !important;
  }

  .ficha-card-wrap .compartir-ficha-tab {
    flex-shrink: 0;
  }

  @media (max-width: 359px) {
    .ficha-card-wrap .compartir-ficha-tab .compartir-ficha-label {
      display: none;
    }
  }

  /* Que la pantalla activa (Lista/Ficha/Acciones/Histórico) ocupe el alto
     disponible entre el header y la barra inferior fija, en vez de quedar
     con su altura natural y dejar un hueco negro debajo cuando el
     contenido es corto. Es un mínimo, no un tope: si el contenido es más
     alto, la tarjeta sigue creciendo y la página scrollea normal. */
  .crm-mobile-fill {
    min-height: calc(100dvh - 3.5rem - 4.75rem - env(safe-area-inset-bottom, 0px));
  }
}

/* Barra fija inferior de navegación mobile — pestaña activa resaltada en
   naranja. Se aplica a cualquier página que use crm-mobile-nav.js /
   crm-mobile-subtabs.js (Actividades, Dashboard, Cotizador, Campañas). */
.crm-mobile-tab[aria-current="true"],
.crm-mobile-subtab[aria-current="true"] {
  color: #f97316;
}