/*--------------------------------------------------------------
# Layers
--------------------------------------------------------------*/
@layer reset;
@layer variables;
@layer base;
@layer layout;
@layer elements;
@layer is;
@layer has;
/* --------------------------------------------------------------
# Global
-------------------------------------------------------------- */
@import "./global";

/* --------------------------------------------------------------
# Variables
-------------------------------------------------------------- */
@layer variables {
  @import "./variables/colors";
  @import "./variables/sizes";
  @import "./variables/typography";
  @import "./variables/gap";
  @import "./variables/radius";
  @import "./variables/border";
  @import "./variables/input";
  @import "./variables/section";
  @import "./variables/content";
  @import "./variables/grid";
  @import "./variables/columns";
  @import "./variables/spacing";
  @import "./variables/button";
  @import "./variables/title";
  @import "./variables/breakpoints";
}

/* --------------------------------------------------------------
# Reset
-------------------------------------------------------------- */
@layer reset {
  @import "./config/reset";
}

/* --------------------------------------------------------------
# Base
-------------------------------------------------------------- */
@layer base {
  @import "./base/typography";
  @import "./base/media";
}

/* --------------------------------------------------------------
# Layout
-------------------------------------------------------------- */
@layer layout {
  @import "./layout/container";
  @import "./layout/columns";
  @import "./layout/grid";
  @import "./layout/section";
}

/* --------------------------------------------------------------
# Elements
-------------------------------------------------------------- */
@layer elements {
  @import "./elements/button";
  @import "./elements/title";
  @import "./elements/text";
  @import "./elements/table";
  @import "./elements/input";
}

/* --------------------------------------------------------------
# Utilities
-------------------------------------------------------------- */
@layer is {
  @import "./utilities/loading";
  @import "./utilities/visibility";
}

@layer has {
  @import "./utilities/zindex";
  @import "./utilities/background";
  @import "./utilities/aspect-ratio";
  @import "./utilities/alignments";
  @import "./utilities/font-sizes";
  @import "./utilities/spacing";
}