/* Form styles – uses color tokens from site.css */
.search-form {
	/* outline: dashed red 1px; */
  display: grid;
  gap: 10px;
  width: min(900px, 92vw);
  margin: 0 auto;
	text-align: center;	
}

/* Big, comfy search box */
.search-input {
  width: 90%;
  box-sizing: border-box;
  border: 2px solid color-mix(in oklab, var(--fg) 50%, transparent);
  background: var(--card);
  color: var(--fg);
  line-height: 1;
  text-align: left;		/* ensure left-aligned while typing */
	margin: 5px auto;
  border-radius: var(--radius); 
}


.search-input { 
	height: 70px;
	padding: 0 25px;
	font-size: 30px;
}

.search-input::placeholder {
  color: color-mix(in oklab, var(--fg) 45%, transparent);
}

.search-input:focus {
  outline: none;
  border-color: color-mix(in oklab, var(--fg) 42%, transparent);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--fg) 12%, transparent);
}

/* Autofill tidy (Safari/Chrome) */
.search-input:-webkit-autofill {
  -webkit-text-fill-color: var(--fg);
  -webkit-box-shadow: 0 0 0 1000px var(--card) inset;
}