/* === Fondo de tarjetas === */
.card-bg {
  background: linear-gradient(180deg, #2b6cb0 0%, #2563eb 100%);
}

/* === Dropzone === */
.dropzone {
  border-style: dashed;
  border-width: 2px;
  border-color: rgba(0, 0, 0, 0.08);
  min-height: 110px;
  transition: all 0.15s ease-in-out;
}
.dropzone.dragover {
  box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12);
  transform: translateY(-2px);
}

/* === Carrusel === */
.carousel-transition {
  transition: transform 2s ease-in-out;
}

/* === Select2 + Tailwind (unificado) === */
.select2-container--default .select2-selection--single {
  height: 42px; /* igual a inputs Tailwind */
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.5rem; /* rounded-lg */
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem; /* text-sm */
  line-height: 1.25rem;
  color: #374151; /* text-gray-700 */
  display: flex;
  align-items: center;
}

/* Texto del select */
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #374151; /* text-gray-700 */
  line-height: 1.25rem;
}

/* Flecha del select */
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  right: 10px;
  top: 0; /* centrada verticalmente */
}

/* Estado focus (igual que inputs Tailwind) */
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: #38BDF8; /* border-[#38BDF8] */
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.5); /* ring-[#38BDF8] */
  outline: none;
}