@import "./_common-style/_navbar";
@import "./_common-style/_footer";
@import "./_common-style/_sidebar";

body {
  overflow-x: hidden;
}
.dashboard{
  display: block;
}
.dropdown{
  display: none;
}
.content {

  width: 80%;
  margin: 0px;
  padding: 0px;
  min-height: calc(100vh - 80px);

  .report {
    width: 80%;
    margin: 10px auto;
    padding: 30px 10px;

    h2 {
      color: blue;
      text-align: center;
      font-size: 30px;
      font-weight: 550;
      margin-bottom: 15px;
    }

    .main-form {
      input {
        font-weight: 500;
        font-size: 20px;
        border-radius: 5px;
        border: 1px solid gray;
        padding: 5px;
        margin-bottom: 10px;
      }

      .my-table {
        width: 100%;

        thead {
            background-color: #ff9595;
          tr {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr 1fr;

            th {
            text-align: center;
              font-size: 20px;
              font-weight: 600;
              line-height: 20px;
              padding: 10px;
            }
          }
        }

        tbody {
          tr {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr 1fr;
            td {
            text-align: center;
              line-height: 18px;
              font-size: 18px;
              font-weight: 500;
              padding: 5px;

              a {
                color: blue;
                font-size: 18px;
                line-height: 18px;
                text-decoration: none;
                font-weight: 500;
              }
            }
          }
          tr:nth-child(odd){
            background-color: #e4e7ea;
          }
        }
      }
    }

  }

}

@media screen and (max-width: 1024px) {

  .content{
    width: 100%;
    padding: 0;
    min-height: calc(100vh - 80px);
  }
  .dashboard{
    display: none;
  }
  .dropdown{
    display: block;
    padding: 0;
    width: fit-content;
    height: fit-content;
  }
}