.ui-calendar {
  &__header {
    background-color: $base-component-bg;
  }

  &__presets {
    border-color: $base-border-color;
  }

  &__preset {
    font-weight: 600;
    border-color: $base-border-color;
    transition: 0.2s;

    &:hover {
      color: var(--primary, $primary);
    }

    &[data-active="true"] {
      color: var(--primary, $primary);
      border-right-color: var(--primary, $primary);
      font-weight: bold;
    }
  }

  &__title {
    font-weight: bold;
  }

  &__tool {
    color: var(--primary, $primary);
    transition: 0.2s;

    &:hover {
      background-color: var(--primary-15, rgba($primary, 0.15));
      border-color: rgba($base-border-color, 0.75);
    }

    &[data-disabled="true"] {
      color: rgba($gray, 0.5);
    }
  }

  &__clock {
    &__minute > .currentMinute,
    &__hour > .currentHour {
      border-color: var(--primary, $primary);
    }
  }

  &__page {
    &__head {
      &.week {
        color: var(--primary, $primary);
      }
    }
    &__cell {
      transition: 0.2s;
      &:hover {
        background-color: var(--primary-15, rgba($primary, 0.15));
      }

      &.selected {
        background-color: var(--primary, $primary);
        color: $white;
        &:hover {
          background-color: var(--primary, $primary);
        }
      }

      &.week {
        color: var(--primary, $primary);
      }

      &.date-other {
        color: rgba($base-color, 0.15);
      }
      &.date-today {
        &::before {
          color: var(--primary, $primary);
        }
      }

      &.select-start,
      &.select-end {
        background-color: var(--primary, $primary);
        color: $white;

        &::before {
          color: $white;
        }
      }
      &.select-hilight {
        background-color: var(--primary-15, rgba($primary, 0.15));
        color: var(--primary, $primary);
      }

      &.disabled {
        background-color: rgba($gray, 0.05);
        color: rgba($gray, 0.5);
      }
    }
    &__column {
      &.week {
        border-right-color: var(--primary, $primary);
      }
    }
  }
}
