:root {
    --main-color: rgb(44, 53, 64);
    --main-color-hover: rgb(104, 117, 134, 0.2);
    --track-color: #CCC;
    --column-widths: 160px minmax(340px, 2fr) minmax(340px, 2fr) 160px;
    --column-widths-single: 160px minmax(680px, 1fr) 160px;
    --reserve-column-widths: 43% 14% 43%;
    --reserve-column-widths-ai: 42% 14% 42% 2% !important;
    --reserve-column-widths-single: 70% 30%;
    --reserve-column-widths-single-ai: 68% 30% 2% !important;
    --reserve-column-widths2: 483px 2px 500px;
    --box-shadow-default: 0px 10px 20px 0px rgba(0, 0, 0, 0.3);
    --default-underline-color: #DDD;
    --max-content-width: 1000px;
    --included-color: #82B761;
    --for-fee-color: #f5B464;
    --none-color: #CCC;
    --button-color: rgb(71,163,207);
    --button-color-hover: rgb(56,130,165);
    --button-color-disabled: rgb(160, 160, 160);
    --font-name: "Roboto Light";
  }
  
  @media screen and (max-width: 480px) {
    :root {
      --main-color: rgb(44, 53, 64);
      --main-color-hover: rgb(104, 117, 134, 0.2);
      --track-color: #CCC;
      --column-widths: 10% 35% 35% 20%;
      --column-widths-single: 10% 70% 20%;
      --reserve-column-widths: 20% 25% 20% 25% 10%;
      --reserve-column-widths-single: 20% 25% 20% 25% 10%;
      --reserve-column-widths2: auto auto auto;
      --box-shadow-default: 0px 10px 20px 0px rgba(0, 0, 0, 0.3);
      --max-content-width: 1000px;
    }
  }

/* SECTION: FONT FACE */
@font-face {
  font-family: var(--font-name);
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('font/Roboto-Light.ttf');
}

@font-face {
  font-family: var(--font-name);
  font-style: bold;
  font-weight: 600;
  font-display: swap;
  src: url('font/Roboto-Medium.ttf');
}

/* SECTION: GLOBAL OVERRIDES */
p {
  margin-block-start: 0;
  margin-block-end: 0;
  text-indent: 0;
}

p:first-of-type {
  text-indent: unset;
}

.cursor {
  cursor: auto !important;
}

body {
  font-family: var(--font-name), sans-serif;
  font-size: 12px;
  margin: 0px;
}

input {
  font-family: var(--font-name), sans-serif;
  font-size: 12px;
}

textarea {
  font-family: var(--font-name), sans-serif;
  font-size: 12px;
  border: 1px solid #DDD;
  background-color: rgba(255, 255, 255, 0.85);
}

a {
  text-decoration: none;
  color: #333;
}

a:hover {
  text-decoration: underline;
  color: #06A;
}

/* SECTION: REST */
.heading {
  font-family: var(--font-name), sans-serif;
  font-size: 18px;
  padding: 10px 0px 10px 20px;
  color: #FFF;
  background-color: #415161;
  margin-bottom: 5px;
}