/**
 * @fileoverview Tablet-specific styles for landscape orientation
 * @description Media query targets devices between 768px and 1280px width in landscape mode
 * Includes performance optimizations for underpowered tablets
 */

@media (min-width: 768px) and (max-width: 1280px) and (orientation: landscape) {
  /* Tablet landscape styles */
  .accordion { 
    width: 40% !important;
  }

  button.nav.accordion-button {
    padding-top: 0px;
    padding-bottom: 0px;
  }
  
  /* Performance optimizations for tablets */
  * {
    /* Disable smooth scrolling on tablets for better performance */
    scroll-behavior: auto !important;
  }
  
  /* Reduce box shadows for better rendering performance */
  .route-card,
  #route-input-container {
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
  }
  
  /* Simplify hover effects on tablets */
  .route-card:hover,
  .btn-secondary:hover {
    transform: none !important;
  }
  
  /* Position autocomplete dropdown to top right for tablets */
  .ui-autocomplete {
    position: fixed !important;
    top: 50px !important;
    right: auto !important;
    left: 40% !important;
    max-width: 400px !important;
    width: 90% !important;
    max-height: 60vh !important;
  }
}

/* General tablet optimizations (portrait and landscape) */
@media (min-width: 768px) and (max-width: 1280px) {
  /* Reduce animation complexity on tablets */
  .hero-v2::before {
    display: none; /* Remove gradient overlay animation */
  }
  
  /* Optimize transitions */
  * {
    transition-duration: 0.15s !important; /* Faster transitions */
  }
}
