/* This is the css file to modify the overall survey look for fomo*/
/* Add content below or remove this file if you don't need it. */

div.welcome-title {
  font: 1.6em verdana,helvetica,arial,sans-serif;
  padding: 10px 0;
}

button.help_close {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
  display: inline;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font-weight: inherit;
}

button.help_close_nd {
  color: blue;
  text-decoration: underline;
  cursor: pointer;
  display: inline;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font-weight: inherit;
}

.help_text {
  padding-top: 1.5em;
  font-weight:normal;
}

.auxtext {
  font-style: italic;
}

.textfield-label-left, .textfield-label-right, .textfield-label-top {
  font-weight: bold;
}

/* CSS rules for CJRP person_dashboard only */

a.dashboard_button:hover, a.link_to_button:hover {background:#ccc;color:#000;}

div.inner {
  padding-top:5px;
  width:953px;

} 

.btn-primary:disabled {
  background-color: gray;
}

table#survey_tasks, table#tblMainDashboard {
  border-collapse: collapse;
  margin: auto;
  width: 98%;
  }

table#survey_tasks th, table#tblMainDashboard th {
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  background:  #fff;
  border: 1px solid #a7a7a7;
  }

 table#survey_tasks td, table#tblMainDashboard td {
  text-align: center;
  vertical-align: top;
  background-color: #f0f8ff;
  border: 1px solid #a7a7a7;
  }

/* === Upload Page === */

#upload ul{
   list-style-type: none;
   padding: 0;
 }

#upload fieldset {   
  text-align: center;
  margin: 0px;
  border: none;
  padding: 0px;
 }

#upload #buttons { 
  float:none;
  margin:0 auto;
  padding: 0px; 
  text-align:center;
  margin-top: 2em;
}

#upload .custom-file-select-browse {
  outline: 0;
  box-shadow: 0 0 0 0.05rem rgba(0,0,0,.5);
  background-color: #36597b;
  color: white;
  border-radius: 10%;
  padding: .4em .7em .4em .7em;
}
#upload .custom-file-select-path {
  padding-left: 0.5em;
}

#upload .custom-file-select-browse:hover {
  background-color: #103355;
}

#upload .question {
  text-align: left;
}

#upload .custom-file-select {
  float: left;
}

#upload input#submit_next.button.submit {
  display: flex;
  background-color: #36597b;
  color: white;
  border-radius: 10%;
  padding: .4em 2em .4em 2em;
}

#upload input#submit_next.button.submit:hover {
  background-color: #103355;
}

.dashboard_table_highlight td{
  padding-right: 1.2em;
}

/* End Upload Page */

#fieldset_g_age_group.fieldset {
  border-bottom: solid;
}

#fieldset_g_reason_for_admission.fieldset {
  border-bottom: solid;
}

/* Toolbar */

#toolbar {
  & [aria-expanded]::after {
    content: "\25bc";
    font-size: 0.5em;
    display: inline-block;
    vertical-align: middle;
    margin-left: 2px;
  }
}

@media( max-width: 991.98px ) {
  #toolbar > ul > li {
    & > ul {
      background-color: var(--primary-dark);
      max-height: 0;
      overflow: hidden;
      transition: max-height 300ms ease-out;
    }
    &:has([aria-expanded="true"]) > ul {
      max-height: 100vh;
      transition: max-height 300ms ease-in;
    }
  }
}

@media( min-width: 992px ) {
  #toolbar {

    /* Toolbar buttons in focus have a visible outline.      */
    /* When the button has a <ul> sibling, that outline      */
    /* will be blocked by the <ul> unless we set a z-index.  */
    & :is(button, a):is(:hover, :focus) {
      z-index: 1;
      position: relative; /* z-index won't work without this */
    }

    & > ul > li {
      & > ul {
        height: 0;
        overflow: hidden;
        list-style-type: none;
        position: absolute;

        /* these are all the same thing */
        width: -moz-available;
        width: -webkit-fill-available;
        width: stretch;
        /* ---------------------------- */

        &::before {
          content: '';
          margin-left: -100vw;
          padding-left: 100vw;
          background-color: inherit;
        }
      }
      &:has(:focus, :hover) {
        background-color: var(--primary-dark);
        /*& > button::after {
          content: "\25b2";
        }*/
        & > ul {
          height: auto;
          overflow: visible;
          background-color: inherit;
        } 
      }
    }
  }
}

/* End Toolbar */

caption { 
  caption-side:top; 
  color: black;
  font-weight: bold;
}

table.t2{
  margin-top: 2em;
  width: 35%;
} 

#review_listing ul {
  list-style: none;
}
ul#issues_listing {
  display: none;
}
.red {
  color: #A30000;
}