/* 
 * ICL Website - Responsive Fixes
 * This file contains fixes for mobile responsiveness issues,
 * particularly focusing on preventing horizontal scrolling
 */

/* Ensure no horizontal scrolling on mobile */
@media screen and (max-width: 767px) {
  html, body {
    overflow-x: hidden;
    position: relative;
    width: 100%;
  }
  
  .container, 
  .container-fluid, 
  .row,
  main {
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
  }
  
  /* Add padding only to direct children of body */
  body > .container,
  body > .container-fluid {
    padding-left: 10px;
    padding-right: 10px;
  }
  
  img {
    max-width: 100%;
    height: auto;
  }
  
  /* Fix carousel on small screens */
  #Carousel .carousel-text {
    width: 100% !important;
    padding: 0 15px;
    max-width: 100% !important;
  }
  
  /* Fix for mobile tables */
  .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  /* Fix for PDF container in results page */
  .mobile-pdf-container {
    width: 100% !important;
    margin: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }
  
  /* Fix for horizontal forms */
  .horizontal-form {
    flex-direction: column;
    width: 100%;
  }
  
  .form-group {
    width: 100%;
  }
  
  /* Fix for sections with negative margins */
  [class*="offset-"], 
  [class*="push-"], 
  [class*="pull-"] {
    position: static;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
  }
}

/* Medium devices */
@media screen and (min-width: 768px) and (max-width: 991px) {
  #Carousel .carousel-text {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .container, .container-fluid {
    max-width: 100%;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }
}

/* Fix specific components */
@media screen and (max-width: 767px) {
  .heading-shade {
    max-width: 100% !important;
  }
  
  .carousel-item h1 {
    font-size: 2rem !important;
  }
  
  .carousel-item p {
    font-size: 1rem !important;
  }
  
  .HomeCTA a {
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
  }
} 
/* Hide any breadcrumb containers */
#breadcrumbs-container, 
.breadcrumbs-container {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}