/* Mobile Responsive CSS for Siri Tax Portal */

/* Viewport and Base Mobile Styles */
@media screen and (max-width: 768px) {
  
  /* Reset fixed widths */
  .main, .header, .mid_pannel, .fbg, .body, .footer {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 15px !important;
    box-sizing: border-box;
  }
  
  /* Header adjustments */
  .logo {
    width: 100% !important;
    text-align: center;
    margin: 15px 0 !important;
  }
  
  .callus {
    width: 100% !important;
    text-align: center;
    padding: 10px 0 !important;
  }
  
  /* Mobile Navigation */
  .nav2 {
    width: 100% !important;
    flex-direction: column;
    display: flex;
  }
  
  .nav2 li.mid {
    width: 100% !important;
    display: block;
    float: none !important;
  }
  
  .nav2 li a.mid_link {
    width: 100% !important;
    padding: 15px !important;
    text-align: center;
    font-size: 16px !important;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* Hide dropdown menus on mobile - convert to accordion style */
  .nav2 ul.sub2 {
    position: static !important;
    width: 100% !important;
    background: #6B9300 !important;
    display: none;
  }
  
  .nav2 li:hover ul.sub2 {
    display: block !important;
  }
  
  /* Content layout */
  .body_big, .body_small {
    width: 100% !important;
    float: none !important;
    margin: 10px 0 !important;
  }
  
  .body_big_inner, .body_small_inner {
    width: 100% !important;
    margin: 0 !important;
    padding: 15px !important;
  }
  
  /* Three column layout to single column */
  .fbg_resize, .mid_resize {
    width: 100% !important;
    float: none !important;
    margin: 15px 0 !important;
    padding: 15px !important;
  }
  
  /* Images responsive */
  img {
    max-width: 100% !important;
    height: auto !important;
  }
  
  /* Header slider */
  .header_text, .header_text_inner {
    width: 100% !important;
    height: auto !important;
  }
  
  .gallery, #slider, #slider li {
    width: 100% !important;
    height: auto !important;
  }
  
  .left1 {
    width: 100% !important;
    margin: 0 !important;
    padding: 20px !important;
  }
  
  /* Footer adjustments */
  .flinks {
    width: 100% !important;
    margin: 15px 0 !important;
    text-align: center;
  }
  
  /* Touch targets */
  a, button, input[type="submit"] {
    min-height: 44px;
    min-width: 44px;
    padding: 12px 16px;
  }
  
  /* Form elements */
  input, textarea, select {
    width: 100% !important;
    font-size: 16px; /* Prevents zoom on iOS */
    padding: 12px;
    box-sizing: border-box;
  }
  
  /* Text sizing */
  body {
    font-size: 14px !important;
  }
  
  h1 { font-size: 24px !important; }
  h2 { font-size: 20px !important; }
  h3 { font-size: 18px !important; }
  
  /* Hide elements that don't work well on mobile */
  #loopedSlider {
    position: static !important;
    width: 100% !important;
    margin: 20px 0 !important;
  }
  
  /* Contact form mobile */
  #contactform {
    margin: 0 !important;
    padding: 15px !important;
  }
  
  #contactform input.text, #contactform textarea {
    width: 100% !important;
  }
}

/* Tablet styles */
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .main, .header, .mid_pannel, .fbg, .body {
    width: 100% !important;
    max-width: 1024px !important;
    padding: 0 20px !important;
  }
  
  .fbg_resize {
    width: 30% !important;
  }
}