/* ======================================================
   CRITICAL FIX FOR 360px DEVICES
   Addresses persistent button visibility issues
   ====================================================== */

/* VIEWPORT-LEVEL POSITIONING - Completely independent of layout */
@media (max-width: 360px) {
  /* CRITICAL: Remove all layout constraints that push button down */
  html {
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }
  
  body {
    margin: 0 !important;
    padding: 0 !important;
    padding-bottom: 60px !important; /* Only bottom padding for button space */
    position: relative !important;
    overflow-x: hidden !important;
  }
  
  /* Force sticky button to ignore ALL layout constraints */
  .sticky-book-button {
    /* VIEWPORT POSITIONING - Independent of any parent elements */
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    height: 56px !important;
    
    /* MAXIMUM Z-INDEX */
    z-index: 2147483647 !important; /* Maximum possible z-index value */
    
    /* VISUAL STYLING */
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%) !important;
    color: white !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 0 !important;
    
    /* FORCE RESET ALL POSITIONING */
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0.9rem 1rem !important;
    transform: translateY(0) translateX(0) translateZ(0) !important;
    -webkit-transform: translateY(0) translateX(0) translateZ(0) !important;
    -moz-transform: translateY(0) translateX(0) translateZ(0) !important;
    -ms-transform: translateY(0) translateX(0) translateZ(0) !important;
    
    /* FORCE VISIBILITY */
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: flex !important;
    
    /* PREVENT ANY TRANSITIONS/ANIMATIONS THAT COULD HIDE IT */
    transition: none !important;
    animation: none !important;
    
    /* SHADOW FOR VISIBILITY */
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.25) !important;
  }
  
  /* ENSURE BUTTON CONTENT IS VISIBLE */
  .sticky-book-button i {
    display: inline-block !important;
    font-size: 1rem !important;
    margin-right: 0.25rem !important;
    color: white !important;
    opacity: 1 !important;
  }
  
  .sticky-book-button span,
  .sticky-book-button:not(i) {
    color: white !important;
    opacity: 1 !important;
    display: inline-block !important;
  }
  
  /* FIX HERO SECTION LAYOUT ISSUES */
  .hero-section {
    /* Prevent hero from pushing button down */
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 60px !important; /* Space for button */
    min-height: calc(100vh - 60px) !important;
    max-height: calc(100vh - 60px) !important;
    position: relative !important;
    overflow: hidden !important;
  }
  
  .hero-content {
    /* Prevent hero content from interfering with button */
    margin: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    bottom: 80px !important;
    position: absolute !important;
    top: 50px !important; /* Small top margin */
    left: 0 !important;
    right: 0 !important;
  }
  
  /* Force all potentially interfering elements to lower z-index */
  .modal,
  .modal-content,
  .close-modal,
  .reviews-section,
  .qa-container,
  .floating-social,
  .video-controls,
  .notification-container,
  .privacy-center-btn,
  .floating-social-container,
  .site-header,
  .desktop-nav,
  .mobile-nav,
  .services-section,
  .booking-wrapper,
  .footer,
  .gdpr-banner,
  .cookie-banner {
    z-index: 999999 !important; /* Much lower than sticky button */
  }
  
  /* Remove any background elements that could hide the button */

  /* Prevent pseudo-elements from creating overlays */
  body::before,
  body::after,
  html::before,
  html::after,
  .hero-section::before,
  .hero-section::after,
  .hero-content::before,
  .hero-content::after {
    display: none !important;
  }
  
  /* Ensure sections following hero don't interfere */
  .services-section,
  .related-services,
  .blog-preview-section,
  .booking-guide,
  .booking-wrapper {
    margin-top: 0 !important;
    padding-top: 1rem !important;
  }
  
  /* CRITICAL: Force button to stay at viewport bottom regardless of scroll */
  .sticky-book-button {
    position: fixed !important;
    bottom: 0 !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
  
  /* ULTIMATE OVERRIDE: Completely ignore any parent positioning */
  .sticky-book-button {
    position: fixed !important;
    bottom: 0px !important;
    left: 0px !important;
    right: 0px !important;
    top: auto !important;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0px !important;
    padding: 0.9rem 1rem !important;
    z-index: 2147483647 !important;
    transform: translate3d(0, 0, 0) !important;
    will-change: auto !important;
  }
  
  /* COMPLETE CSS RESET FOR BUTTON - Break all inheritance */
  .sticky-book-button {
    /* POSITIONING RESET */
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    
    /* DIMENSIONS RESET */
    width: 100vw !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    min-width: 100vw !important;
    max-width: 100vw !important;
    
    /* SPACING RESET */
    margin: 0 !important;
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    padding: 0.9rem 1rem !important;
    border: 0 !important;
    outline: 0 !important;
    
    /* DISPLAY RESET */
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    
    /* TEXT RESET */
    font-family: inherit !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    line-height: normal !important;
    text-align: center !important;
    text-decoration: none !important;
    color: white !important;
    
    /* BACKGROUND RESET */
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%) !important;
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-origin: padding-box !important;
    background-size: auto !important;
    
    /* TRANSFORM RESET */
    transform: translateX(0) translateY(0) translateZ(0) !important;
    transform-origin: center center !important;
    transform-style: flat !important;
    
    /* VISIBILITY RESET */
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    
    /* INTERACTION RESET */
    pointer-events: auto !important;
    cursor: pointer !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    
    /* ANIMATION RESET */
    animation: none !important;
    transition: none !important;
    will-change: auto !important;
    
    /* LAYER RESET */
    z-index: 2147483647 !important;
    isolation: auto !important;
    mix-blend-mode: normal !important;
    
    /* SHADOW */
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.25) !important;
    filter: none !important;
    backdrop-filter: none !important;
    
    /* BORDER RESET */
    border-radius: 0 !important;
    border-style: none !important;
    border-width: 0 !important;
    border-color: transparent !important;
  }
  
  .floating-social {
    bottom: 70px !important; /* Sits above sticky button */
    right: 1rem !important;
    z-index: 2147483646 !important; /* Just below sticky-book-button */
    position: fixed !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
  }
}

/* Extra specific targeting for 360x640 devices */
@media (max-width: 360px) and (max-height: 640px) {
  .sticky-book-button {
    min-height: 56px !important;
    max-height: 56px !important;
    bottom: 0 !important;
    position: fixed !important;
    z-index: 2147483647 !important;
    /* Force to bottom of viewport */
    top: auto !important;
    margin-top: 0 !important;
    transform: none !important;
  }
  
  /* Extra tight layout control */
  .hero-section {
    height: calc(100vh - 56px) !important;
    margin: 0 !important;
  }
  
  .hero-content {
    bottom: 70px !important;
    top: 40px !important;
  }
}

/* Failsafe for very small devices */
@media (max-width: 320px) {
  .sticky-book-button {
    font-size: 0.85rem !important;
    padding: 0.8rem 0.8rem !important;
    min-height: 52px !important;
    z-index: 2147483647 !important;
    bottom: 0 !important;
    position: fixed !important;
    margin-top: 0 !important;
    transform: none !important;
  }
}