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

:root{
  --gris: #808080;
  --gris-hover: #a8a8a8;
  --negro: #222222;
  --negro-hover: #303030;
  --rojo-alerta: #EA0000;
  --texto: #333;
}

body{
  font-family: 'Roboto', sans-serif;
  background-color: #eee;
  color: var(--texto);
}

h1{
  font-weight: 300;
  font-size: 2rem;
}

/* BGs */
.bg-gris{
  background-color: var(--gris-hover);
}

/* textos */
.txt-negro{
  color: var(--negro);
}

.title{
  font-size: 1.2rem;
  margin: 0;
  font-weight: 400;
}

.space{
  background: #fff;
  padding: 1rem;
  border-radius: 5px;
  box-shadow: 1px 1px 2px 0 rgba(40,40,47,0.10), 2px 2px 8px 0 rgba(40,40,47,0.10);
}

.info-title{
  font-size: 1rem;
  font-weight: 400;
  text-transform: uppercase;
}

#pdf-canvas{
  min-height: 600px;
}

.messages .error{
  padding: 1rem;
  background-color: var(--rojo-alerta);
}

.messages p{
  color: #fff;
  font-weight: 600;
  margin: 0;
}

/* Forms */
.medium-form-container{
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

input.form-control:read-only{
  background-color: #f0f0f0;
}