/* SHIP CARD FIX - Ensure proper structure and display */

/* Reset any conflicting styles */
.cruise-ship-card * {
  box-sizing: border-box !important;
}

/* Ensure cards fill their container */
.cruise-ship-card {
  background: #ffffff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 400px !important;
  max-height: 450px !important;
}

.cruise-ship-card__link {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  text-decoration: none !important;
  color: inherit !important;
}

/* Image wrapper with fixed height */
.cruise-ship-card__image-wrapper {
  position: relative !important;
  width: 100% !important;
  height: 200px !important;
  overflow: hidden !important;
  background: #f7f8fa !important;
  flex-shrink: 0 !important;
}

/* Ensure images fill the wrapper */
.cruise-ship-card__image {
  width: 100% !important;
  height: 100% !important;
}

.cruise-ship-card__image img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

/* Placeholder styling */
.cruise-ship-card__placeholder-image {
  width: 100% !important;
  height: 200px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #e0e7ff 0%, #c7d2fe 100%) !important;
}

.cruise-ship-card__placeholder-image i {
  font-size: 48px !important;
  color: #818cf8 !important;
  opacity: 0.5 !important;
}

/* Cruise line badge - ensure it's positioned correctly */
.cruise-ship-card__cruise-line-badge {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  background: rgba(255, 255, 255, 0.95) !important;
  padding: 6px 12px !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #2c3e50 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  z-index: 5 !important;
  max-width: 150px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Content area */
.cruise-ship-card__content {
  padding: 20px !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Title */
.cruise-ship-card__title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #2c3e50 !important;
  margin: 0 0 10px 0 !important;
  line-height: 1.3 !important;
  min-height: 20px !important;
}

/* Description */
.cruise-ship-card__description {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #64748b !important;
  margin-bottom: 15px !important;
  flex-grow: 1 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
}

/* Specs section */
.cruise-ship-card__specs {
  display: flex !important;
  justify-content: space-around !important;
  padding: 12px 0 !important;
  margin: 10px 0 !important;
  border-top: 1px solid #e5e7eb !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: #f9fafb !important;
  border-radius: 4px !important;
}

.cruise-ship-card__specs .spec-item {
  text-align: center !important;
  flex: 1 !important;
  max-width: 25% !important;
}

.cruise-ship-card__specs .spec-item i {
  display: block !important;
  color: #3b82f6 !important;
  font-size: 14px !important;
  margin-bottom: 4px !important;
}

.cruise-ship-card__specs .spec-value {
  display: block !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  margin: 2px 0 !important;
}

.cruise-ship-card__specs .spec-label {
  display: block !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  color: #64748b !important;
  margin-top: 2px !important;
}

/* Footer */
.cruise-ship-card__footer {
  padding-top: 10px !important;
}

.cruise-ship-card__footer .explore-link {
  color: #3b82f6 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}

/* Hover effect */
.cruise-ship-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Overlay */
.cruise-ship-card__overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(to bottom, transparent 40%, rgba(0, 0, 0, 0.7)) !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 15px !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
  pointer-events: none !important;
}

.cruise-ship-card:hover .cruise-ship-card__overlay {
  opacity: 1 !important;
}

.cruise-ship-card__overlay span {
  background: white !important;
  color: #2c3e50 !important;
  padding: 8px 16px !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  pointer-events: auto !important;
}

/* Hide any Drupal field wrappers that might be showing */
.cruise-ship-card .field {
  margin: 0 !important;
  padding: 0 !important;
}

.cruise-ship-card .field__label {
  display: none !important;
}

.cruise-ship-card .field--type-entity-reference .node {
  display: none !important; /* Prevent full node rendering */
}

/* CRUISE LINE BADGE - Move to left side */
.cruise-ship-card__cruise-line-badge {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;  /* Changed from right to left */
  background: rgba(255, 255, 255, 0.95) !important;
  padding: 6px 12px !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #2c3e50 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  z-index: 5 !important;
  max-width: 150px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Launching Badge for future ships - positioned at bottom of image */
.cruise-ship-card__launching-badge {
  position: absolute !important;
  bottom: 12px !important;
  left: 12px !important;
  top: auto !important;
  right: auto !important;
  background: linear-gradient(135deg, #0c7e52 0%, #059669 100%) !important;
  color: white !important;
  padding: 6px 12px !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 2px 4px rgba(12, 126, 82, 0.3) !important;
  z-index: 6 !important;
  white-space: nowrap !important;
}

/* Clean up cruise line card descriptions */
.cruise-line-card__description {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: #64748b !important;
  margin-bottom: 15px !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  text-overflow: ellipsis !important;
}