.fade-enter {
    opacity: 0;
    transform: translateY(-10px);
  }
  .fade-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 200ms, transform 200ms;
  }
  .fade-exit {
    opacity: 1;
    transform: translateY(0);
  }
  .fade-exit-active {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 200ms, transform 200ms;
  }
  .fade-simple {
    opacity: 1;
    transition: opacity 0.2s, transform 0.2s;
    transform: translateY(0);
  }
  .fade-simple-enter {
    opacity: 1;
    transform: translateY(0);
  }
  .fade-simple-leave {
    opacity: 0;
    transform: translateY(-10px);
  }
  
  .search-underline-input {
    border: none;
    border-radius: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    transition: border-color 0.2s;
    box-shadow: none;
  }
  .search-underline-input:focus {
    outline: none;
  }
  .search-underline-bar {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #2563eb; /* tailwind blue-600 */
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.3s cubic-bezier(.4,0,.2,1);
  }
  .search-underline-input:focus + .search-underline-bar {
    transform: scaleX(1);
  }