/* General Styles */

/*added by faheem starts*/

    .p-mob {
        padding: 30px 120px;
    }
  .ped{
      
      padding: 50px 100px !important;
  }  

input[type=text], input[type=email], input[type=number], input[type=search],
input[type=password], input[type=tel], input[type=date], input[type=time], textarea, select {
  font-size: 15px;
  font-weight: $fontlight;
  background-color:$white;
  border:1px solid #000;
  border-radius:5px;
  padding: 12px 20px;
  color: $bgrey;
  margin-bottom: 0; 
  height:50px;
  box-shadow: none;
  width: $size100;
  &:focus{
  	outline:none;
  	transition: all 0.5s ease;
  	box-shadow:none;
  }
}

label {
    display: inline-block;
    color: #000;
    margin-bottom: 8px;
    font-weight: 500;
    font-size: 15px;
}

/*added by faheem ends*/

.dropdown-menu>li>a {
    border: none;
    display: block;
    width: 100%;
}

.bootstrap-select .dropdown-menu li {
    position: relative;
    display: block;
}

/* Ensure each option in the dropdown appears on its own line */
.selectpicker option {
    display: block;
    width: 100%;
}

/* Custom styles for the dropdown button */
.btn-custom-dropdown {
    background-color: transparent !important;
    color: #223B64 !important;
    border: 1px solid #223B64 !important;
    width: 100%;
    /* Ensure the button takes full width */
}

/* Custom styles for the dropdown button on hover */
.btn-custom-dropdown:hover {
    background-color: transparent !important;
    color: #223B64 !important;
    border: 1px solid #223B64 !important;
}

/* Custom styles for dropdown items */
.dropdown-item-custom {
    color: #223B64 !important;
}

.dropdown-item-custom:hover {
    background-color: transparent !important;
    color: #223B64 !important;
}

div.dropdown-menu.show {
    width: 100%;
}

/* Mobile responsiveness */
@media (max-width: 767px) {

    .col-lg-6,
    .col-md-12,
    .col-12 {
        width: 100% !important;
        margin-bottom: 15px;
        /* Space between stacked dropdowns */
    }

    /* Make sure dropdowns do not stretch across the entire width */
    .selectpicker {
        width: 100% !important;
        max-width: 400px;
        /* Limit the max width of dropdowns */
        margin: 0 auto;
        /* Center the dropdown */
    }

    /* Adjust button width and font size for mobile */
    .btn-custom-dropdown {
        font-size: 16px;
    }
    .ped{
    
    padding: 10px 10px !important;
}

.p-mob {
        padding: 40px 20px 20px 20px !important;
    }
    
}

/* For larger screens, limit the max width of the dropdowns */
@media (min-width: 768px) {
    .selectpicker {
        width: 100% !important;
        max-width: 400px;
        /* Limit the max width */
        margin: 0 auto;
        /* Center the dropdown */
    }
}