/*Pag index*/
   body {
     height: 100vh;
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     background: linear-gradient(to bottom, #007bff, #0056b3);
   }

   .body-container {
     display: flex;
     justify-content: center;
     align-items: center;
     height: 100vh;
   }

   .row-container {
     display: flex;
     justify-content: center;
     align-items: center;
     height: 99vh;
     width: 100%;
   }

   .container-card {
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 0px 15px;
     max-height: 98vh;
     height: 99vh;
     width: 70%;
   }

   .card {
     border-radius: 26px !important;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
     max-height: 98vh;
     height: 94vh;
     width: 100%;
     background: #fff;
     padding: 20px;
   }

   .titulo {
     font-size: 1.2em;
     font-weight: bold;
     text-align: center;
   }

   .card-body {
     display: flex;
     flex-direction: column;
     justify-content: center;
     gap: 30px;
     height: 90vh;
     padding: 20px;
   }

   .logo-amb {
     display: block;
     margin: 0 auto 30px auto;
     max-height: 100px;
   }

   input,
   label {
     cursor: pointer;
   }

   .recaptcha-style {
     display: flex;
     justify-content: center;
     align-items: center;
   }

   #formQuesitos {
     height: 40vh;
     gap: 20px;
     overflow-x: auto;
     font-size: 1em;
     padding: 20px 8px;
     border-radius: 12px;
     border: 1px solid rgba(229, 229, 229, 0.825);
     margin-top: 25px;
     margin-bottom: 18px;
   }

   #formCadastro {
     padding: 8px;
     border-radius: 8px;
   }

   .btn-primary {
     background-color: #007bff;
     border: none;
     border-radius: 50px;
     padding: 10px 20px;
     font-size: 16px;
     transition: background-color 0.3s ease;
     cursor: pointer;
   }

   .consentimento {
     max-height: 120vh;
     overflow-y: auto;
     padding: 15px;
     border: 1px solid #ddd;
     border-radius: 10px;
     background-color: #f9f9f9;
     margin-bottom: 10px;
   }

   .consentimento p {
     margin-bottom: 1rem;
     line-height: 1.5;
     font-size: 0.95rem;
   }

   /*Pag Pesquisa */
   .form-container {
     max-width: 800px;
     margin: 0 auto;
     padding: 20px;
     border: 1px solid #ddd;
     border-radius: 10px;
     background: #f9f9f9 !important;
     height: 80vh;
     /* Altura para scroll */
     overflow-y: auto;
     /* Scroll vertical */
   }

   .pergunta {
     font-weight: bold;
   }

   .resposta .form-check {
     margin-left: 20px;
   }

   .modal-header {
     background-color: #007bff;
   }

   .modal-title {
     font-size: 15px;
     font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
     color: #fff;
   }

   .btn-close {
     filter: brightness(0) invert(1);
     /* deixa o X branco */
   }

   .table-competencia th {
     background-color: #004173;
     /* Amarelo Bootstrap (warning) */
     color: #000;
     text-align: center;
     font-weight: bold;
   }

   .table-competencia td {
     vertical-align: top;
   }

   .titulo-tabela {
     text-align: center;
     margin: 20px 0;
     font-weight: bold;
     font-size: 1.4rem;
   }

   .table-competencia th {
     background-color: #004173;
     /* Azul escuro */
     color: #fff;
     /* Texto branco */
     text-align: center;
     font-weight: bold;
   }

   .modal-header {
     background-color: #104673;
   }

   .button-close {
     color: #fff;
   }

   hr {
     margin: 10px 0px;
   }

   input {
     cursor: pointer;
   }

   select {
     cursor: pointer;
   }

   .terms {
     width: 100%;
     padding-left: 1.5em;
   }

   @media (max-width: 890px) {

     .row-container {
       width: 95%;
     }

     .container-card {
       padding: 0px 20px;
       height: auto;
       width: 100%;
     }

     .card {
       border-radius: 26px !important;
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
       max-height: 100vh;
       height: 95vh;
       width: 100%;
       background: #fff;
       padding: 10px;
     }

     .card-body {
       padding: 8px;
       padding-top: 50px;
       gap: 20px;
     }

     .logo-amb {
       padding-top: 10px;
     }

     #formCadastro {
       padding: 0;
       border-radius: 8px;
       border: 0px solid rgba(229, 229, 229, 0.825);
     }

     #formQuesitos {
       margin-top: 20px;
       margin-bottom: 5px;
       height: 46vh;
     }

     label {
       font-size: 1em;
     }

     .titulo {
       font-size: 0.8em;
       font-weight: bold;
       text-align: center;
     }

     .consentimento {
       margin-top: 5px;
       padding: 20px;
       margin-bottom: 5px;
     }

   }

   @media (max-width: 400px) {

     .row-container {
       width: 100%;
     }

     .container-card {
       padding: 0px 14px;
       height: auto;
       width: 100%;
     }

     .logo-amb {
       display: block;
       max-height: 100px;
       padding-top: 50px;
     }

     .card {
       border-radius: 26px !important;
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
       height: 96vh;
       width: 100%;
       background: #fff;
       padding: 8px;
       font-size: 0.9rem;
     }

     .card-body {
       padding: 8px;
       gap: 20px;
       padding-top: 50px;
     }

     label {
       font-size: 0.9em;
     }

     #formQuesitos {
       margin-top: 10px;
       margin-bottom: 0;
       height: 600vh;
     }

     .consentimento {
       margin-top: 5px;
       padding: 20px;
       margin-bottom: 2px;
     }

   }

   @media (max-height: 780px) {

     .row-container {
       width: 100%;
     }

     .logo-amb {
       display: block;
       margin: 0 auto 10px auto;
       max-height: 100px;
       padding-top: 50px;
     }

     .card-body {
       padding: 8px;
       gap: 0;
       padding-top: 50px;
     }

     .card {
       overflow: auto;
     }

     h4 {
       margin-bottom: 2px;
     }

     .titulo {
       font-size: 0.8em;
     }

     .consentimento p {
       font-size: 0.8em;
     }

     .consentimento {
       margin-top: 5px;
       padding: 20px;
       margin-bottom: 2px;
     }

     label {
       font-size: 0.9em;
     }
   }