/**
 * @file
 * Search block — input + submit button styling.
 *
 * Markup hooks come from templates/block/block--search-form-block.html.twig
 * (outer .block-search) and Drupal's Form API (.form-search on the input,
 * .form-submit on the button).
 */
@layer components {

  .block-search .form-search {
    padding: var(--size-2) var(--size-3);
    border: 1px solid var(--surface-2);
    border-radius: var(--radius-2);
    font: inherit;
  }
  .block-search .form-search:focus {
    outline: 2px solid var(--upei-red);
    outline-offset: 2px;
  }

  .block-search .form-submit {
    padding: var(--size-2) var(--size-3);
    border: none;
    border-radius: var(--radius-2);
    background-color: var(--upei-red);
    color: white;
    font: inherit;
    cursor: pointer;
  }
  .block-search .form-submit:hover {
    background-color: var(--upei-dark-red);
  }

}