@use '@akinon/next/assets/styles/' as pz-default;
@use './fonts/index.scss' as fonts;
@use './fonts/pz-icon.css' as icons;

@import "tailwindcss";
@config "../../tailwind.config.js";

@utility header-grid-template-areas {
  grid-template-areas:
    'band-l band-m band-r'
    'main-l main-m main-r'
    'nav nav nav';
}

@utility header-grid-area-band-l {
  grid-area: band-l;
}

@utility header-grid-area-band-m {
  grid-area: band-m;
}

@utility header-grid-area-band-r {
  grid-area: band-r;
}

@utility header-grid-area-main-l {
  grid-area: main-l;
}

@utility header-grid-area-main-m {
  grid-area: main-m;
}

@utility header-grid-area-main-r {
  grid-area: main-r;
}

@utility header-grid-area-nav {
  grid-area: nav;
}

@utility header-m-template-cols {
  grid-template-columns: auto 1fr 1fr;
}

@layer utilities {
  input {
    &:focus,
    &:not(:placeholder-shown),
    &:autofill {
      & + label {
        @apply top-1/3;
      }
    }
  }

  html:has(.scroll-lock) {
    overflow-y: hidden;
    body {
      overflow-y: hidden;
    }
  }
}

.breadcrumb-separator::after {
  content: var(--theme-breadcrumb-separator);
}