#header { 
  background: rgb(104, 201, 196) !important; 
}

#search_widget {
  width: 100px; /* Tamaño del bloque en escritorio */
  padding: 5px;
  display: inline-block;
}

#search_widget input[type="text"] {
  width: 100%;
  height: 25px;
  font-size: 13px;
  padding: 5px;
  text-align: right;
}

#search_widget .material-icons {
  font-size: 17px;
}

/* Ajustes para pantallas grandes (escritorio) */
@media only screen and (min-width: 768px) {
  #search_widget {
    min-width: 12rem;
  }
}

/* Ajustes específicos para iPhone y móviles pequeños */
@media only screen and (max-width: 767px) {
  #search_widget {
    width: 100%; /* Que el bloque ocupe todo el ancho */
    display: flex; /* Hace que el div se comporte como un bloque flexible */
    justify-content: center; /* Centra el contenido horizontalmente */
    margin: 0 auto; /* Centra el bloque en la pantalla */
  }

  #search_widget input[type="text"] {
    width: 110%;
    height: 35px; /* Aumenta la altura en móvil */
    font-size: 12px; /* Hace el texto más grande */
    padding: 4px; /* Más espacio interno */
    text-align: right; /* Si prefieres alineado a la izquierda */
  }
}
@media only screen and (max-width: 900px) {
  .add {
    text-align: center; /* Opcional: Centra el botón en móviles */
  }

  .add-to-cart {
    font-size: 14px; /* Reduce el tamaño del texto */
    padding: 6px 25px; /* Reduce el espacio interno del botón */
    width: 100%; /* Hace que ocupe el ancho disponible */
    max-width: 230px; /* Limita el tamaño máximo */
    height: 35px; /* Ajusta la altura */
  }

  .add-to-cart i {
    font-size: 16px; /* Reduce el tamaño del icono */
    margin-right: 7px; /* Ajusta el espacio entre el icono y el texto */
  }
}