/* css/ail-finder.css */

/* Critical: Full height layout setup */
html, body {
  margin: 0;
  padding: 0;
  height: 100vh; /* Use viewport height instead of 100% */
  overflow: hidden; /* Prevent body scroll since map handles its own */
  display: flex;
  flex-direction: column;
}

/* Remove any default margins/padding that might interfere */
* {
  box-sizing: border-box;
}

/* Ensure main takes remaining space */
main {
  flex: 1;
  position: relative;
  overflow: hidden;
  min-height: 0; /* Important for flex children */
  width: 100%;
}

/* Map container fills main completely */
#map {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

/* Animation keyframes */
.pulse-dot {
  animation: pulse-dot 2s infinite;
}

@keyframes pulse-dot {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.1); opacity: 0.7; }
  100% { transform: scale(1); opacity: 1; }
}

.slide-in-right { animation: slideInRight 0.3s ease-out; }
@keyframes slideInRight { from { transform: translateX(100%); } to { transform: translateX(0); } }

.slide-out-right { animation: slideOutRight 0.3s ease-in; }
@keyframes slideOutRight { from { transform: translateX(0); } to { transform: translateX(100%); } }

.slide-in-left { animation: slideInLeft 0.3s ease-out; }
@keyframes slideInLeft { from { transform: translateX(-100%); } to { transform: translateX(0); } }

.slide-out-left { animation: slideOutLeft 0.3s ease-in; }
@keyframes slideOutLeft { from { transform: translateX(0); } to { transform: translateX(-100%); } }

.floating-search {
  backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  .absolute.top-6.left-6 .w-80 {
    width: calc(100vw - 3rem);
  }

  .absolute.top-6.right-6.w-80 {
    width: calc(100vw - 3rem);
    right: 1.5rem;
  }
}

/* Ensure header and footer don't have unexpected margins */
header, footer {
  flex-shrink: 0;
}

/* Remove any potential margin from the footer */
footer {
  margin-top: 0 !important;
}