html {
  @apply overflow-auto;

  scroll-behavior: smooth;

  &.locked {
    @apply overflow-hidden;
  }

  .sticky {
    position: sticky;
    top: 50px;
    height: fit-content;
  }
}

.wrap {
  &.transparent-bg-fixed {
    @apply pt-0;
  }
}

.no-results-found {
  @apply flex
    relative
    bottom-24
    flex-col
    justify-center;

  .alert {
    &.alert-warning {
      @apply flex
        justify-center
        text-center
        mx-auto;

      h2 {
        @apply text-2xl;

        @screen md {
          @apply text-4xl;
        }
      }
    }
  }

  div {
    @apply text-center
      mx-auto;

    a {
      @apply mx-auto
        inline-block
        mt-6
        text-center;
    }
  }
}

.search-submit {
  @apply cursor-pointer;
}

.search-form {
  @apply justify-center
    pt-4
    outline-none
    items-center
    text-center;

  input {
    &:focus {
      @apply outline-none;
    }

    appearance: none;

    &.search-submit {
      @apply ml-4
        mt-4
        px-6;
    }

    &.search-field {
      @apply border
        px-4
        border-gray-300
        rounded-sm;
    }
  }

  label {
    @apply mb-0;
  }
}

body {
  overflow: clip;

  &.locked {
    overflow: clip;
  }
}

button {
  &:focus {
    @apply outline-none;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  @apply mb-2 leading-tight antialiased;
}

p {
  @apply mb-3 leading-normal antialiased;
}

a {
  @apply opacity-100
    antialiased;

  transition: 0.3s ease;

  &:hover {
    @apply opacity-50;
  }
}

.reset {
  @apply m-0 p-0 align-baseline border-0 outline-none;

  font-weight: inherit;
  font-family: inherit;
  font-style: inherit;
  font-size: 100%;
}

.muy-bg-cover {
  @apply bg-cover bg-center bg-no-repeat;
}

.row {
  @apply flex
    flex-wrap;
}

.container {
  &.small {
    @screen sm {
      @apply max-w-2xl;
    }

    @screen lg {
      @apply max-w-3xl;
    }

    @screen xl {
      @apply max-w-5xl;
    }
  }
}

.breadcrumbs {
  @apply mt-8
    text-sm
    opacity-50
    mb-16;
}

.main-header div.navbar-right ul li {
  &.round {
    a {
      border-radius: 50px;
    }
  }
}

.smooth-scroll {
  scroll-behavior: smooth;
}

// <----------------------------------------- Articles styles ----------------------------------------->
.single-post {
  .container {
    margin-bottom: 100px;
  }

  .page-header {
    h1 {
      font-size: 2.25rem;
    }
  }

  p {
    margin-bottom: 1.5rem;
  }
}

// <----------------------------------------- Gutenberg default block style ----------------------------------------->
.wp-block-verse {
  @apply p-12
    text-xl;

  font-family: inherit;
  background-color: #e7eced;
}

.is-style-outline {
  border: none !important;
}
