:root {
  /* COLORES CORPORATIVOS */
  --primary-color: #ff4b44;
  --primary-color-rgb: 255, 75, 68;
  --bs-primary-rgb: 255, 75, 68;
  --primary-color-hover: #f1342d;
  --primary-color-active: #df3f39;
  --primary-color-disabled: #ff7570;

  --content-primary: #000000;
  --content-primary-bg: #ffffff;

  --content-primary-reverse: #ffffff;
  --content-primary-reverse-bg: #000000;

  --color-hightlight-500: #FF4B44;
  --content-highlight: var(--color-hightlight-500);
  --bg-highlight: var(--color-hightlight-500);

  --primary-font: "LALIGAText", Arial, sans-serif;
  --header-font: "LALIGAHeadline", Courier, sans-serif;
  --header-2-font: "LALIGAHeadline-Wide", Courier, sans-serif;
  --display-font: "LALIGAPlayers", 'Trebuchet MS', sans-serif;
  --laliga-input-font-size: 1.30rem;

  --bs-body-font-family: var(--primary-font);
}

/* UTILS */
  /* text-primary */
  /* bg-primary */

    .font-laliga-text {
      font-family: var(--primary-font);
    }

    .font-laliga-headline {
      font-family: var(--header-font);
    }

    .font-laliga-headline-wide {
      font-family: var(--header-2-font);
    }

    .font-laliga-players {
      font-family: var(--display-font);
    }

    .fs-14 {
      font-size: 14px !important;
    }

/* !UTILS */

html {
 font-size: 16px;
 scroll-behavior: smooth;
 touch-action: manipulation; /* permito al usuario el uso táctil sin intervención del navegador. */
}

body {
  display: flex;
  flex-direction: column;
  font-family: var(--primary-font);
}

@media only screen and (max-width: 600px) {
  html {
   font-size: 14px;
  }
  :root {
   --laliga-input-font-size: 0.9rem;
  } 
  .form-control {
   padding: 9px;
  }
}

main { min-height: calc(100% - 142px); }
footer { font-size: 0.8rem; }

a { text-decoration: none; color: inherit; }
a:hover { color: var(--primary-color-hover) !important; }

p a { color: var(--primary-color); }
p a:hover { color: var(--primary-color-hover); }

ul {
 line-height: 1.6em;
 margin-bottom: 24px;
}

.btn {
 --bs-btn-border-radius: 0;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);

  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primary-color-hover);
  --bs-btn-hover-border-color: var(--primary-color-active);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;

  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-color-active);
  --bs-btn-active-border-color: var(--primary-color-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);

  --bs-btn-disabled-color: #8f8f8f;
  --bs-btn-disabled-bg: #e1e1e1;
  --bs-btn-disabled-border-color: #e1e1e1;
  --bs-btn-disabled-opacity: 0.65;

  font-family: var(--primary-font) !important;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.btn-outline-primary {
  --bs-btn-color: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primary-color);
  --bs-btn-hover-border-color: var(--primary-color);
  --bs-btn-focus-shadow-rgb: 13, 110, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-color);
  --bs-btn-active-border-color: var(--primary-color);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color:var(--primary-color);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--primary-color);
}

      .btn-primary.btn-inverse {
        --bs-btn-color: var(--primary-color);
        --bs-btn-bg: #FFFFFF;
        --bs-btn-border-color: #FFFFFF;
        --bs-btn-hover-color: var(--primary-color-hover);
        --bs-btn-hover-bg: #FFFFFF;
        --bs-btn-hover-border-color: var(--primary-color-active);
      }

.btn-loader {
    .btn-loader_icon { display: inline-block; }
    .btn-loader_spinner { display: none; }
}
.btn-loader.btn-loader--loading {
    .btn-loader_icon { display: none; }
    .btn-loader_spinner { display: inline-block; }
}