@import "base.css";
@import "main.css";
@import "props.css";

html, body {
  background: var(--bg-color);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--heading-color);
}

p, li, td {
  color: var(--font-color);
}

/* ---------------------------
    Headings
------------------------------ */

.strap {
  display: block;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: var(--font-sm);
  line-height: 1.4;
}

/* ---------------------------
    Links
------------------------------ */

.container a {
  font-size: inherit;
  color: var(--primary-color);
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.container a:hover {
  color: var(--accent-color);
}

/* ---------------------------
    Buttons
------------------------------ */

.button {
  padding: 6px 12px;
  border: 1px solid var(--secondary-color);
  color: var(--secondary-color) !important;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  display: inline-block;
  margin-bottom: 1em;
}

.button:hover {
  border-color: var(--primary-color);
  color: var(--primary-color) !important;
}

.a-link {
  color: var(--secondary-color) !important;
}

.a-link:hover {
  color: var(--primary-color)!important;
}

/* ---------------------------
   Lists
------------------------------ */

ul.list {
  list-style-type: none;
  margin-left: 0;
  padding-left: 0;
}

ul.list li {
  line-height: 2;
  font-size: var(--font-sm);
}

ul.list li::before {
  content: "•";
  width: 20px;
  height: 20px;
  font-size: 4rem;
  line-height: 0.7;
  color: var(--primary-color);
  display: inline-block;
  position: relative;
  top: 8px;
}

.list.list-indent {
  padding-left: var(--padding-lg);
  text-indent: -(var(--margin-lg));
}

.list.list-indent li::before {
  left: var(--margin-lg);
}

.list-inline {
  display: flex;
  gap: var(--gap-md);
  align-items: center;
}

/* ---------------------------
   Scrollbars
------------------------------ */

::-webkit-scrollbar,
::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
  width: 7px;
  background: var(--md-color);
}

::-webkit-scrollbar-thumb {
  width: 7px;
  background: var(--gradient-1);
}

::-webkit-scrollbar-button {
  display: none !important;
}
