/* PIEZA: arreglos de la cabecera
 * ---------------------------------------------------------------------------
 * QUE ES ESTO Y POR QUE NO ESTA EN `cabecera.css`
 *
 * Esta regla ARREGLA la cabecera, asi que su sitio natural seria
 * `css/piezas/cabecera.css`. No esta ahi porque ese fichero lo esta editando
 * otra sesion a la vez y la copia de esta rama va POR DETRAS de la que corre
 * en el servidor: si se edita aqui la version vieja y se despliega, se borra
 * el trabajo de la otra. Asi que el arreglo va en un fichero propio, que se
 * carga despues y no pisa nada.
 *
 * ES TEMPORAL: cuando la otra sesion commitee su cabecera, esta regla se
 * mueve a `cabecera.css` y esta pieza se borra entera.
 *
 * ---------------------------------------------------------------------------
 * EL FALLO
 *
 * En el buscador de la cabecera se veia «un bloque encima de otro»: dentro de
 * la pastilla blanca aparecia otro rectangulo, de esquinas rectas, mas alto
 * que ella y saliendose por la derecha.
 *
 * No eran dos buscadores. Era UNO, con el fondo y el alto que le pone
 * GeneratePress. El tema trae reglas del tipo `input[type="text"]{...}`, que
 * en especificidad valen (0,1,1) —una clase de atributo mas un elemento— y le
 * ganan a `.dl-buscador__campo`, que vale (0,1,0). En la pieza se habian
 * puesto `!important` en el borde, el contorno, el radio y la sombra, pero NO
 * en el fondo ni en el relleno ni en el alto, que son justo los que dibujaban
 * el rectangulo de mas.
 *
 * La solucion no es otro `!important`: es subir la especificidad por encima de
 * la del tema (`.dl-cabecera input.dl-buscador__campo` vale (0,2,1)) y
 * resetear la caja entera del campo de una vez, no propiedad a propiedad
 * segun vayan apareciendo.
 * --------------------------------------------------------------------------- */

.dl-cabecera input.dl-buscador__campo {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--dl-tinta);
  line-height: 1.4;
}

/* Al enfocar, el campo tampoco recupera su caja: el aviso de foco lo da el
   borde de la pastilla (`.dl-buscador__caja:focus-within`), que es lo que se
   decidio en la cabecera para que no pareciera que la caja crecia. */
.dl-cabecera input.dl-buscador__campo:focus,
.dl-cabecera input.dl-buscador__campo:focus-visible {
  outline: 0;
  background: none;
  border: 0;
  box-shadow: none;
}

/* Safari e iOS pintan lo suyo en los campos de busqueda: la cruz de borrar y
   el decorado del icono. Aqui sobran, porque la cruz ya la pone la pieza. */
.dl-cabecera input.dl-buscador__campo::-webkit-search-decoration,
.dl-cabecera input.dl-buscador__campo::-webkit-search-cancel-button,
.dl-cabecera input.dl-buscador__campo::-webkit-search-results-button {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}