/* ==========================================================================
   FORMULÁRIO DE BUSCA (cabeçalho, página 404 e resultados)
   Usa as variáveis definidas em foundation-6/css/app.css.
   O campo e o botão ficam dentro da mesma caixa; o botão mostra "Buscar" a
   partir de 640 px e só a lupa no celular (o texto continua para leitores
   de tela). No cabeçalho (variante --cabecalho), sempre só a lupa azul.
   ========================================================================== */

.search-form-container { width: 100%; max-width: 100%; margin: 0 auto; }
.custom-search-form { margin: 0; }
.custom-search-form .search-input-wrapper { display: flex; align-items: stretch; gap: 4px; position: relative; box-sizing: border-box; height: 46px; padding: 4px; background: var(--ufpr-superficie); border: 1px solid var(--ufpr-borda-campo); border-radius: var(--ufpr-raio); box-shadow: var(--ufpr-sombra-leve); transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.custom-search-form .search-input-wrapper:hover { border-color: var(--ufpr-titulo); }
.custom-search-form .search-input-wrapper:focus-within { border-color: var(--ufpr-titulo-forte); outline: 3px solid var(--ufpr-foco); outline-offset: 2px; }
.custom-search-form .search-field { flex: 1 1 auto; min-width: 0; height: 100%; margin: 0; padding: 0 8px; border: none; border-radius: var(--ufpr-raio-sm); background: transparent; color: var(--ufpr-texto); font-family: inherit; font-size: 1rem; line-height: normal; outline: none; box-shadow: none; }
.custom-search-form .search-field:focus { border: none; box-shadow: none; background: transparent; }
.custom-search-form .search-field::placeholder { color: var(--ufpr-texto-suave); opacity: 1; }
.custom-search-form .search-field::-webkit-search-cancel-button { cursor: pointer; }
.custom-search-form .search-submit { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: none; height: 100%; margin: 0; padding: 0 16px; border: none; border-radius: calc(var(--ufpr-raio) - 3px); background: var(--ufpr-azul-escuro); color: var(--ufpr-barra-texto); font-family: inherit; font-size: 0.95rem; font-weight: 600; line-height: 1; cursor: pointer; transition: background-color 0.2s ease; }
.custom-search-form .search-submit:hover, .custom-search-form .search-submit:focus { background: var(--ufpr-azul); }
.custom-search-form .search-submit:focus-visible { outline: 3px solid var(--ufpr-barra-texto); outline-offset: -5px; }
.custom-search-form .search-submit .icone { width: 1.1rem; height: 1.1rem; stroke-width: 2.4; }

/* Variante grande (página 404 e resultados sem itens) */
.custom-search-form--grande .search-input-wrapper { height: 54px; padding: 5px; }
.custom-search-form--grande .search-field { font-size: 1.1rem; }
.custom-search-form--grande .search-submit { padding: 0 22px; font-size: 1rem; }

/* Cabeçalho: caixa branca (--ufpr-superficie) e o campo sem fundo próprio;
   o botão é só a lupa azul, sem fundo e sem o texto
   "Buscar", que continua para leitores de tela. A borda mantém 3 : 1. */
.custom-search-form--cabecalho .search-input-wrapper { padding: 3px 3px 3px 12px; background: var(--ufpr-superficie); border-radius: 999px; box-shadow: none; }
.custom-search-form--cabecalho .search-submit, .custom-search-form--cabecalho .search-submit:hover, .custom-search-form--cabecalho .search-submit:focus { padding: 0 12px; border-radius: 999px; background: transparent; color: var(--ufpr-destaque); }
.custom-search-form--cabecalho .search-submit:hover { color: var(--ufpr-azul-link-hover); }
.custom-search-form--cabecalho .search-submit:focus-visible { outline: 3px solid var(--ufpr-foco); outline-offset: -3px; }
.custom-search-form--cabecalho .search-submit .icone { width: 1.25rem; height: 1.25rem; }
.custom-search-form--cabecalho .search-submit__texto { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Celular: só a lupa no botão */
@media screen and (max-width: 639px) {
    .custom-search-form .search-submit { padding: 0 14px; }
    .custom-search-form .search-submit__texto { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}