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

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

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

  .header-grid-area-band-l {
    grid-area: band-l;
  }

  .header-grid-area-band-m {
    grid-area: band-m;
  }

  .header-grid-area-band-r {
    grid-area: band-r;
  }

  .header-grid-area-main-l {
    grid-area: main-l;
  }

  .header-grid-area-main-m {
    grid-area: main-m;
  }

  .header-grid-area-main-r {
    grid-area: main-r;
  }

  .header-grid-area-nav {
    grid-area: nav;
  }

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

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

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