.instagram-grid-holder {
  max-width: 100% !important;
  width: 100%;

  .nav-links {
    margin-top: 16px;
    display: flex;
    justify-content: center;
    gap: 12px;

    a,
    span {
      text-decoration: none;
      border-radius: 12px;
      color: var(--wp--preset--color--base, #fff);
      padding: 4px 16px;
      background-color: var(
        --wp--preset--color--primary,
        var(--theme-primary-color, #9873d2)
      );
    }

    span {
      font-weight: bold;
    }
  }
}

.instagram-single-holder {
  width: 25rem;
  max-width: 100%;
}

.instagram-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 16px;
}

.instagram-grid,
.instagram-single-holder {
  & > a {
    width: 100%;
    display: block;
    aspect-ratio: 2/3;
  }

  .reels_holder {
    width: 100%;
    aspect-ratio: 2/3;
    position: relative;

    & > a {
      position: absolute;
      top: 8px;
      right: 8px;
      width: 36px;
      height: 36px;
      display: flex;
      justify-content: center;
      align-items: center;
      background: rgba(0, 0, 0, 0.4);
      border-radius: 8px;
      color: white;
      text-decoration: none;
    }
  }

  img,
  video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
  }
}