input.p-password-input {
  width: 100% !important;
}

.main-body-gradient {
  background: linear-gradient(to right, #ffffff, #3b82f6);
  /* blanco → azul */
}

.p-tab-active {
  color: var(--color-blue-500) !important;
}

/* estilos base para todos los botones */
.fc .fc-button {
  background-color: #2b7fff !important;
  border: #2b7fff !important;
  box-shadow: #2b7fff !important;
}

.fc .fc-button:focus {
  box-shadow: rgb(13 123 233 / 50%) 0px 0px 0px 0.2rem !important;
}

/* Failsafe responsive toggle: independiente de que Tailwind (CDN, JIT en
   vivo vía @tailwindcss/browser) detecte o no las clases "hidden md:block" /
   "md:hidden" dentro de los templates de Vue compilados en runtime. Si esa
   detección falla o pierde la carrera de especificidad contra el CSS de
   PrimeVue, la tabla de escritorio nunca se ocultaba en móvil (bug detectado
   2026-07-13 en Consultas). Estas reglas planas con !important garantizan el
   toggle sin depender de ningún JIT ni de orden de carga. */
@media (max-width: 767.98px) {
  .rd-desktop-only { display: none !important; }
}
@media (min-width: 768px) {
  .rd-mobile-only { display: none !important; }
}
@media (max-width: 639.98px) {
  .rd-sm-desktop-only { display: none !important; }
}
@media (min-width: 640px) {
  .rd-sm-mobile-only { display: none !important; }
}