.icon {
  display: flex;
}

.upper-content {
  color: var(--default-color);
}

.date-quick-options {
  display: grid;
  grid-template-columns: auto auto auto;

  .date-quick-option {
    display: flex;
    align-items: center;
    justify-content: center;

    a {
      cursor: pointer;

      display: inline-block;

      width: 32px;
      height: 32px;

      font-size: 11px;
      line-height: 32px;
      color: var(--default-color);
      text-align: center;
    }

    &:hover {
      color: #fff;
      background: #578be1;
    }

    .reset-icon {
      position: relative;
      top: 4px;
      font-size: 16px;
    }
  }
}

tui-hint.date-quick-options-hint {
  display: flex;
  flex-direction: column;
  padding: 0;
  background: var(--theme-hack-bg-color, #f6f9fe);

  &.top-left {
    transform: translate(-40px, -35px);
  }
}