/* Default styles for larger screens (desktops/tablets) */
.phone-input {
    .react-tel-input {
      .form-control {
        width: 100%;
      }
    }
  
    /* Disabled state styling */
    // .react-tel-input:disabled {
    //   background-color: #f5f5f5;
    // }
  }
  
//   /* For tablets and smaller screens (max-width: 1024px) */
//   @media (max-width: 1024px) {
//     .phone-input {
//       .react-tel-input {
//         .form-control {
//           width: 100%;
//         }
//       }
  
//       /* Disabled state for mobile/tablet */
//     //   .react-tel-input:disabled {
//     //     background-color: #f5f5f5;
//     //   }
//     }
//   }
  
//   /* For smaller devices like mobile phones (max-width: 768px) */
//   @media (max-width: 768px) {
//     .phone-input {
//       .react-tel-input {
//         .form-control {
//           width: 100%;
//           font-size: 14px;  /* Adjust font size for smaller screens */
//         }
//       }
  
//     //   .react-tel-input:disabled {
//     //     background-color: #f5f5f5;
//     //   }
//     }
//   }
  
//   /* For very small mobile screens (max-width: 480px) */
//   @media (max-width: 480px) {
//     .phone-input {
//       .react-tel-input {
//         .form-control {
//           width: 100%;
//           font-size: 12px;  /* Even smaller font for very small screens */
//         }
//       }
  
//     //   .react-tel-input:disabled {
//     //     background-color: #f5f5f5;
//     //   }
//     }
//   }