/* Liveaboard.com-inspired diving safari layout */
.lb-page { --lb-ocean: #0a3d5c; --lb-teal: #00a8b5; --lb-sand: #f4f7f9; }

.lb-hero {
  position: relative;
  min-height: 420px;
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, rgba(10, 61, 92, 0.88), rgba(0, 88, 120, 0.75)),
    url('https://images.unsplash.com/photo-1607073766567-c2b688e2b255?w=1920&q=80') center/cover no-repeat;
  color: #fff;
  padding: 60px 0 80px;
}
.lb-hero .container { width: 100%; }
.lb-hero h1 { font-size: clamp(2rem, 5vw, 3rem); font-weight: 900; margin-bottom: 8px; }
.lb-hero .lb-tagline { font-size: 1.15rem; opacity: 0.95; margin-bottom: 28px; }

.lb-search-box {
  background: #fff;
  border-radius: 12px;
  padding: 20px 24px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
  max-width: 900px;
}
.lb-search-row {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 12px;
  align-items: end;
}
.lb-search-field label {
  display: block;
  font-size: 0.75rem;
  font-weight: 800;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 6px;
  letter-spacing: 0.04em;
}
.lb-search-field select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 1rem;
  color: #1e293b;
  background: #fff;
}
.lb-search-btn {
  padding: 13px 32px;
  background: linear-gradient(135deg, #e85d04, #f48c06);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-weight: 800;
  font-size: 1rem;
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.15s, box-shadow 0.15s;
}
.lb-search-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(232, 93, 4, 0.4); }

.lb-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 24px;
  font-size: 0.9rem;
  font-weight: 700;
}
.lb-trust span::before { content: '✓ '; color: #4ecdc4; }

.lb-types {
  padding: 48px 0;
  background: var(--lb-sand);
}
.lb-types h2 { text-align: center; margin-bottom: 28px; color: var(--lb-ocean); }
.lb-types-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}
.lb-type-card {
  background: #fff;
  border-radius: 12px;
  padding: 24px 20px;
  text-align: center;
  box-shadow: 0 2px 12px rgba(10, 61, 92, 0.08);
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
  border: 2px solid transparent;
}
.lb-type-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(10, 61, 92, 0.12);
  border-color: var(--lb-teal);
}
.lb-type-card strong { display: block; font-size: 1.1rem; color: var(--lb-ocean); margin-bottom: 6px; }
.lb-type-card em { font-style: normal; color: var(--lb-teal); font-weight: 800; font-size: 1.25rem; }

.lb-main { padding: 40px 0 60px; }
.lb-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 28px;
  align-items: start;
}
.lb-sidebar {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 16px rgba(10, 61, 92, 0.06);
  position: sticky;
  top: 90px;
}
.lb-sidebar h3 { font-size: 1rem; color: var(--lb-ocean); margin-bottom: 16px; }
.lb-filter { margin-bottom: 16px; }
.lb-filter label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #94a3b8;
  margin-bottom: 6px;
}
.lb-filter select {
  width: 100%;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 0.9rem;
}

.lb-results-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}
.lb-results-head h2 { color: var(--lb-ocean); font-size: 1.35rem; }
.lb-results-count { color: #64748b; font-size: 0.95rem; }

.lb-trip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}
.lb-trip-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(10, 61, 92, 0.08);
  display: flex;
  flex-direction: column;
  border: 1px solid #e8eef2;
  transition: box-shadow 0.2s;
}
.lb-trip-card:hover { box-shadow: 0 8px 28px rgba(10, 61, 92, 0.14); }
.lb-trip-card-clickable { cursor: pointer; }
.lb-trip-card-clickable:focus-visible { outline: 3px solid var(--lb-teal); outline-offset: 2px; }
.lb-trip-map-link, .lb-trip-map-btn, .boat-route-map-btn, .boat-route-map { display: none !important; }
.lb-trip-card-media { position: relative; }
.lb-trip-card-img {
  height: 140px;
  background: linear-gradient(135deg, #0c4a6e, #0891b2);
  background-size: cover;
  background-position: center;
  position: relative;
}
.lb-trip-img-thumbs {
  display: flex;
  gap: 4px;
  padding: 6px 8px;
  background: #f8fafc;
  border-bottom: 1px solid #e8eef2;
  overflow-x: auto;
}
.lb-trip-img-thumb {
  flex: 0 0 44px;
  width: 44px;
  height: 32px;
  border: 2px solid transparent;
  border-radius: 4px;
  padding: 0;
  cursor: pointer;
  background-size: cover;
  background-position: center;
  opacity: 0.75;
  transition: opacity 0.15s, border-color 0.15s;
}
.lb-trip-img-thumb:hover,
.lb-trip-img-thumb.active {
  opacity: 1;
  border-color: var(--lb-teal);
}
.lb-trip-status {
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.95);
  color: #1e40af;
}
.lb-trip-card[data-status="full"] .lb-trip-status { color: #991b1b; }
.lb-trip-card[data-status="limited"] .lb-trip-status { color: #92400e; }
.lb-trip-card-body { padding: 18px 18px 12px; flex: 1; }
.lb-trip-card-body h3 { color: var(--lb-ocean); font-size: 1.15rem; margin-bottom: 4px; }
.lb-trip-route { color: var(--lb-teal); font-weight: 700; font-size: 0.88rem; margin-bottom: 14px; line-height: 1.4; }
.lb-trip-meta { display: grid; gap: 8px; font-size: 0.88rem; color: #475569; }
.lb-trip-meta strong { color: #1e293b; }
.lb-trip-card-foot {
  padding: 14px 18px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #f1f5f9;
}
.lb-trip-price { font-size: 1.35rem; font-weight: 900; color: var(--lb-ocean); }
.lb-trip-price small { font-size: 0.75rem; font-weight: 600; color: #94a3b8; display: block; }

.lb-help {
  background: linear-gradient(135deg, var(--lb-ocean), #0e7490);
  color: #fff;
  padding: 48px 0;
  text-align: center;
}
.lb-help h2 { margin-bottom: 12px; }
.lb-help p { opacity: 0.9; margin-bottom: 24px; }
.lb-help-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}
.lb-help-actions a {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  padding: 14px 28px;
  border-radius: 8px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: background 0.2s;
}
.lb-help-actions a:hover { background: rgba(255, 255, 255, 0.28); }

.lb-about { padding: 48px 0; }
.lb-about p { color: #475569; line-height: 1.85; max-width: 800px; margin: 0 auto 16px; text-align: center; }

.lb-reviews { padding: 48px 0; background: var(--lb-sand); }
.lb-reviews h2 { text-align: center; color: var(--lb-ocean); margin-bottom: 28px; }
.lb-reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}
.lb-review-card {
  background: #fff;
  padding: 22px;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(10, 61, 92, 0.06);
}
.lb-review-card .stars { color: #f4c430; margin-bottom: 10px; }
.lb-review-card p { font-size: 0.92rem; color: #475569; line-height: 1.6; margin-bottom: 12px; }
.lb-review-card cite { font-size: 0.82rem; color: #94a3b8; font-style: normal; }

.lb-sync { text-align: center; font-size: 0.8rem; color: #94a3b8; margin-top: 16px; }

.lb-boat-link { color: inherit; text-decoration: none; border-bottom: 2px solid var(--lb-teal); transition: color 0.15s; }
.lb-boat-link:hover { color: var(--lb-teal); }

/* Boat detail page */
.boat-breadcrumb { padding: 16px 0 8px; font-size: 0.88rem; color: #64748b; }
.boat-breadcrumb a { color: var(--lb-ocean); text-decoration: none; font-weight: 700; }
.boat-breadcrumb a:hover { text-decoration: underline; }

.boat-hero {
  position: relative;
  min-height: 380px;
  background-size: cover;
  background-position: center;
  color: #fff;
}
.boat-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(10, 61, 92, 0.85), rgba(0, 88, 120, 0.55));
}
.boat-hero-inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: end;
  padding: 48px 0 56px;
}
.boat-region { text-transform: uppercase; font-size: 0.8rem; letter-spacing: 0.08em; opacity: 0.9; margin-bottom: 8px; }
.boat-hero h1 { font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 900; margin-bottom: 8px; }
.boat-tagline { font-size: 1.05rem; opacity: 0.92; margin-bottom: 16px; max-width: 560px; }
.boat-rating-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 14px; }
.boat-rating-pill { background: #16a34a; padding: 6px 14px; border-radius: 6px; font-weight: 800; font-size: 0.95rem; }
.boat-review-count { font-size: 0.9rem; opacity: 0.9; }
.boat-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.boat-badge { background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.35); padding: 5px 12px; border-radius: 20px; font-size: 0.78rem; font-weight: 700; }

.boat-hero-price {
  background: #fff;
  color: var(--lb-ocean);
  padding: 24px 28px;
  border-radius: 12px;
  text-align: center;
  min-width: 200px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.2);
}
.boat-hero-price small { display: block; font-size: 0.75rem; text-transform: uppercase; color: #94a3b8; font-weight: 800; }
.boat-hero-price strong { display: block; font-size: 1.75rem; font-weight: 900; margin: 4px 0; }
.boat-hero-price > span { font-size: 0.82rem; color: #64748b; }
.boat-cta-wa {
  display: block;
  margin-top: 14px;
  padding: 12px 20px;
  background: linear-gradient(135deg, #25d366, #128c7e);
  color: #fff;
  border-radius: 8px;
  font-weight: 800;
  text-decoration: none;
  font-size: 0.92rem;
}

.boat-gallery-section { padding: 32px 0; background: var(--lb-sand); }
.boat-gallery-main {
  height: 420px;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
  margin-bottom: 12px;
  box-shadow: 0 8px 30px rgba(10, 61, 92, 0.12);
}
.boat-gallery-thumbs { display: flex; gap: 10px; flex-wrap: wrap; }
.boat-gallery-thumb {
  width: 100px;
  height: 72px;
  border-radius: 8px;
  border: 3px solid transparent;
  background-size: cover;
  background-position: center;
  cursor: pointer;
  padding: 0;
  opacity: 0.75;
  transition: opacity 0.15s, border-color 0.15s;
}
.boat-gallery-thumb.active, .boat-gallery-thumb:hover { opacity: 1; border-color: var(--lb-teal); }

.boat-departures { padding: 48px 0; }
.boat-departures h2 { color: var(--lb-ocean); margin-bottom: 6px; }
.boat-dep-sub { color: #64748b; margin-bottom: 20px; font-size: 0.92rem; }

.boat-month-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}
.boat-month-tab {
  padding: 10px 18px;
  border: 2px solid #e2e8f0;
  background: #fff;
  border-radius: 8px;
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--lb-ocean);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.boat-month-tab em { font-style: normal; color: #94a3b8; font-weight: 600; }
.boat-month-tab.active, .boat-month-tab:hover {
  border-color: var(--lb-teal);
  background: #f0fdfa;
}

.boat-table-wrap { overflow-x: auto; border-radius: 12px; border: 1px solid #e2e8f0; }
.boat-dep-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.boat-dep-table th {
  background: var(--lb-ocean);
  color: #fff;
  text-align: left;
  padding: 14px 16px;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.boat-dep-table td { padding: 16px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.boat-dep-table tbody tr:hover { background: #f8fafc; }
.boat-dates-sub { font-size: 0.82rem; color: #94a3b8; }
.boat-dep-table td small { color: #64748b; }
.boat-dep-table td[data-label="Price"] strong { display: block; color: var(--lb-ocean); font-size: 1.1rem; }
.boat-dep-table td[data-label="Price"] small { color: #94a3b8; font-size: 0.75rem; }

.boat-avail { font-size: 0.85rem; font-weight: 700; }
.boat-status-full { color: #991b1b; }
.boat-status-limited { color: #92400e; }
.boat-status-confirmed { color: #1d4ed8; }
.boat-status-available { color: #15803d; }

.boat-actions { display: flex; flex-wrap: wrap; gap: 8px; white-space: nowrap; }
.boat-btn {
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 0.82rem;
  font-weight: 800;
  border: none;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
.boat-btn-cabin { background: #e2e8f0; color: #64748b; cursor: not-allowed; }
.boat-btn-wa { background: linear-gradient(135deg, #25d366, #128c7e); color: #fff; }
.boat-btn-muted { font-size: 0.82rem; color: #991b1b; font-weight: 700; }

.boat-cabin-note {
  margin-top: 16px;
  padding: 12px 16px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  font-size: 0.88rem;
  color: #92400e;
}

.boat-features { padding: 48px 0; background: var(--lb-sand); }
.boat-tab-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 24px;
  border-bottom: 2px solid #e2e8f0;
  padding-bottom: 12px;
}
.boat-tab-btn {
  padding: 10px 16px;
  border: none;
  background: transparent;
  font-weight: 700;
  font-size: 0.88rem;
  color: #64748b;
  cursor: pointer;
  border-radius: 6px 6px 0 0;
  border-bottom: 3px solid transparent;
  margin-bottom: -14px;
}
.boat-tab-btn.active { color: var(--lb-ocean); border-bottom-color: var(--lb-teal); }
.boat-tab-panel { display: none; padding: 8px 0 24px; color: #475569; line-height: 1.75; }
.boat-tab-panel.active { display: block; }
.boat-tab-panel h4 { color: var(--lb-ocean); margin: 20px 0 10px; }

.boat-highlights, .boat-feature-list, .boat-checklist { margin: 16px 0; padding-left: 1.25rem; }
.boat-highlights li, .boat-feature-list li, .boat-checklist li { margin-bottom: 8px; }
.boat-checklist-warn li { color: #92400e; }

.boat-specs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 20px;
}
.boat-spec {
  background: #fff;
  padding: 14px 16px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}
.boat-spec strong { display: block; font-size: 0.72rem; text-transform: uppercase; color: #94a3b8; margin-bottom: 4px; }
.boat-spec span { font-weight: 800; color: var(--lb-ocean); }

.boat-cabin-type {
  background: #fff;
  padding: 14px 18px;
  border-radius: 8px;
  margin-bottom: 10px;
  font-weight: 700;
  color: var(--lb-ocean);
  border: 1px solid #e2e8f0;
}

.boat-scores { margin-top: 32px; }
.boat-scores h3 { color: var(--lb-ocean); margin-bottom: 16px; }
.boat-scores-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; }
.boat-score {
  background: #fff;
  padding: 16px;
  border-radius: 8px;
  text-align: center;
  border: 1px solid #e2e8f0;
}
.boat-score span { display: block; font-size: 0.75rem; text-transform: capitalize; color: #94a3b8; margin-bottom: 4px; }
.boat-score strong { font-size: 1.35rem; color: var(--lb-ocean); }

@media (max-width: 900px) {
  .boat-hero-inner { grid-template-columns: 1fr; }
  .boat-hero-price { justify-self: start; }
  .boat-gallery-main { height: 260px; }
  .boat-dep-table thead { display: none; }
  .boat-dep-table tr { display: block; margin-bottom: 16px; border: 1px solid #e2e8f0; border-radius: 10px; padding: 8px; }
  .boat-dep-table td { display: block; border: none; padding: 8px 12px; }
  .boat-dep-table td::before { content: attr(data-label); font-weight: 800; color: var(--lb-ocean); display: block; font-size: 0.72rem; text-transform: uppercase; margin-bottom: 4px; }
  .boat-dep-table td.boat-actions::before { display: none; }
  .lb-search-row { grid-template-columns: 1fr; }
  .lb-layout { grid-template-columns: 1fr; }
  .lb-sidebar { position: static; }
  .lb-hero { min-height: 360px; padding: 40px 0 60px; }
}

/* Trip detail page */
.tp-hero {
  position: relative;
  min-height: 320px;
  background: center/cover no-repeat #0c4a6e;
  color: #fff;
  padding: 32px 0 48px;
}
.tp-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 61, 92, 0.55), rgba(10, 61, 92, 0.88));
}
.tp-hero-inner { position: relative; z-index: 1; }
.tp-breadcrumb { font-size: 0.85rem; margin-bottom: 16px; opacity: 0.9; }
.tp-breadcrumb a { color: #fff; text-decoration: none; }
.tp-status {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.95);
  color: #1e40af;
  margin-bottom: 12px;
}
.tp-hero h1 { font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 900; margin-bottom: 8px; }
.tp-boat a { color: #a5f3fc; font-weight: 700; }
.tp-dates { opacity: 0.92; font-size: 1rem; }
.tp-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 32px;
  padding: 40px 0 60px;
  align-items: start;
}
.tp-section { margin-bottom: 36px; }
.tp-section h2 { color: var(--lb-ocean); font-size: 1.35rem; margin-bottom: 16px; }
.tp-facts { display: grid; gap: 12px; }
.tp-facts div { display: grid; grid-template-columns: 140px 1fr; gap: 12px; font-size: 0.95rem; }
.tp-facts dt { font-weight: 700; color: #334155; }
.tp-facts dd { color: #475569; margin: 0; }
.tp-days { display: grid; gap: 16px; }
.tp-day { background: #f8fafc; border-radius: 10px; padding: 16px 18px; border: 1px solid #e8eef2; }
.tp-day h3 { color: var(--lb-ocean); font-size: 1rem; margin-bottom: 6px; }
.tp-list { padding-left: 1.2rem; color: #475569; display: grid; gap: 6px; }
.tp-gallery-hero {
  height: 360px;
  border-radius: 12px;
  background: center/cover no-repeat #e2e8f0;
  margin-bottom: 12px;
}
.tp-gallery-thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.tp-gallery-thumb {
  width: 88px;
  height: 64px;
  border-radius: 8px;
  border: 2px solid transparent;
  background: center/cover no-repeat #e2e8f0;
  cursor: pointer;
  padding: 0;
}
.tp-gallery-thumb.active { border-color: var(--lb-teal); }
.tp-sites-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.tp-book-card {
  position: sticky;
  top: 24px;
  background: #fff;
  border: 1px solid #e8eef2;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(10, 61, 92, 0.08);
}
.tp-book-price { font-size: 1.75rem; font-weight: 900; color: var(--lb-ocean); margin-bottom: 8px; }
.tp-book-price small { font-size: 0.75rem; font-weight: 600; color: #64748b; display: block; }
.tp-book-dates, .tp-book-avail { color: #475569; font-size: 0.92rem; margin-bottom: 8px; }
.tp-book-card .btn { width: 100%; margin-top: 12px; text-align: center; }
.tp-back { display: block; margin-top: 16px; text-align: center; color: var(--lb-teal); font-size: 0.9rem; }
@media (max-width: 900px) {
  .tp-layout { grid-template-columns: 1fr; }
  .tp-book-card { position: static; }
  .tp-gallery-hero { height: 240px; }
  .tp-facts div { grid-template-columns: 1fr; gap: 4px; }
}