.appointment-data {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-column-gap: 15px;
  margin: 1em 0; }
  .appointment-data:first-child {
    margin-top: 0; }
  .appointment-data:last-child {
    margin-bottom: 0; }
  .appointment-data dt {
    grid-column: 1;
    font-weight: bold; }
    .appointment-data dt::after {
      content: ":"; }
  .appointment-data dd {
    grid-column: 2; }

.appointment-description {
  margin: 1em 0; }
  .appointment-description:first-child {
    margin-top: 0; }
  .appointment-description:last-child {
    margin-bottom: 0; }

.calendar {
  margin: 30px 0; }
  @media screen and (max-width: 720px) {
    .calendar {
      margin: 15px 0; } }

.calendar-head {
  margin-bottom: 30px; }
  @media screen and (max-width: 720px) {
    .calendar-head {
      margin-bottom: 15px; } }
  .calendar-head .calendar-head__top {
    display: flex;
    margin-bottom: 15px; }
    @media screen and (max-width: 720px) {
      .calendar-head .calendar-head__top {
        margin-bottom: 7.5px; } }
    .calendar-head .calendar-head__top .top__today {
      margin-right: auto; }
    .calendar-head .calendar-head__top .top__period-controls {
      margin-left: auto; }
  .calendar-head .calendar-head__bottom {
    display: flex;
    margin-top: 15px;
    justify-content: center;
    align-items: center;
    text-align: center; }
    @media screen and (max-width: 720px) {
      .calendar-head .calendar-head__bottom {
        margin-top: 7.5px; } }

.calendar-head {
  margin-bottom: 30px; }
  @media screen and (max-width: 720px) {
    .calendar-head {
      margin-bottom: 15px; } }
  .calendar-head .calendar-head__top {
    display: flex;
    margin-bottom: 15px; }
    @media screen and (max-width: 720px) {
      .calendar-head .calendar-head__top {
        margin-bottom: 7.5px; } }
    .calendar-head .calendar-head__top .top__today {
      margin-right: auto; }
    .calendar-head .calendar-head__top .top__period-controls {
      margin-left: auto; }
  .calendar-head .calendar-head__bottom {
    display: flex;
    margin-top: 15px;
    justify-content: center;
    align-items: center;
    text-align: center; }
    @media screen and (max-width: 720px) {
      .calendar-head .calendar-head__bottom {
        margin-top: 7.5px; } }

.calendar-foot {
  margin-top: 30px; }
  @media screen and (max-width: 720px) {
    .calendar-foot {
      margin-top: 15px; } }
  .calendar-foot > h3 {
    margin-bottom: 1em; }
  .calendar-foot .calendar-foot__categories .categories__category {
    max-width: 300px;
    margin: 2px 0; }
    .calendar-foot .calendar-foot__categories .categories__category .appointment-category {
      padding: 1.875px 3.75px;
      background-color: var(--color); }

.control {
  font-size: 1.5em;
  text-decoration: none; }
  .control.control--prev {
    margin-right: 7.5px; }
  .control.control--next {
    margin-left: 7.5px; }

.calendar-period.week-month .week-month__head .head__days .days__day > abbr, .calendar-period.week .hour-title > abbr, .calendar-period.week .week__head .head__days .days__day .day__title > abbr, .calendar-period.day .hour-title > abbr {
  display: none;
  text-decoration: none; }
@media screen and (max-width: 720px) {
  .calendar-period.week-month .week-month__head .head__days .days__day > span, .calendar-period.week .hour-title > span, .calendar-period.week .week__head .head__days .days__day .day__title > span, .calendar-period.day .hour-title > span {
    display: none; }
  .calendar-period.week-month .week-month__head .head__days .days__day > abbr, .calendar-period.week .hour-title > abbr, .calendar-period.week .week__head .head__days .days__day .day__title > abbr, .calendar-period.day .hour-title > abbr {
    display: unset; } }
.calendar-period .outer-grid {
  display: grid;
  grid-template-columns: 90px 1fr;
  grid-template-areas: "head main"; }
  .calendar-period .outer-grid .outer-grid__head {
    grid-area: head; }
  .calendar-period .outer-grid .outer-grid__main {
    grid-area: main; }
@media screen and (max-width: 1200px) {
  .calendar-period.week-month .outer-grid {
    grid-template-columns: 1fr;
    grid-template-areas: "main"; }
    .calendar-period.week-month .outer-grid .outer-grid__head {
      display: none; } }
.calendar-period.week-month .appointment .appointment-title {
  display: block;
  max-height: 3.6em;
  overflow: hidden; }
.calendar-period.week-month .main-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-auto-rows: max-content; }
.calendar-period.week-month .week-month__head {
  margin-bottom: 15px; }
  @media screen and (max-width: 720px) {
    .calendar-period.week-month .week-month__head {
      margin-bottom: 7.5px; } }
  .calendar-period.week-month .week-month__head .head__days {
    justify-items: center; }
.calendar-period.week-month .week-month__main .week {
  align-items: center; }
  .calendar-period.week-month .week-month__main .week .week__head {
    text-decoration: none;
    color: black; }
  .calendar-period.week-month .week-month__main .week .week__main {
    position: relative; }
    .calendar-period.week-month .week-month__main .week .week__main .main__days {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      grid-template-rows: 1fr;
      border-bottom: 1px solid #e6e6e6;
      z-index: 1; }
      .calendar-period.week-month .week-month__main .week .week__main .main__days .day {
        padding: 7.5px;
        border-right: 1px solid #e6e6e6; }
        .calendar-period.week-month .week-month__main .week .week__main .main__days .day .day__link {
          padding: 0 15px 15px 0;
          color: inherit;
          text-decoration: none; }
        .calendar-period.week-month .week-month__main .week .week__main .main__days .day:first-child {
          border-left: 1px solid #e6e6e6; }
        .calendar-period.week-month .week-month__main .week .week__main .main__days .day.day--today {
          background-color: rgba(229, 120, 0, 0.2); }
        .calendar-period.week-month .week-month__main .week .week__main .main__days .day.day--out {
          background-color: #e6e6e6; }
    .calendar-period.week-month .week-month__main .week .week__main .main__appointments {
      position: relative;
      grid-auto-flow: row dense;
      grid-row-gap: 2px;
      padding-top: calc(1em + 15px);
      min-height: 100px; }
      .calendar-period.week-month .week-month__main .week .week__main .main__appointments .appointment {
        --day-end: calc(var(--day-start) + 1);
        grid-column: var(--day-start)/var(--day-end); }
  .calendar-period.week-month .week-month__main .week:first-child .week__main .main__days {
    border-top: 1px solid #e6e6e6; }
@media screen and (max-width: 720px) {
  .calendar-period.week .outer-grid {
    grid-template-columns: 30px 1fr; } }
.calendar-period.week .day-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-period.week .hour-grid {
  display: grid;
  grid-template-rows: repeat(24, 30px); }
  @media screen and (max-width: 720px) {
    .calendar-period.week .hour-grid {
      grid-template-rows: repeat(24, 60px); } }
.calendar-period.week .hour-quarter-grid {
  display: grid;
  grid-template-rows: repeat(96, 7.5px); }
  @media screen and (max-width: 720px) {
    .calendar-period.week .hour-quarter-grid {
      grid-template-rows: repeat(96, 15px); } }
.calendar-period.week .hour-title {
  display: flex;
  justify-content: center;
  align-items: center; }
.calendar-period.week .full-absolute {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  grid-auto-columns: minmax(0, 1fr); }
.calendar-period.week .day {
  position: relative; }
  .calendar-period.week .day .hour {
    border-bottom: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6; }
  .calendar-period.week .day:first-child {
    border-left: 1px solid #e6e6e6; }
.calendar-period.week .week__head {
  margin-bottom: 15px; }
  @media screen and (max-width: 720px) {
    .calendar-period.week .week__head {
      margin-bottom: 7.5px; } }
  .calendar-period.week .week__head .head__days {
    text-align: center; }
    .calendar-period.week .week__head .head__days .days__day {
      color: black;
      text-decoration: none; }
      @media screen and (max-width: 960px) {
        .calendar-period.week .week__head .head__days .days__day .day__number {
          display: block; } }
.calendar-period.week .week__full-periods .full-periods__head .hour-title {
  height: 100%; }
.calendar-period.week .week__full-periods .full-periods__main .day .day__hours .hour {
  height: 100%;
  border-top: 1px solid #e6e6e6; }
.calendar-period.week .week__full-periods .full-periods__main .day .day__appointments {
  position: relative; }
  .calendar-period.week .week__full-periods .full-periods__main .day .day__appointments .appointment {
    min-height: 30px; }
.calendar-period.week .week__main .main__content .day .day__appointments {
  grid-column-gap: 2px; }
  .calendar-period.week .week__main .main__content .day .day__appointments .appointment {
    --hour-quarter-end: calc(var(--hour-quarter-start) + 4);
    grid-row: calc(var(--hour-quarter-start) + 1)/calc(var(--hour-quarter-end) + 1); }
@media screen and (max-width: 720px) {
  .calendar-period.day .outer-grid {
    grid-template-columns: 30px 1fr; } }
.calendar-period.day .hour-grid {
  display: grid;
  grid-template-rows: repeat(24, 30px); }
.calendar-period.day .hour-quarter-grid {
  display: grid;
  grid-template-rows: repeat(96, 7.5px); }
.calendar-period.day .day__all-period {
  align-items: center; }
  .calendar-period.day .day__all-period .all-period__head {
    text-align: center; }
  .calendar-period.day .day__all-period .all-period__main {
    display: grid;
    min-height: 30px;
    grid-auto-rows: 30px;
    grid-auto-flow: column;
    border: 1px solid #e6e6e6; }
.calendar-period.day .day__content .content__head {
  justify-content: center; }
  .calendar-period.day .day__content .content__head .hour-title {
    display: flex;
    align-items: center; }
.calendar-period.day .day__content .content__main {
  position: relative;
  border-left: 1px solid #e6e6e6;
  border-right: 1px solid #e6e6e6; }
  .calendar-period.day .day__content .content__main .main__hours .hour {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    border-bottom: 1px solid #e6e6e6; }
    .calendar-period.day .day__content .content__main .main__hours .hour .hour__half {
      border-bottom: 1px dashed #e6e6e6; }
  .calendar-period.day .day__content .content__main .main__appointments {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    grid-auto-columns: 1fr;
    grid-column-gap: 2px; }
    .calendar-period.day .day__content .content__main .main__appointments .appointment {
      --hour-quarter-end: calc(var(--hour-quarter-start) + 4);
      grid-row: calc(var(--hour-quarter-start) + 1)/calc(var(--hour-quarter-end) + 1); }

.appointment-calendar-view {
  --color: #E57800;
  position: relative;
  font-size: 12px;
  line-height: 1.2;
  hyphens: auto;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  overflow-wrap: break-word;
  background-color: var(--color);
  z-index: 2; }
  .appointment-calendar-view.appointment-calendar-view--details {
    cursor: pointer; }
  @media screen and (max-width: 720px) {
    .appointment-calendar-view {
      cursor: pointer; } }
  .appointment-calendar-view .appointment-calendar-view__essential {
    padding: 1.875px 3.75px;
    max-height: 100%;
    overflow: hidden; }
    @media screen and (max-width: 720px) {
      .appointment-calendar-view .appointment-calendar-view__essential {
        padding: 7.5px 3.75px; }
        .appointment-calendar-view .appointment-calendar-view__essential .appointment-time {
          display: none; } }
  .appointment-calendar-view .appointment-calendar-view__details {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    top: 100%;
    left: 0;
    padding: 7.5px;
    background-color: inherit;
    border: 1px solid #e6e6e6;
    transition: opacity 0.125s; }
    .appointment-calendar-view .appointment-calendar-view__details .appointment-title,
    .appointment-calendar-view .appointment-calendar-view__details .appointment-time {
      display: none; }
      @media (min-width: 720px) {
        .appointment-calendar-view .appointment-calendar-view__details .appointment-title + *,
        .appointment-calendar-view .appointment-calendar-view__details .appointment-time + * {
          margin-top: 0; } }
    @media screen and (max-width: 720px) {
      .appointment-calendar-view .appointment-calendar-view__details .appointment-title,
      .appointment-calendar-view .appointment-calendar-view__details .appointment-time {
        display: block;
        margin: 1em 0; }
        .appointment-calendar-view .appointment-calendar-view__details .appointment-title:first-child,
        .appointment-calendar-view .appointment-calendar-view__details .appointment-time:first-child {
          margin-top: 0; }
        .appointment-calendar-view .appointment-calendar-view__details .appointment-title:last-child,
        .appointment-calendar-view .appointment-calendar-view__details .appointment-time:last-child {
          margin-bottom: 0; } }
    .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper {
      margin: 1em 0; }
      .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper:first-child {
        margin-top: 0; }
      .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper:last-child {
        margin-bottom: 0; }
      .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper .appointment-category-list {
        display: inline; }
        .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper .appointment-category-list .appointment-category-list__category-element {
          display: inherit; }
          .appointment-calendar-view .appointment-calendar-view__details .details__category-wrapper .appointment-category-list .appointment-category-list__category-element .appointment-category {
            display: inherit; }
  .appointment-calendar-view.appointment-calendar-view--details:hover, .appointment-calendar-view.appointment-calendar-view--details.appointment-calendar-view--show-details {
    z-index: 3; }
    .appointment-calendar-view.appointment-calendar-view--details:hover .appointment-calendar-view__details, .appointment-calendar-view.appointment-calendar-view--details.appointment-calendar-view--show-details .appointment-calendar-view__details {
      opacity: 1;
      pointer-events: all; }
  @media screen and (max-width: 720px) {
    .appointment-calendar-view:hover, .appointment-calendar-view.appointment-calendar-view--show-details {
      z-index: 3; }
      .appointment-calendar-view:hover .appointment-calendar-view__details, .appointment-calendar-view.appointment-calendar-view--show-details .appointment-calendar-view__details {
        opacity: 1;
        pointer-events: all; } }

.list-period .grouped-appointment-list {
  margin: 30px 0; }
  @media screen and (max-width: 720px) {
    .list-period .grouped-appointment-list {
      margin: 15px 0; } }
  .list-period .grouped-appointment-list > h2 {
    margin-bottom: 0.5em; }
.list-period .appointment-list {
  display: grid;
  display: -ms-grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 30px;
  justify-items: stretch; }
  @media (min-width: 720px) and (max-width: 960px) {
    .list-period .appointment-list {
      grid-template-columns: repeat(3, 1fr); } }
  @media (min-width: 360px) and (max-width: 720px) {
    .list-period .appointment-list {
      grid-template-columns: repeat(2, 1fr);
      grid-gap: 15px; } }
  @media screen and (max-width: 360px) {
    .list-period .appointment-list {
      grid-template-columns: repeat(1, 1fr);
      grid-gap: 7.5px; } }

.appointment-list-view {
  padding: 15px;
  height: 100%;
  background-color: #e6e6e6; }
  @media screen and (max-width: 720px) {
    .appointment-list-view {
      padding: 7.5px; } }
  .appointment-list-view .appointment-title,
  .appointment-list-view .appointment-time {
    display: block; }
  .appointment-list-view .appointment-title {
    margin-top: 1em;
    font-weight: bold; }
    .appointment-list-view .appointment-title:first-child {
      margin-top: 0; }
  .appointment-list-view .appointment-time {
    margin-bottom: 1em;
    font-size: 0.75rem; }
    .appointment-list-view .appointment-time:last-child {
      margin-bottom: 0; }
  .appointment-list-view .appointment-list-view__category-wrapper .appointment-category-list {
    display: inline; }
    .appointment-list-view .appointment-list-view__category-wrapper .appointment-category-list .appointment-category-list__category-element {
      display: inline; }
      .appointment-list-view .appointment-list-view__category-wrapper .appointment-category-list .appointment-category-list__category-element .appointment-category {
        display: inline; }