@use "variables" as _variables;

// --------------------------------------------------------------------------
//  Screen readers - internal used to generate utility classes
// --------------------------------------------------------------------------

@if _variables.$s-screen-readers {

   @if type-of(_variables.$s-screen-readers) == "map" {

      @each $key, $class-name in _variables.$s-screen-readers {

         @if $key == "normal-class" {
            %#{$class-name} {
               position: absolute;
               width: 1px;
               height: 1px;
               overflow: hidden;
               padding: 0;
               border: 0;
               white-space: nowrap;
               clip: rect(0, 0, 0, 0);
            }

            .#{$class-name} {
               @extend %#{$class-name};
            }

         } @else if $key == "focusable-class" {
            %#{$class-name} {
               &:active,
               &:focus {
                  position: static;
                  width: auto;
                  height: auto;
                  overflow: visible;
                  white-space: normal;
                  clip: auto;
               }
            }

            .#{$class-name} {
               @extend %#{$class-name};
            }
         }

      }

   } @else {
      @error "Invalid format for $s-screen-readers. Map required.";
   }
}