// @tailwind base;
// @tailwind components;
// @tailwind utilities;

// Colors.
:root {
  --site-primary: #009FB7;
  --site-primary-light: #01bfdb;
  --site-gray: #565264;
  --site-secondary: #FED766;
  --site-white: #F4F4F8;
  --site-platinum: #E6E6EA;
  --site-danger: #FE4A49;
}

/* OLD GET RID OF THESE */
$base_light: #faf4ed;
$base_bl: #191724;
$overlay_bl: #1f1d2e;
$muted: #6e6a86;
$subtle: #908caa;
$surface: #fffaf3;
$text: #e0def4;
$love: #eb6f92;
$orangeish: #f6c177;
$rose: #ebbcba;
$pine: #31748f;
$foam: #9ccfd8;
$iris: #c4a7e7;
$link-color: $foam;

// Other variables.
$container-full: 1300px;
$container-plus-padding: 1216px;

// Google fonts.
@import url("https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");

// Partials.
@import "partials/headings";
@import "partials/local-tasks";
@import "partials/buttons";
@import "partials/header";
@import "partials/footer";
@import "partials/main";
@import "partials/tables";
@import "partials/hero";
@import "partials/recent-fights";
@import "partials/fighter";
@import "partials/fighters-view";
@import "partials/fight";
@import "partials/event";
@import "partials/article";

html {
  font-size: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
  scroll-behavior: smooth;
}

.region-content {
  padding: 0;
}

body {
  background: var(--site-white);
  color: var(--site-primary);
  font-family: "Ubuntu", sans-serif;
  margin: auto;
}

a {
  color: var(--site-primary);
  text-decoration: none;
  cursor: pointer;
}

img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

p {
  color: var(--site-gray);
}

.container {
  max-width: $container-full;
  margin: auto;

  @media screen and (max-width: $container-full) {
    margin: 0 50px;
  }
}

blockquote {
  font-style: italic;
  border-left: 1px solid var(--site-primary);
  padding-left: 20px;
}

pre {
  background: #414559;
  color: #c6d0f5;
  padding: 10px;
}

