.custom-card-container {
  height: 500px;
  /* Altura máxima que puede tener el contenedor */
  overflow: auto;
  /* Permite desplazamiento cuando el contenido es mayor que el contenedor */
  position: relative;
  border: 1px solid #ccc;
  display: flex;
  /* Usa flexbox */
  flex-wrap: wrap;
  /* Permite que las tarjetas se envuelvan */
  gap: 10px;
  /* Espacio entre tarjetas */
  padding: 10px;
  /* Espacio alrededor del contenido dentro del contenedor */
}


.custom-card {
  width: 150px;
  height: 100px;
  position: absolute;
  background-color: #f9f9f9;
  border: 1px solid #ddd;

  display: flex;
  flex-direction: column; /* Organiza los hijos en una columna */
  justify-content: space-between; /* Espacio entre el título, staff y los íconos */
  align-items: flex-start; /* Alinea los elementos al inicio (izquierda) */
  padding: 5px; /* Añade un poco de padding */
  cursor: pointer; 
}

.card-title {
  margin-bottom: 2px; /* Ajusta según sea necesario */
}
.card-order,
.card-staff {
  font-size: 0.8em; /* Hazlo más pequeño que el título */
  color: #666; /* Color gris para diferenciarlo */
  margin-bottom: 10px; /* Espacio antes de los íconos */
}



.nav-link {
  display: flex;
  /* Establece el tab como contenedor flex */
  justify-content: space-between;
  /* Separa los elementos al principio y al final */
  align-items: center;
  /* Alinea los elementos verticalmente */
}

.tab-title {
  /* Estilos para el título del piso */
}

.icons {
  /* Alinea los íconos a la derecha */
  display: flex;
  gap: 5px;
  /* Espacio entre los íconos */
}

.edit-icon,
.delete-icon {
  cursor: pointer;
  /* Cambia el cursor para indicar que son clicables */
}