/* ==========================================================================
   Tours Page Styles (Gutenberg Blocks)
   ========================================================================== */

/* ==========================================================================
   Page Hero Cover
   ========================================================================== */
.page-hero-cover {
  position: relative;
}

.page-hero-cover .wp-block-cover__inner-container {
  padding: 6rem 2rem 4rem;
}

.page-hero-content {
  text-align: left;
}

.breadcrumb {
  margin-bottom: 1rem;
  font-size: 0.875rem;
}

.breadcrumb a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
}

.breadcrumb a:hover {
  color: white;
}

.breadcrumb .current {
  color: #dc3626;
}

.page-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: 2.5rem;
  margin: 0 0 0.5rem;
}

@media (min-width: 768px) {
  .page-hero-title {
    font-size: 3.5rem;
  }
}

.page-hero-subtitle {
  font-size: 1.25rem;
  opacity: 0.8;
  margin: 0;
}

/* ==========================================================================
   Tour Filter Buttons
   ========================================================================== */
.tour-filter-buttons {
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
}

.tour-filter-btn .wp-block-button__link {
  padding: 0.5rem 1rem;
  background: #e8ebe0 !important;
  color: #565f43 !important;
  border-radius: 9999px;
  font-family: 'Oswald', sans-serif;
  font-size: 0.875rem;
  border: none !important;
  transition: all 0.3s ease;
}

.tour-filter-btn .wp-block-button__link:hover {
  background: #565f43 !important;
  color: white !important;
}

/* ==========================================================================
   Tour Cards
   ========================================================================== */
.tour-card {
  background: white;
  border-radius: 0.75rem;
  overflow: visible;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin-bottom: 2rem;
}

.tour-card > .wp-block-group,
.tour-card > .wp-block-cover {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Force cover block to be a contained block element */
.tour-card-image.wp-block-cover {
  border-radius: 0.75rem 0.75rem 0 0 !important;
  min-height: 250px !important;
  max-height: 250px !important;
  position: relative !important;
  overflow: hidden !important;
  clip-path: inset(0 round 0.75rem 0.75rem 0 0);
}

/* Override WordPress cover inner container - position badges at top left */
.tour-card-image.wp-block-cover .wp-block-cover__inner-container {
  position: absolute !important;
  top: 0 !important;
  left: 0.5rem !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  min-height: auto !important;
  padding: 0 !important;
  z-index: 1;
}

/* Ensure the image background fills the cover area */
.tour-card-image.wp-block-cover .wp-block-cover__image-background {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 0 !important;
}

/* Ensure overlay background doesn't interfere */
.tour-card-image.wp-block-cover .wp-block-cover__background {
  z-index: 0 !important;
}

.tour-badges {
  gap: 0.5rem;
}

.tour-badge {
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-family: 'Oswald', sans-serif;
  margin: 0;
}

.tour-badge--duration {
  background: #dc3626;
  color: white;
}

.tour-badge--beginner {
  background: #5b9bd5;
  color: white;
}

.tour-badge--intermediate {
  background: #8b7355;
  color: white;
}

.tour-badge--advanced {
  background: #565f43;
  color: white;
}

.tour-card-content {
  padding: 1.5rem 1.5rem 0 1.5rem !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  background: white;
  position: relative;
  z-index: 2;
  --wp--style--block-gap: 0 !important;
  --wp--preset--spacing--40: 0 !important;
  --wp--preset--spacing--50: 0 !important;
}

.tour-card-content.wp-block-group,
.tour-card .wp-block-group.tour-card-content {
  padding-bottom: 0 !important;
}

.tour-card-content > * {
  margin: 0 0 1rem 0 !important;
}

.tour-card-content > *:last-child {
  margin-bottom: 0 !important;
}

.tour-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.75rem;
  color: #171923;
  margin: 0 0 1rem 0 !important;
}

.tour-card-description {
  color: #4a5568;
  margin: 0 0 1rem;
  line-height: 1.6;
}

/* Tour Features */
.tour-features {
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.tour-feature {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: #565f43;
  font-size: 0.875rem;
  margin: 0;
}

.tour-feature::before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23dc3626'%3E%3Cpath fill-rule='evenodd' d='M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: contain;
  flex-shrink: 0;
}

/* Tour Card Footer */
.tour-card-footer {
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
  flex-wrap: wrap !important;
  gap: 1rem;
}

.tour-card-footer > .wp-block-group {
  flex-shrink: 0;
}

.tour-card-footer .wp-block-buttons {
  flex-shrink: 0;
}

.tour-price-label {
  font-size: 0.875rem;
  color: #4a5568;
  margin: 0;
}

.tour-price {
  font-family: 'Oswald', sans-serif;
  font-size: 1.5rem;
  color: #dc3626;
  margin: 0;
}

.tour-book-btn .wp-block-button__link {
  padding: 0.75rem 1.5rem;
  border-radius: 9999px;
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}

/* ==========================================================================
   Can't Decide Box
   ========================================================================== */
.cant-decide-box {
  border-radius: 1rem;
  padding: 2rem;
  text-align: center;
  margin-top: 2rem;
}

.cant-decide-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  color: #171923;
  margin: 0 0 0.75rem;
}

.cant-decide-text {
  color: #4a5568;
  margin: 0 0 1.5rem;
}

.cant-decide-box .is-style-outline .wp-block-button__link {
  border-color: #565f43 !important;
  color: #565f43 !important;
}

.cant-decide-box .is-style-outline .wp-block-button__link:hover {
  background: #565f43 !important;
  color: white !important;
}

/* ==========================================================================
   Sidebar
   ========================================================================== */
.tours-sidebar {
  min-width: 0;
}

.sidebar-sticky {
  position: sticky;
  top: 100px;
}

.sidebar-cta-box,
.sidebar-facts-box,
.sidebar-about-box {
  border-radius: 0.75rem;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.sidebar-cta-title {
  font-family: 'Oswald', sans-serif;
  font-size: 1.25rem;
  margin: 0 0 0.75rem;
}

.sidebar-cta-text {
  margin: 0 0 1rem;
  font-size: 0.95rem;
}

.sidebar-cta-btn .wp-block-button__link {
  display: block;
  width: 100%;
  text-align: center;
  padding: 0.75rem 1.5rem;
  border-radius: 9999px;
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}

.sidebar-box-title {
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  text-transform: uppercase;
  margin: 0 0 1rem;
  color: #171923;
}

/* Sidebar Facts List */
.sidebar-facts-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.875rem;
  color: #4a5568;
}

.sidebar-facts-list li {
  margin-bottom: 0.75rem;
  padding-left: 1.75rem;
  position: relative;
}

.sidebar-facts-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 2px;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23dc3626' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
  background-size: contain;
}

.sidebar-facts-list li:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23dc3626' stroke-width='2'%3E%3Cpath d='M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z'/%3E%3C/svg%3E");
}

.sidebar-facts-list li:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23dc3626' stroke-width='2'%3E%3Cpath d='M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z'/%3E%3C/svg%3E");
}

.sidebar-facts-list li:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23dc3626' stroke-width='2'%3E%3Cpath d='M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z'/%3E%3C/svg%3E");
}

.sidebar-link {
  margin-top: 1rem;
}

.sidebar-link a {
  color: #dc3626;
  text-decoration: none;
  font-family: 'Oswald', sans-serif;
  font-size: 0.875rem;
  text-transform: uppercase;
}

.sidebar-link a:hover {
  text-decoration: underline;
}

/* Sidebar About */
.sidebar-about-text {
  color: #4a5568;
  font-size: 0.875rem;
  margin: 0 0 1rem;
  line-height: 1.6;
}

.sidebar-about-italic {
  font-style: italic;
}

.sidebar-about-highlight {
  color: #dc3626;
  font-family: 'Oswald', sans-serif;
  font-size: 0.875rem;
  margin: 0;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 781px) {
  .tours-sidebar {
    order: -1;
  }

  .sidebar-sticky {
    position: static;
  }
}
