/**
 * _main.scss - Root style definitions.
 *
 * The definitions in the `src/styles` directory apply to the entire project,
 * including Web components. They are structured as follows:
 *
 * src/
 * ├── style/
 * │   ├── abstract/
 * │   │   ├── _commons.scss          # Global common definitions
 * │   │   ├── _functions.scss        # Utility functions in SCSS
 * │   │   ├── _mixins.scss           # Reusable mixins
 * │   │   ├── _variables.scss        # Semantic variables
 * │   │   ├── _placeholders.scss     # Placeholders (%) (!!! not yet implemented)
 * │   ├── base/
 * │   │   ├── _colors.scss           # Non-semantic color variable definitions
 * │   │   ├── _common-reset.scss     # Global common definitions for reset/CSS baseline
 * │   │   ├── _reset.scss            # Reset/CSS baseline
 * │   │   ├── _sizes.scss            # Non-semantic size variable definitions
 * │   │   ├── _transitions.scss      # Transition and transform definitions
 * │   │   ├── _typography.scss       # Global typography styles (!!! not yet implemented)
 * │   ├── components/
 * │   │   ├── _box.scss              # Box component styles
 * │   │   ├── _button.scss           # Button component styles
 * │   │   ├── _common.scss           # Common component styles
 * │   │   ├── _reset.scss            # Reset/CSS baseline for components
 * │   │   ├── _transition.scss       #  Transition and transform definitions for components
 * │   │   ├── _card.scss             # Card component styles (!!! not yet implemented)
 * │   ├── layout/
 * │   │   ├── _grid.scss             # Grid system (!!! not yet implemented)
 * │   │   ├── _header.scss           # Header styles
 * │   │   ├── _footer.scss           # Footer styles
 * │   ├── main.scss                  # Main file that imports partials
 *
 */

@use 'base/reset';
@use 'base/sizes';
@use 'base/colors';
@use 'base/transitions';
@use 'abstract/variables';
@use 'abstract/mixins';
@use 'abstract/functions';
@use 'abstract/commons';
@use 'layout/header';
@use 'layout/footer';

body {
  display: block;
  margin: 8px;
  min-height: 100vh;
  color: var(--color-text);
  background: var(--color-background);
  transition: transitions.get(main-body);
  line-height: 1.6;
  font-family: sans-serif;
  font-size: 15px;
}