/* Main */
main {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 10%;
  height: 10%;
  background-image: url("../img/senac_h.png");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  /* filter: blur(2px); */
  z-index: -1;
}

/* Container principal */
.principal-container {
  position: relative;
  width: 640px;
  height: 680px;
  border-radius: 12px;
  box-shadow: 0 5px 20px #a0a0a0;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.98);
  display: flex;
  flex-direction: column;
}

/* Div do título e logo */
.logo-title {
  width: 100%;
  display: flex;
  position: relative;
  align-items: flex-start;
  padding-left: 25px;
  /* z-index: 1; */
}

.logo{
  width: 20%;
}

/* Container do formulário */
.form-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
}

/* Título do sistema */
.form-title {
  position: relative;
  /* margin-top: 30px; */
  font-size: 2rem;
  font-weight: 400;
}

/* Formulário */
.form {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  width: 100%;
}

.form-search{
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  width: 100%;
}

.form-input {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 20px;
  padding-right: 10px;
  /* width: 90%; */
}

.input-form {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 10px;
}

/* Botão do formulário */
.form-button {
  width: 140px;
  height: 40px;
  border: 2px solid var(--primary-color);
  border-radius: 50px;
  background-color: transparent;
  font-size: 1rem;
  font-weight: 700;
  color: var(--thirdy-color);
  cursor: pointer;
  transition: 0.7s;
}

.form-button:hover {
  background-color: var(--primary-color);
  color: var(--secondary-color);
  border: none;
}

.form-button.logout {
  border: 2px solid var(--logout-color);
}

.form-button.logout:hover {
  background-color: var(--logout-color);
}

.form-button.back {
  border: 2px solid var(--border-color);
}

.form-button.back:hover {
  background-color: var(--border-color);
}

.button-home {
  width: 100px;
  height: 28.7px;
  font-size: 0.9rem;
}

.act-buttons {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding: 10px 10px;
}

/* Avisos finais */
.alert {
  font-size: 0.9rem;
}

/* Select da data */
.select-date {
  display: flex;
  gap: 15px;
  flex-direction: column;
}

/* Footer */
.footer {
  width: 100%;
  text-align: right;
  padding-right: 20px;
  box-sizing: border-box;
  font-size: 12px;
}

.fs-small{
  font-size: 12px;
}

/* Spinner */

.overlay {
  display: none;
  position: fixed;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 9999;
}

.ml-custom{
  margin-left: 40rem;
}

/* Custom fonts */
.f10{
  font-size: 1.3rem;
  text-align: center;
}

/* Pop-up de informações */
.pop-info:hover{
  cursor:pointer;
}

/* Informaçãoes de status do ticket */
.status_ticket{
  display: flex;
  align-items: center;
  flex-direction: row;
}