:root{
    --cor-input-radio:#2984ca;
    --cor-input-radio:#2c72db;
    --cor-input-radio-verde:#22af45;
    --cor-input-radio-verm:#f1433d;

    --primary: #227093;
    --secondary: #ff5252;
	  --secondary: #eee;
    --background: #eee;
    --highlight: #ffda79;
    /* Theme color */
    --theme: var(--primary);
}
/* loader */ 
.form-grade-mensagem-loader{position: fixed; background: #c0c0c0e1; background: #cfcfcfe1; left: 0px; right: 0px; bottom: 0px; top: 0px; width: 100%; z-index: 10002; height: 100%; display: flex;flex-direction: row; justify-content: center; align-items: center;}
.form-msg-caixa-loader{margin-bottom: 30px; width:auto; height: auto; min-height:auto; font-size: 12px; font-family: var(--font-rr); border-radius: 5px;  }
.form-msg-loader-tit{float:left; width: 100%; height: auto; line-height: auto; text-align: center; padding-top: 20px; font-size: 34px; font-family: var(--font-rr); color: var(--cor-rosa); word-wrap: break-word; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.form-msg-loader-subtit{float:left; width: 100%; height: auto; line-height: auto; text-align: center; padding-top: 20px; font-size: 18px; font-family: var(--font-rl); color: #000; word-wrap: break-word; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.form-msg-loader-div-timer{float:left; width: 100%; height: auto; text-align: center; margin-top: 40px; }
.form-msg-loader-div-progress{float:left; width: 100%; height: auto; text-align: center; margin-top: 50px;}
.form-msg-loader-timer{margin:0 auto; width: auto; height: auto; line-height: auto; background-color: var(--cor-rosa); padding: 10px; font-size: 18px; font-family: var(--font-rl); color: #fff; word-wrap: break-word; border-radius: 5px;}

.spinner { color: var(--cor-rosa); display: flex; align-items: center; justify-content: center; min-height: auto;}
.spinner:after { animation: changeContent .8s linear infinite; display: block; content: "⠋"; font-size: 50px;}  
@keyframes changeContent {
    10% { content: "⠙"; }
    20% { content: "⠹"; }
    30% { content: "⠸"; }
    40% { content: "⠼"; }
    50% { content: "⠴"; }
    60% { content: "⠦"; } 
    70% { content: "⠧"; }
    80% { content: "⠇"; }
    90% { content: "⠏"; }
}


.progress-bar {
  position: absolute;
  height: 2px;
  background: var(--cor-rosa);
}

.progress-count {
  position: absolute;
  width: 100%;
  text-align: center;
  font-weight: 100;
  font-size: 3em;
  margin-top: -1.33em;
  color: var(--cor-rosa);
}


/* HTML: <div class="loader"></div> */
.loader-cg {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid #0000;
  border-radius: 50%;
  border-right-color: #ee2a4b;
  animation: l15 1s infinite linear;
  margin:auto;
}
.loader-cg::before,
.loader-cg::after {    
  content: "";
  grid-area: 1/1;
  margin: 2px;
  border: inherit;
  border-radius: 50%;
  animation: l15 2s infinite;
}
.loader-cg::after {
  margin: 8px;
  animation-duration: 3s;
}
@keyframes l15{ 
  100%{transform: rotate(1turn)}
}

/* togle certo - tela que a bola esta ficando um pouco para baixo */
.cm-toggle-telaerrada {-webkit-appearance: none; -webkit-tap-highlight-color: transparent; position: relative; border: 0; outline: 0; cursor: pointer;}
.cm-toggle-telaerrada:after {content: ''; width: 30px; height: 12px; display: inline-block; background: #c4c3c38c; border-radius: 10px; transition: .2s; clear: both;}
.cm-toggle-telaerrada:before{content: ''; width: 17px; height: 17px; display: block; position: absolute; left: 0; top: -2px; border:1px solid #CCC; border-radius: 50%; background: #ffffff;}
.cm-toggle-telaerrada:checked:before {transition: .3s; left: 15px; border:1px solid var(--cor-verde-ml);}
.cm-toggle-telaerrada:checked:after {transition: .3s; background: var(--cor-verde-ml);}

.form-linha-check-auto{float:left; width:auto; height: auto; margin-right: 20px;}
.form-linha-check{float:left; width:100%; height: auto;}
.form-inp-tit-check{float:left; padding-top:5px; width:calc(100% - 50px); height:auto; min-height: 30px; font-family: var(--font-rr); color: #333333; font-size:14px;}
.form-inp-tit-loc-date{float:left; width:auto; height:auto; min-height: 30px; margin-left:10px; margin-right:10px; line-height: 30px; font-family: var(--font-rr); color: #333333; font-size:14px;}
.form-inp-check{float:right; width:35px; height:auto; min-height: 30px; padding-top:3px;}
.form-inp-check01{float:left; width:35px; height:auto; min-height: 30px; padding-top:3px;}
.form-inp-tit-check01{float:left; width:auto; margin-left: 4px; height:auto; min-height: 30px; font-family: var(--font-rr); color: #333333; font-size:14px;}

.radio-label { font-weight: 500 !important; align-items: center; padding: 5px; margin-bottom: 10px; margin-right: 10px; background-color: #fff; border:1px solid #ccc; border-radius: 4px; font-size: 14px; transition: background-color 0.2s, border-color 0.2s;}
.radio-label:hover { background-color: #e6e6e6; cursor: pointer;}
.radio-input { position: absolute; opacity: 0; }
.radio-input:checked + .radio-label { background-color: var(--cor-input-radio); border:1px solid var(--cor-input-radio); color: white; }
.radio-input:disabled + .radio-label { background-color: #e4e4e4; border:1px solid #CCC; color: #000; cursor: default; }
.radio-input:focus + .radio-label { outline: 0px solid var(--cor-input-radio); }
.radio-inner-circle { display: inline-block; width: 1em; height: 1em; border: 1.5px solid #888; border-radius: 50%; margin-right: 0.5em; transition: border-color 0.2s; position: relative; }
.radio-label:hover .radio-inner-circle { border-color:0px; }
.radio-input:checked + .radio-label .radio-inner-circle { border-color: white; }
.radio-input:checked + .radio-label .radio-inner-circle::after { content: ''; display: block; width: 0.5em; height: 0.5em; background-color: white; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }


.radio-label-verde { font-weight: 500 !important; align-items: center; padding: 5px;  margin-bottom: 10px; margin-right: 10px; background-color: #fff; border:1px solid #ccc; border-radius: 4px; font-size: 14px; transition: background-color 0.2s, border-color 0.2s;}
.radio-label-verde:hover { background-color: #e6e6e6; cursor: pointer;}
.radio-input-verde { position: absolute; opacity: 0; }
.radio-input-verde:checked + .radio-label-verde { background-color: var(--cor-input-radio-verde); border:1px solid var(--cor-input-radio-verde); color: white; }
.radio-input-verde:disabled + .radio-label-verde { background-color: #e4e4e4; border:1px solid #CCC; color: #000; cursor: default; }
.radio-input-verde:focus + .radio-label-verde { outline: 0px solid var(--cor-input-radio-verde); }
.radio-inner-circle { display: inline-block; width: 1em; height: 1em; border: 1.5px solid #888; border-radius: 50%; margin-right: 0.5em; transition: border-color 0.2s; position: relative; }
.radio-label-verde:hover .radio-inner-circle { border-color:0px; }
.radio-input-verde:checked + .radio-label-verde .radio-inner-circle { border-color: white; }
.radio-input-verde:checked + .radio-label-verde .radio-inner-circle::after { content: ''; display: block; width: 0.5em; height: 0.5em; background-color: white; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.radio-label-verm { font-weight: 500 !important; align-items: center; padding: 5px;  margin-bottom: 10px; margin-right: 10px; background-color: #fff; border:1px solid #ccc; border-radius: 4px; font-size: 14px; transition: background-color 0.2s, border-color 0.2s;}
.radio-label-verm:hover { background-color: #e6e6e6; cursor: pointer;}
.radio-input-verm { position: absolute; opacity: 0; }
.radio-input-verm:checked + .radio-label-verm { background-color: var(--cor-input-radio-verm); border:1px solid var(--cor-input-radio-verm); color: white; }
.radio-input-verm:disabled + .radio-label-verm { background-color: #e4e4e4; border:1px solid #CCC; color: #000; cursor: default; }
.radio-input-verm:focus + .radio-label-verm { outline: 0px solid var(--cor-input-radio-verm); }
.radio-inner-circle { display: inline-block; width: 1em; height: 1em; border: 1.5px solid #888; border-radius: 50%; margin-right: 0.5em; transition: border-color 0.2s; position: relative; }
.radio-label-verm:hover .radio-inner-circle { border-color:0px; }
.radio-input-verm:checked + .radio-label-verm .radio-inner-circle { border-color: white; }
.radio-input-verm:checked + .radio-label-verm .radio-inner-circle::after { content: ''; display: block; width: 0.5em; height: 0.5em; background-color: white; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }


/* tooltip */
.tp-cont { position: relative; display: inline-block; cursor: pointer; }
.tp-cont:hover .tp-text { visibility: visible; transition: .2s; }
.tp-text { visibility: hidden; position: absolute;  z-index: 1; background-color: #333; color: #fff; padding: 10px; border-radius: 5px; bottom: 105%; left: 50%; transform: translateX(-50%);}


/* efeito da logo - brilho passando */
.shine{
    display: inline-block;
    mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/450% 100%;
    animation: shimmer 2.5s infinite;
    max-width: 200px;
}

@keyframes shimmer {
    100% {
        mask-position: left
      }
 }

 
/* autocompletar campos */
.autocomplete {
  position: relative;
  display: inline-block;
}


.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  background-color: #fff; 
  border-top: none;
  z-index: 10001;
  border-radius: 5px;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
  font-family:"Manrope", sans-serif;;
	font-weight:500;
  font-size: 1rem;
  padding-bottom: 5px;
}

.autocomplete-items div {
  padding: 5px;
  padding-left: 10px;;
  cursor: pointer;
  background-color: #fff; 
  
  font-family:"Manrope", sans-serif;;
	font-weight:500;
  font-size:0.855em;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #265fbb !important; 
  color:white !important
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}



/*accordion*/
.tab {
  position: relative;
}
.tab input[type=radio] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.tab__content {
  max-height: 0;
  overflow: hidden;
  transition: all 0.135s;
  color:black;
}
.tab input:checked ~ .tab__content {
  /*max-height: 200rem;*/
  max-height: 130rem;
  overflow-y: auto;
}

/* Visual styles */
.accordion {
  color: var(--theme);
  border: 2px solid;
  border-radius: 0.5rem;
  overflow: hidden;
}
.tab__label,
.tab__close {
  display: flex;
  color: black;
  background: var(--theme);
  cursor: pointer;
}
.tab__label {
  justify-content: space-between;
  padding: 1rem;
}
.tab__label::after {
  content: "\276F";
  width: 1em;
  height: 1em;
  text-align: center;
  transform: rotate(90deg);
  transition: all .135s;
}
.tab input:checked + .tab__label::after {
  transform: rotate(270deg);
}
.tab__content p {
  margin: 0;
  padding: 1rem;
}
.tab__close {
  justify-content: flex-end;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
}
.accordion--radio {
  --theme: var(--secondary);
}

/* Arrow animation */
.tab input:not(:checked) + .tab__label:hover::after {
  animation: bounce 1s infinite;
}
@keyframes bounce {
  25% {
    transform: rotate(90deg) translate(.25rem);
  }
  75% {
    transform: rotate(90deg) translate(-.25rem);
  }
}