/* ==========================================================================
   Bintan Traveling - Custom UI Enhancements
   ========================================================================== */

/* Header Navigation Links */
[data-header*="type-1"] .ct-header [data-transparent-row="yes"] [data-id="menu"] > ul > li > a,
[data-header*="type-1"] .ct-header [data-transparent-row="yes"] .ct-menu-link {
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.75), 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

/* Header Ghost Button (Explore Now) */
[data-header*="type-1"] .ct-header [data-id="button"] .ct-button-ghost {
  border-color: rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7) !important;
}

/* Header Search & Mobile Trigger Icons */
[data-header*="type-1"] [data-transparent-row="yes"] [data-id="search"] svg,
[data-header*="type-1"] [data-transparent-row="yes"] [data-id="trigger"] svg {
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.7));
}

/* Social Media Buttons - Clean Circular Outline & Shadow */
[data-header*="type-1"] .ct-header-socials .ct-social-box a,
.ct-header-socials .ct-social-box a {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  transform: none !important;
}

[data-header*="type-1"] .ct-header-socials .ct-social-box .ct-icon-container,
.ct-header-socials .ct-social-box .ct-icon-container {
  border: 1.5px solid rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
  transition: all 0.25s ease !important;
}

[data-header*="type-1"] .ct-header-socials .ct-social-box a:hover .ct-icon-container,
.ct-header-socials .ct-social-box a:hover .ct-icon-container {
  border-color: var(--theme-palette-color-1, #48bca2) !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.4) !important;
  transform: translateY(-2px);
}

[data-header*="type-1"] .ct-header-socials .ct-social-box a svg,
.ct-header-socials .ct-social-box a svg {
  fill: #ffffff !important;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5)) !important;
}

/* Main Hero Title ("Explore Bintan Island with Comfort and Easy") */
.elementor-6 .elementor-element.elementor-element-4e3a25d .elementor-heading-title,
.elementor-heading-title {
  text-shadow: 0 3px 14px rgba(0, 0, 0, 0.8), 0 1px 4px rgba(0, 0, 0, 0.95) !important;
}

/* Main Hero Subtitle / Paragraph ("Professional taxi services...") */
.elementor-6 .elementor-element.elementor-element-171e01b,
.elementor-6 .elementor-element.elementor-element-171e01b p {
  color: #ffffff !important;
  font-weight: 500 !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.85), 0 1px 3px rgba(0, 0, 0, 0.95) !important;
}

/* Feature Number Headings in Hero (01, 02, 03) */
.elementor-6 .elementor-element.elementor-element-7878394 .elementor-heading-title,
.elementor-6 .elementor-element.elementor-element-eb1daac .elementor-heading-title,
.elementor-6 .elementor-element.elementor-element-800b60f .elementor-heading-title {
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.75), 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

.elementor-6 .elementor-element.elementor-element-37410cc .elementor-heading-title,
.elementor-6 .elementor-element.elementor-element-2d7b637 .elementor-heading-title,
.elementor-6 .elementor-element.elementor-element-acd4bae .elementor-heading-title {
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.75), 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

/* ==========================================================================
   WhatsApp Floating Action Button (FAB) - Bottom Position & Animations
   ========================================================================== */

#ht-ctc-chat,
.ht-ctc-chat {
  top: auto !important;
  bottom: 25px !important;
  right: 25px !important;
  left: auto !important;
  position: fixed !important;
  z-index: 99999999 !important;
  display: flex !important;
  align-items: center !important;
}

/* WhatsApp Button Pulse Glow Animation */
@keyframes wa-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7), 0 4px 12px rgba(0, 0, 0, 0.25);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(37, 211, 102, 0), 0 4px 12px rgba(0, 0, 0, 0.25);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0), 0 4px 12px rgba(0, 0, 0, 0.25);
  }
}

#ht-ctc-chat .ht_ctc_padding {
  animation: wa-pulse 2s infinite !important;
  transition: transform 0.3s ease !important;
}

#ht-ctc-chat:hover .ht_ctc_padding {
  transform: scale(1.08) !important;
}

/* Slide-in Animation for Greeting Bubble */
@keyframes wa-slide-greeting {
  0% {
    opacity: 0;
    transform: translateX(35px) scale(0.85);
  }
  100% {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

#ht-ctc-chat .ctc_cta {
  display: flex !important;
  align-items: center !important;
  background-color: #ffffff !important;
  color: #1a1a1a !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  padding: 10px 16px !important;
  border-radius: 20px 20px 4px 20px !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18), 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  margin: 0 12px 0 0 !important;
  white-space: nowrap !important;
  animation: wa-slide-greeting 0.6s cubic-bezier(0.2, 0.9, 0.3, 1.2) 0.8s both !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Online Indicator Dot */
#ht-ctc-chat .ctc_cta::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background-color: #25D366;
  border-radius: 50%;
  margin-right: 8px;
  flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(37, 211, 102, 0.3);
}
