@tailwind base;
@tailwind components;
@tailwind utilities;


  @layer utilities {
    /* underline effect */
    .nav-item::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      height: 2px;
      width: 0;
      background-color: theme("colors.mainColor");
      transition: width 0.3s ease;
    }
    .nav-item:hover::after {
      width: 100%;
    }

  }