@use "@/assets/styles/variables" as *;

@mixin text-line($line){
    display: -webkit-box;
    -webkit-line-clamp: $line;
    /* Show ellipsis after 2 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@mixin no-trunc(){
    display: block; /* or inline, depending on your layout */
    overflow: visible !important;
    text-overflow: clip; /* ensures no ellipsis */
    -webkit-line-clamp: unset; /* unset line clamping */
    -webkit-box-orient: unset !important; /* unset the vertical box orientation */
}

@mixin responsive-main-space() {
  & {
    margin-top: $mainSpace;

    @media (max-width: 765px) {
      margin-top: $mobileSpace;
    }
  }
}

// @mixin responsive-main-space2() {
//     margin-bottom: $footerSpace;

//     @media (max-width: 765px) {
//       margin-bottom: $footerSpaceMobile;
//     }
//   }

@mixin responsive-main-space2 {
  & {
    margin-bottom: $footerSpace;

    @media (max-width: 765px) {
      margin-bottom: $footerSpaceMobile;
    }
  }
}
@mixin responsive-main-space2Padding() {
  & {
    padding-bottom: $footerSpace;

    @media (max-width: 765px) {
      padding-bottom: $footerSpaceMobile;
    }
  }
}