/* ============================================================================
   DJY Boats CSS
   Embed: <link rel="stylesheet" href="https://api.dreamjourneyyachting.com/public/boats.css">
   ============================================================================ */

/* =========================
   Global Styles
   ========================= */

/* Hide the Webflow badge */
.w-webflow-badge {
  display: none !important;
}

/* Style the date input field */
.date.date-field.input.style---bg-white {
  background-color: white;
  color: #576375;
}

/* Placeholder text styling */
.date.date-field.input.style---bg-white::placeholder {
  color: #576375;
}

/* Smooth fade-in on page load */
body {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* =========================
   Webflow IX2 Animation Overrides
   ========================= */

/* Force parent wrappers to be visible (fix Webflow IX2 animations) */
.mg-top-64px,
.mg-top-64px[data-w-id],
[data-w-id="be2aa704-a269-706a-aa0f-b0c59860e353"],
.djy-list-wrapper,
.w-dyn-list {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  animation: none !important;
}

/* =========================
   Boat Items Visibility
   ========================= */

/* HIDE all boat items by default until we filter them */
.collectionlistboats > .w-dyn-item {
  display: none !important;
}

/* Only show boats that have been verified as available AND not filtered out */
.collectionlistboats > .w-dyn-item.djy-available:not(.djy-filter-hidden) {
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* Hide unavailable boats */
.collectionlistboats > .w-dyn-item.djy-unavailable {
  display: none !important;
}

/* Hide filter-hidden boats (attribute filters applied by filter-engine.js) */
.collectionlistboats > .w-dyn-item.djy-filter-hidden {
  display: none !important;
}

/* Ensure processed boats without available class stay hidden */
.collectionlistboats > .w-dyn-item.djy-processed:not(.djy-available) {
  display: none !important;
}

/* After initialization, hide boats not yet marked as available */
body.djy-ready .collectionlistboats > .w-dyn-item:not(.djy-available) {
  display: none !important;
}

/* =========================
   Load More Button
   ========================= */

/* Hide Load More button by default until boats are loaded */
.djy-load-more,
.w-pagination-next {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Show Load More button only when ready */
body.djy-ready .djy-load-more,
body.djy-ready .w-pagination-next {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Show Load More when queued boats exist */
body.djy-ready.djy-has-queued .djy-load-more,
body.djy-ready.djy-has-queued .w-pagination-next {
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Keep hidden during loading or when no results */
body.djy-loading .djy-load-more,
body.djy-loading .w-pagination-next,
body.djy-no-results .djy-load-more,
body.djy-no-results .w-pagination-next {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* =========================
   Loading Spinner
   ========================= */

/* List wrapper needs relative positioning for spinner */
.djy-list-wrapper {
  position: relative;
  min-height: 300px;
}

/* 85% opacity loading backdrop - always paired with spinner */
.djy-loading-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.85);
  z-index: 99;
  display: none;
  pointer-events: auto;
}

/* Show backdrop when loading */
body.djy-loading .djy-loading-backdrop {
  display: block;
}

/* Spinner — sticky centered in viewport within container */
.djy-spinner-overlay {
  display: none;
  z-index: 100;
  pointer-events: none;
}

/* Show spinner when loading — sticky follows scroll in viewport center */
body.djy-loading .djy-spinner-overlay {
  display: flex;
  position: sticky;
  top: calc(50vh - 24px);
  justify-content: center;
  height: 0;
  overflow: visible;
}

.djy-spinner {
  width: 48px;
  height: 48px;
  animation: djy-spin 1s linear infinite;
}

.djy-spinner-track {
  fill: #e5e7eb;
}

.djy-spinner-fill {
  fill: #3b82f6;
}

@keyframes djy-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* =========================
   Results Counter
   ========================= */

/* Hide counter by default, show "–" until ready */
.djy-visible-count {
  font-size: 0;
}
.djy-visible-count::after {
  content: "–";
  font-size: 1rem;
}

/* Show actual count only when ready */
body.djy-ready .djy-visible-count {
  font-size: inherit;
}
body.djy-ready .djy-visible-count::after {
  content: none;
}

/* =========================
   Lazy Loading Images
   ========================= */

.collectionlistboats img[data-djy-lazy] {
  filter: blur(10px);
  transition: filter 0.3s ease;
}

.collectionlistboats img.djy-loaded {
  filter: none;
}

/* =========================
   Filter Tags — Dynamic tags (dark navy, matching Webflow placeholder)
   ========================= */

.djy-filter-tag {
  background-color: #152238 !important;
  color: #fff !important;
}

.djy-filter-tag .filter_tag-text {
  color: #fff !important;
}

/* =========================
   Boats List Page — Style Fixes
   ========================= */

/* 1. .searchdate heading — right align on tablet/desktop only */
@media (min-width: 992px) {
  .boatlistitemright .heading {
    text-align: right;
  }
}

/* 2. .searchdate — bold, right aligned, 20px */
.searchdate {
  font-weight: bold;
  text-align: right;
  font-size: 20px;
}

/* 3. Type and Cabins value divs — right-align to match Berths */
.specificationwrapperinnerholder > div:not(.text-bold) {
  text-align: right;
}

/* 4. .field-label — center on mobile instead of left-align */
@media (max-width: 991px) {
  .field-label {
    text-align: center;
  }
}

/* 5. .boatitempricelabel — remove custom font family, inherit card default */
.boatitempricelabel {
  font-family: inherit;
}