/*
---
name: hidden()
category:
  - core/mixin
  - core/mixin/visibility
---
Hidden helper

* This helper set "position" property.
* We recomment to use this helper on elements with no position specified.

### scss
```scss
@use "node_modules/sass-basis/src/css/core";

.c-foo {
  @include core.hidden();

  @include core.media-min(md) {
      @include core.visible();
  }
}
```
*/

@mixin hidden() {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  visibility: hidden !important;
  overflow: hidden;
}

/*
---
name: visible()
category:
  - core/mixin
  - core/mixin/visibility
---
Visible helper

* This helper set "position" property.
*  We recomment to use this helper on elements with no position specified.

### scss
```scss
@use "node_modules/sass-basis/src/css/core";

.c-foo {
  @include core.hidden();

  @include core.media-min(md) {
      @include core.visible();
  }
}
```
*/

@mixin visible() {
  position: static !important;
  clip: auto !important;
  visibility: visible !important;
  overflow: visible;
}

/*
---
name: invisible()
category:
  - core/mixin
  - core/mixin/visibility
---
Invisible helper

### scss
```scss
@use "node_modules/sass-basis/src/css/core";

.c-foo {
  @include core.invisible();
}
```
*/

@mixin invisible() {
  display: none !important;
}