.programme {
  margin-inline: 1vw;
  max-width: 76vw;
  overflow-x: auto;
  @include Scrollbar;
  padding-left: 1vw;
}
.Periods {
  display: flex;
  gap: 1vw;

  .Period {
    background: var(--primary);
    color: var(--white);
    font-weight: 600;
  }
}

.block {
  z-index: 999;
  cursor: pointer;
  min-width: 8.5vw;
  font-size: 1.2vw;
  font-weight: bold;
  height: 6vw;
  border-radius: 0.6vw;
  @include Flex;
  margin-bottom: 1vw;
  padding: 0.5vw;
  // @include Shadow;
}
.Single_Day {
  display: flex;
  gap: 1vw;
}
.Sunday_Day {
  .Day_Name {
    &::after {
      background-color: #579ad7;
    }
  }
}
.Monday_Day {
  .Day_Name {
    &::after {
      background-color: #fb7d5b;
    }
  }
}
.Tuesday_Day {
  .Day_Name {
    &::after {
      background-color: #fcc43e;
    }
  }
}
.Wednesday_Day {
  .Day_Name {
    &::after {
      background-color: #1b5891;
    }
  }
}
.Thursday_Day {
  .Day_Name {
    &::after {
      background-color: #8eb9e1;
    }
  }
}

.Friday_Day {
  .Day_Name {
    &::after {
      background-color: red;
    }
  }
}
.Saturday_Day {
  .Day_Name {
    &::after {
      background-color: green;
    }
  }
}
.Day_Name {
  color: var(--primary);
  background-color: var(--bg2);
  position: relative;
  &::after {
    position: absolute;
    content: "";
    top: auto;
    right: 0;
    width: 10%;
    height: 100%;
    border-top-right-radius: 0.6vw;
    border-bottom-right-radius: 0.6vw;
  }
}
.Day_Details {
  color: var(--primary);
  border: 0.2vw solid var(--primary);
  align-items: flex-start;
  justify-content: space-between;

  flex-direction: column;
  h5 {
    font-size: 1vw;
    font-weight: bold;
  }
  h6 {
    font-size: 0.8vw;
    color: var(--text);
  }
  div {
    display: flex;
    gap: 10px;
    svg {
      color: #fb7d5b;
    }
    p {
      font-size: 0.8vw;
      color: var(--text);
    }
  }

  &:hover {
    background: var(--primary);
    color: var(--white);
    h6 {
      color: var(--white);
    }
    div {
      display: flex;
      gap: 10px;
      svg {
        color: white;
      }
      p {
        color: var(--white);
      }
    }
  }
}
.center {
  @include Flex;
}
.Add_New_Day {
  background: #f5f5f5;
  border: 2px solid #a098ae;
  span {
    width: 30%;
    height: 50%;
    border-radius: 50%;
    background: var(--primary);
    @include Flex;
    svg {
      color: var(--white);
    }
  }
}
.programme_table {
  display: flex;
  flex-direction: column;
}
.programmer_header {
  display: flex;
  width: 90%;
  margin-inline: auto;
  justify-content: space-between;
  margin-bottom: 2vw;
}
@media print {
  .programme_table {
    background-color: red !important;
  }
}
