@import "./lib/bootstrap";

@include media-breakpoint-down(md) {
  .app-header {
    flex-direction: column;

    > .link-list {
      border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
      padding-bottom: map-get($spacers, 1); 
      margin-bottom: map-get($spacers, 1); 
      flex-direction: column;
      gap: 0;

      app-link {
        display: flex;
        align-items: center;

        &:not(:last-child)::after {
          content: "";
        }
      }
    }
  }

  .navbar-nav {
    flex-direction: column !important;

    > .nav-item {
      .btn {
        padding: 0.125rem !important;
      }
    }
  }
}